Endlich hatte ich mal wieder etwas Zeit gefunden, um mein neuestes Theme ‚ELF‘ zu vollenden. Es ist ein responsives, deutschsprachiges WordPress-Theme im aktuell modernen Kachel-Look mit einer Menge cooler Features und CSS3-Funktionen.

Theme 'ELF' im Kachel-Design

Das Theme glänzt mit vielfältigen Theme-Optionen mit denen es auf einfachste Weise den eigenen Bedürfnissen angepasst werden kann. So kannst du beispielsweise die Darstellung der Artikel auf den Blogseiten anpassen, Featured-Artikel in verschiedenen Varianten nutzen und vieles mehr.

Wie ich Eingangs schon erwähnte, ist das Theme auf den Blogseiten im Kachel-Design gehalten. Dabei kannst du wählen, ob der Hintergrund der Kacheln farblich einheitlich oder unterschiedlich dargestellt werden soll. Des Weiteren kannst du aus einer ganzen Reihe von Google Web Fonts deine Lieblingsschriftart auswählen und über die Theme-Optionen einstellen.

Was gibt’s noch:

  • Layout ist komplett CSS-basiert (keine Grafiken)
  • Cross-Browser kompatibel (Chrome, Firefox, Internet Explorer 9, Android und iOS 6 getestet)
  • responsives Layout (CSS3 Media Queries) für optimale Darstellung auf mobilen Endgeräte inklusive Flyout-Navigationsmenü
  • Post-Thumbnail-Funktion integriert (abschaltbar)
  • vorbereitetes Gästebuch-Template
  • Template für Artikelübersicht
  • Sidebar
  • vielfältige Theme-Optionen
  • Social Media-Integration (Twitter, Facebook, Google+, Xing, Tumblr, Picasa, flickr, Last.fm, Youtube und RSS-Feed)
  • Custom-Background- und Custom-Header-Funktion
  • Shortcodes für mehrspaltiges Layout, Info-Boxen und Buttons
  • Unterstützung von WordPress Post-Formats
  • Schriftartauswahl (Google Web Fonts)
  • ab WordPress Version 3.4

Eine Live-Demo gibt es hier:

Den Download findest du unter folgendem Link:

Das Theme ist in einer weiteren Variante mit anpassbaren Layoutelementen und Kachelfarben verfügbar. Den Download findest du unter folgendem Link:

Das Theme ist kostenlos und kann uneingeschränkt genutzt, verändert und weitergegeben werden. Einzige Voraussetzungen: der Autor im Fußbereich darf nicht gelöscht und das Theme nicht von Dritten vertrieben werden.

Schauen wir uns die Theme-Optionen im Einzelnen an. Diese findest du im „Design“-Menü unter dem Punkt „Theme Optionen“, nachdem das Theme aktiviert wurde:

Theme Optionen

  • Anzeige Logo

Wenn diese Option aktiviert ist, wird im Kopfbereich ein Logo angezeigt. Das voreingestellte Logo kann übrigens bequem über das „Design“-Menü > „Kopfbereich“ verändert werden (s. FAQs unten).

  • Anzeige Bloginfo

Mit dieser Option kann unterhalb des Logos eine Info zum Blog eingeblendet werden. Es besteht dabei die Wahl zwischen Blogtitel und/oder Blogbeschreibung. Standardmäßig erfolgt keine Anzeige.

  • Anzeige Top-Navigation

Wenn die Option gewählt wurde, wird ein am oberen Bildschirmrand fixiertes Dropdown-Menü mit Kategorien, Schlagworten und Monatsarchiv angezeigt. Das Menü wandert beim Scrollen mit.

  • Anzeige Anzahl Artikel und Kommentare

Mit dieser Option kann im Fußbereich die Anzahl der veröffentlichten Artikel und erhaltenen Kommentare angezeigt werden.

  • Beschriftung für oben gehaltene Artikel

