Eine nüchterne, unkomplizierte Jekyll-Vorlage für Unternehmen.
Hier können Sie eine Vorschau des Themas ansehen
Reaktionsschnell : sofort einsatzbereite Unterstützung für alle Bildschirmgrößen, sei es Smartphones, Laptops, Tablets ...
Mehrsprachig : Einfache Verwaltung von Seiten, Menü, URL, Daten und Sitemap in mehreren Sprachen
Anpassbar : Themenfarben, Menü und soziale Elemente können über eine zentrale Konfigurationsdatei geändert werden
Viele Widgets : Tabs, Mini-Beiträge, Spotlight, Funktionsauflistungen und mehr können einfach eingefügt werden, ohne sich Gedanken über ihre Interna machen zu müssen
Viele Vorlagen : Kontaktformulare, Navigationsmenüs und andere können dank benutzerdefinierter Jekyll-Includes einfach eingefügt werden
Vektorbilder : Die Themenbilder sind vektorisiert, werden auf jedem Display reibungslos dargestellt und können dynamisch gestaltet werden
Bereit für die DSGVO : gebündelt mit einem Cookie-Zustimmungs-Plugin und einer Standard-Datenschutzrichtlinie, die der DSGVO entspricht
SEO-fähig : Sitemap, robots.txt und Tags werden automatisch für die Website generiert
Leicht : SVG-Bilder, Miniaturansichten und Lazy Loading für Rasterbilder, wenige Bibliotheken
Leistungsfähig : paralleles Laden und Ausführen von Assets, Unterstützung für verzögertes Laden, Minimierung von Assets, komprimierter kritischer Pfad
Gehärtet : Formularvalidierung, Recaptcha, verifizierte Bibliotheken
Fügen Sie diese Zeile zur Gemfile
Ihrer Jekyll-Site hinzu:
gem "jekyll-theme-consulting"
Und fügen Sie diese Zeile zur _config.yml
Ihrer Jekyll-Site hinzu:
theme : jekyll-theme-consulting
Und dann ausführen:
$ bundle
Oder installieren Sie es selbst als:
$ gem install jekyll-theme-consulting
Für diejenigen, die mit der Funktionsweise von Jekyll nicht vertraut sind, besuchen Sie jekyllrb.com für alle Details oder informieren Sie sich nur über die Grundlagen des Titelthemas, des Schreibens von Beiträgen und des Erstellens von Seiten.
Kopieren Sie die Datei _config.yml
aus dem Theme-Repository in das Stammverzeichnis Ihres Website-Ordnerbaums. Im folgenden Abschnitt wird erläutert, welche Auswirkungen die Einstellungen haben und wie Sie _config.yml
richtig konfigurieren.
Sie können die folgenden benutzerdefinierten Parameter in _config.yml
verwenden.
title
und subtitle
werden nebeneinander angezeigt:
Für jede URL, die Sie eingeben, werden soziale Symbole angezeigt, darunter facebook_url
usw.
Ihre Kontaktinformationen können in Kontaktformularen, in der Fußzeile oder anderswo verwendet werden.
Das Kontaktformular wird mit dem Recaptcha-Plugin von Google validiert. Zuerst müssen Sie [Ihre Website registrieren], um das Plugin zu aktivieren. Google stellt Ihnen einen clientseitigen Integrationsschlüssel zur Verfügung: Kopieren Sie ihn in _config.yml
unter recaptcha.sitekey
.
Das Herunterladen und Rendern von Bildern kann verschoben werden, bis sie im Ansichtsfenster angezeigt werden. Dadurch verkürzt sich die Ladezeit der Webseite, ohne dass dies Auswirkungen auf den angezeigten Inhalt hat, da die Bilder außerhalb des Bildschirms liegen.
Es gibt 2 Möglichkeiten:
Die Browserunterstützung für Lazy-Loading ist unterschiedlich, daher wird empfohlen, sich für die erste Lösung zu entscheiden.
class="lazy-loading"
src
mit dem Pfad zur Platzhalterdateidata-src
mit dem Pfad zur InhaltsdateiVor:
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Nach:
< img class =" lazy-loading " src =" {{ 'assets/images/placeholder.jpg' | absolute_url }} " data-src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
loading="lazy"
hinzufügenVor:
< img src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Nach:
< img loading =" lazy " src =" {{ 'assets/images/content.jpg' | absolute_url }} " />
Diese Funktionalität wird nicht von allen Browsern unterstützt!
Es wird empfohlen, das webp
-Format zu verwenden.
Bei einer bestimmten Größe und Komprimierungsstufe (Qualität) sind die WebP-Dateien mindestens halb so groß und fühlen sich flüssiger an.
Bearbeiten Sie im Repository Ihrer eigenen Website die Datei _config.yml
:
url : " https://<github-account-name>.github.io/<repository-name> "
Erstellen Sie die Website mit:
$ JEKYLL_ENV=production bundle exec jekyll build
Übertragen Sie Ihre gesamte Arbeit auf den aktuellen Zweig.
Erstellen Sie einen Zweig mit dem Namen gh-pages
:
$ git checkout -b gh-pages
Und schließlich ersetzen Sie den Inhalt des Repositorys durch die generierten Webseiten:
$ mkdir ~/backup
$ mv ./* ~/backup/
$ mv ~/backup/.git ./
$ mv ~/backup/_site/* ./
$ git add .
$ git commit -m "First draft"
Der Inhalt des Repositorys wird im Home-Verzeichnis des Benutzers gesichert.
Und schließlich auf Github pushen
$ git push --u origin gh-pages
Bearbeiten Sie im Verzeichnis Ihrer eigenen Website die Datei _config.yml
:
url : " https:<domain-name> "
Erstellen Sie die Website mit:
$ JEKYLL_ENV=production bundle exec jekyll build
Kopieren Sie den Inhalt des Ordners _site
auf Ihren Server, höchstwahrscheinlich in www
.
Konfigurieren Sie bei Bedarf Ihren Server für die Bereitstellung dieses Verzeichnisses.
Fehlerberichte und Pull-Requests sind auf GitHub unter https://github.com/apehex/jekyll-theme-consulting willkommen. Dieses Projekt soll ein sicherer, einladender Raum für die Zusammenarbeit sein, und von den Mitwirkenden wird erwartet, dass sie sich an den Verhaltenskodex der Mitwirkendenvereinbarung halten.
Um Ihre Umgebung für die Entwicklung dieses Themas einzurichten, führen Sie bundle install
aus.
Um das Theme zu testen, führen Sie bundle exec jekyll serve
aus und öffnen Sie Ihren Browser unter http://localhost:4000
. Dadurch wird ein Jekyll-Server gestartet, der das Theme verwendet. Fügen Sie wie gewohnt Seiten, Dokumente, Daten usw. hinzu, um den Inhalt des Themas zu testen. Wenn Sie Änderungen am Design und an Ihren Inhalten vornehmen, wird Ihre Website neu generiert und Sie sollten die Änderungen nach einer Aktualisierung wie gewohnt im Browser sehen.
Wenn das Theme veröffentlicht wird, werden nur die Dateien in _layouts
, _includes
, _sass
und mit Git verfolgte assets
gebündelt. Um dem Theme-Gem ein benutzerdefiniertes Verzeichnis hinzuzufügen, bearbeiten Sie bitte den regulären Ausdruck in jekyll-theme-consulting.gemspec
entsprechend.
Inspiriert von der Arbeit von @ajlkn.
Verwendet die Basisvorlage des Cookie-Zustimmungs-Plugins.
Verwendet das einfache Jekyll-Such-Plugin.
Weltraumbild im Banner: die Säulen der Schöpfung, mit freundlicher Genehmigung der NASA.
Das Thema ist als Open Source unter den Bedingungen von CC-BY-NC-SA-4.0 verfügbar.