Bei hervorgehobenen Artikeln (Sticky-Posts) wird der Artikel unter anderem durch ein Banner speziell gekennzeichnet. Mit dieser Option besteht die Möglichkeit einen eigenen Text zu hinterlegen. Als Standard wird „Hervorgehobener Artikel“ angezeigt.

  • Copyright Text

Als Standard wird der Name des Blogs als Copyright-Hinweis ausgegeben. Bei Bedarf kann hier ein eigener Copyright-Hinweis eintragen werden.

  • Google Analytics Code

Wer Google Analytics zur Besucherauswertung nutzt, kann hier den von der Analytics-Webseite erhaltenen Tracking-Code einfügen. Achtet darauf, dass ihr den vollständigen Code (inkl. <script>/</script>) kopiert und einfügt.

Featured Artikel

  • Anzeige Featured-Artikel

Mittels dieser Option wird gesteuert, ob Featured-Artikel genutzt werden sollen. Featured-Artikel bieten eine spezielle Artikel-Auswahl, welche vor dem Artikelbereich angezeigt werden und dem Besucher so besonders ins Auge stechen.

Dabei kann zwischen den meistkommentierten Artikelnzufällig ausgewählten Artikeln, die bei jedem aktualisieren der Seite neu zusammengestellt werden oder  hervorgehobenen Artikeln (Sticky-Posts) gewählt werden.

  • Featured-Artikel nur auf der Startseite

Wenn Featured-Artikel aktiviert sind, werden diese standardmäßig auf allen Blogseiten ausgegeben. Sollen die Featured-Artikel nur jeweils auf der ersten Seite der Blogseiten angezeigt werden, kann das mit dieser Option erreicht werden.

  • Anzahl Featured-Artikel

Mit dieser Option wird die Anzahl der angezeigten Featured-Artikel bestimmt.

  • Überschrift für Featured-Artikel

Als Standard wird „Meistkommentierte Artikel“, „Zufällig ausgewählte Artikel“ oder „Ausgewählte Artikel“, abhängig von der Art, als Überschrift ausgegeben. Mit dieser Option kann eine eigene Überschrift genutzt werden („Top-Story“, „Für dich ausgewählt“, „Lieblingsartikel“, „Das Beste vom Besten“, oder was auch immer).

  • Anzeige Vorschau für Featured-Artikel

Wenn diese Option aktiviert ist, wird eine kurze Vorschau auf den Artikel (excerpt) angezeigt. Die Länge der Kurzfassung kann übrigens mit der Option „Anzahl Zeichen für Kurzfassung“ angepasst werden.

  • Anzeige hervorgehobene Artikel auf Startseite

Diese Option ist lediglich interessant, wenn als Featured-Artikel „hervorgehobene Artikel“ gewählt wurden, ansonsten hat diese Option keine Auswirkungen. Generell werden sogenannte Sticky- oder Featured-Posts auf der Startseite als erste Artikel, vor den nicht hervorgehobenen Artikeln angezeigt. Wenn nun als Featured-Artikel ebenfalls diese Artikel angezeigt werden, würden diese doppelt, sowohl als Featured-Artikel als auch auf der Startseite angezeigt. Wer das möchte, aktiviert diese Option. Standardmäßig werden die hervorgehobenen Artikel auf der der Startseite nicht angezeigt.

Kurzfassung von Artikeln

  • Anzahl Wörter für Kurzfassung

Mit dieser Option kann die Anzahl der Worte für die Kurzfassung von Artikeln (excerpt) festlegt werden. WordPress gibt standardmäßig 55 Wörter aus.

  • More-Link bei Kurzfassung

Wenn bei der Option „Anzeige der Artikel“ die Kurzfassung der Artikel gewählt oder die Featured-Artikel mit Vorschau gezeigt werden sollen, kann mit dieser Option ein Weiterlesen-Button nach dem Text angezeigt werden. Standardmäßig wird lediglich ein nicht klickbares […] ausgegeben.

Artikel Optionen

  • Anzeige der Artikel

Die Artikel können auf der Startseite, im Archiv und den Übersichten

    • normal (bis zum Weiterlesen-Link)
    • vollständig (ohne Weiterlesen-Link) oder in einer
    • Kurzfassung (nur Text)

angezeigt werden. Im Suchergebnis wird immer die Kurzfassung ausgegeben.

  • Post-Thumbnails verwenden

Mit dieser Option wird die Post-Thumbnail-Funktion aktiviert. Damit besteht die Möglichkeit jedem Artikel ein Artikelbild zuzuordnen. Das Theme verwendet das Artikelbild bei Aktivierung der Option an verschiedenen Stellen.

  • Anzeige Autorinformationen

Wenn die Option aktiviert ist, werden in der Einzelanzeige der Artikel Informationen zum Autor des Artikels angezeigt. Die Autorinformationen werden übrigens in der Benutzerverwaltung von WordPress unter „Biographische Angaben“ erfasst.

  • Anzeige Artikelinformationen

Ist diese Option aktiviert, werden Artikelinformationen, wie das Veröffentlichungsdatum, die Kategorie(n) und Tags, ausgegeben. Diese Option hat Auswirkungen auf die Kachelanzeige der Blogseiten sowie die Einzelanzeige von Artikeln.

  • Anzeige Autor

Wird die Option zur Anzeige von Artikelinformationen genutzt, kann mit dieser Option der Name des Artikelautors angezeigt werden.

  • Anzeige Artikelempfehlung

Unterhalb eines Artikels kann in der Einzelansicht eine Empfehlung für themenverwandte Artikel ausgegeben werden. Die Verwandschaft der Artikel wird anhand des ersten verwendeten Schlagworts ermittelt.

  • Anzahl Artikel für Artikelempfehlung

Standardmäßig werden vier Artikel als Artikelempfehlung ausgegeben. Mit dieser Option kannst du den vorgegebenen Wert übersteuern.

  • Überschrift für Artikelempfehlung

Mit dieser Option kann eine eigene Überschrift für die Artikelempfehlung definiert werden. Standard ist „Thematisch ähnliche Artikel“.

  • Anzeige Artikelnavigation

In der Einzelansicht kann unterhalb des Artikels eine Artikelnavigation (nächster/vorheriger Artikel) eingeblendet werden.

Artikelübersicht

Wie bereits in der Einleitung erwähnt, verfügt das Theme über ein vorbereitetes Template für eine Artikelübersicht.

Mit den Optionen

  • Anzeige Kategorieübersicht
  • Anzeige Schlagwortübersicht
  • Anzeige Jahresarchiv
  • Anzeige Monatsarchiv
  • Anzeige Tagesarchiv
  • Anzeige Artikelliste

werden die Inhalte dafür ausgewählt.

Theme-Design

  • Einfarbige Kacheln

Standardmäßig werden die Hintergründe der Kacheln auf den Blogseiten der Reihenfolge nach mit vier verschiedenen Farbverläufen ausgegeben. Mit dieser Option werden alle Kacheln mit dem gleichen Farbverlauf angezeigt.

  • Schriftarten

Mit den Optionen

    • Schriftart für Überschriften
    • Standard-Schriftart und
    • Standard-Schriftgröße

können die voreingestellten Schriftarten verändert sowie die Schriftgröße angepasst werden. Zur Auswahl stehen zahlreiche Google Web Fonts.

Soziale Netzwerke

In diesem Bereich können Verlinkungen zu genutzten sozialen Netzwerken eingerichtet werden. Folgende Netzwerke stehen zur Verfügung:

  • Twitter
  • Facebook
  • Google+
  • Xing
  • Tumblr
  • Picasa
  • flickr
  • Last.fm
  • Youtube
  • Artikel-RSS-Feed

Durch aktivieren des Kontrollkästchens wird auf der Webseite das entsprechende Icon im Kopfbereich eingeblendet. Damit die Verknüpfung auch auf das Profil verlinkt, ist die URL in das Eingabefeld einzutragen.

Wenn im Frontend die Maus über das Icon bewegt wird, wird ein Tooltip-Text (z.B. „Mein Twitter-Profil“) ausgegeben. Dieser Tooltip kann durch einen eigenen Text entsprechend ersetzt werden.

Fehlt dir ein wichtiges Netzwerk? Dann schreib mir eine persönliche Nachricht oder einen Kommentar.

Frequently Asked Questions (FAQ)

F: Wie installiere ich das Theme?

A: Lad dir diese Datei herunter. Anschließend loggst du dich im Backend deiner WordPress Installation ein und wählst aus dem Menü „Design“ den Punkt „Themes“. Dort wechselst du zum Register „Themes installieren“ und wählst über den Button „Datei auswählen“ die eben heruntergeladene Zip-Datei aus.

Ein Klick auf den Button „Jetzt installieren“ startet die Installation. Klick auf „Aktivieren“ und schon sieht deine Webseite heiß aus.

Ich habe dazu ein kurzes Video-Tutorial erstellt:

Nun solltest du dich an das Anpassen und Ausprobieren der Theme-Optionen machen.

F: Ich würde gerne ein anderes Hintergrundbild nutzen.

A: Im Menü „Design“ unter dem Punkt „Hintergrund“ hast du die Möglichkeit den Hintergrund nach deinem Geschmack anzupassen.

Du kannst entweder ein neues Hintergrundbild von deinem Rechner hochladen, oder ein Bild aus der Mediathek auswählen. Ebenso kannst du das Hintergrundbild komplett entfernen und stattdessen einen einfarbigen Hintergrund nutzen.

Auch hier habe ich ein Video vorbereitet:

F: Ich würde gerne ein anderes Logo nutzen.

A: Im Menü „Design“ unter dem Punkt „Kopfzeile“ hast du die Möglichkeit ein anderes Logo einzubinden.

Du kannst entweder ein neues Logo von deinem Rechner hochladen, oder ein Bild aus der Mediathek auswählen. Beachte bitte, dass das Theme auf eine Größe von 220 x 80 Pixeln angepasst ist und die Theme-Option „Anzeige Logo“ aktiviert sein muss.

Magst du lieber Video gucken?

F: Wie richte ich die Artikelübersicht ein?

A: Erstelle eine neue Seite und wähle als Template „Artikelübersicht“.

Fertig. Vergiss nicht in den Theme-Optionen die Inhalte für die Artikelübersicht zu aktivieren. Sonst siehst du nur eine leere weiße Seite.

F: Wie kann ich das Gästebuch-Template nutzen?

A: Erstelle eine neue Seite, schreib eine nette Einleitung für deine Gäste und wähle als Template „Gästebuch“.

Fertig. Kommentare aktivieren nicht vergessen.

F: Welche Größe haben die Post-Thumbnails?

A: Die Artikel-Thumbnails haben eine Größe von 100 x 100 Pixel. Für die Artikelempfehlung sind die Thumbs 25 x 25 Pixel groß. Optimal sind Bilder mit identischer Höhe und Breite.

F: Darf ich das Template verändern?

A: Kein Problem. Lass deiner Kreativität freien Lauf. Einzige Voraussetzung: der Link und Hinweis auf den Theme-Autor (mich) im Fußbereich darf nicht entfernt werden.

F: Und wenn ich den Autor-Link doch entfernen möchte?

A: Wenn du den Hinweis unbedingt löschen möchtest, halte ich es für fair, wenn du eine kleine Spende in Höhe von 10 € für meine Kaffeekasse gibst. Schreib mir bitte eine Nachricht mittels des Kontaktformulars. Ich werde dir dann die Bankverbindung für die Überweisung mitteilen.

F: Wie kann ich ein Favicon nutzen?

A: Schau dir mal diesen Artikel an.

Changelog

v1.0 – 13.02.2013

  • Release