Und da ist es: mein zehntes WordPress-Theme. ‚ZEHN‘ ist ein responsives, modernes, deutschsprachiges WordPress-Theme mit vielen coolen Features und CSS3-Funktionen.
Es gibt vielfältige Theme-Optionen mit denen das Theme auf einfache 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 oder auch einzelne Theme-Elemente ausblenden.
Zur Auswahl stehen 5 vordefinierte Farbschemas. Falls dir die Farbschemas nicht zusagen, kannst du auch deine eigenen Farben einstellen. Ebenso stehen weitere voreingestellte Google Web Fonts für die Überschriften sowie als Standardschriftart zur Verfügung, falls dir die Standardschriftarten nicht gefallen.
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
- Post-Thumbnail-Funktion integriert
- vorbereitetes Gästebuch-Template
- Template für Artikelübersicht
- Sidebar sowie 4 Widgetbereiche im Footer
- 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
- 5 Farbschemas (orange, rot, blau, dunkelgrau und oliv) und individuelle Farbzusammenstellung
- 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 natürlich kostenlos und kann uneingeschränkt genutzt, verändert und weitergegeben werden. Einzige Voraussetzung: die Theme-Credits (also der Autor) im Fußbereich darf nicht gelöscht 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
- Breite des Inhaltsbereichs
Mit dieser Option kann die Breite des Inhaltsbereichs verändert werden. Der Inhaltsbereich hat standardmäßig eine Breite von 1200 Pixeln. Wem das nicht reicht, oder einen kleineren Inhaltsbereich möchte, kann hier einen eigenen Wert (XXX% oder XXXpx) eintragen.
- 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 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 nach dem Artikel-Titel ein Hinweis-Banner eingeblendet. 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 sind eine spezielle Artikel-Auswahl, die zwischen Sidebar und Artikelbereich angezeigt werden.
Dabei kann zwischen den meistkommentierten Artikeln, zufällig ausgewählten Artikeln, die bei jedem aktualisieren der Seite neu zusammengestellt werden oder hervorgehobenen Artikeln (Sticky-Posts) gewählt werden.
- Anzahl Featured-Artikel
Mit dieser Option wird die Anzahl der angezeigten Featured-Artikel bestimmt.
- Überschrift 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 („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“ verändert 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 Zeichen für Kurzfassung
Mit dieser Option kann die Anzahl der Zeichen für die Kurzfassung von Artikeln (excerpt) festlegt werden. WordPress-Standard sind 55 Zeichen.
- 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, den Übersichten sowie dem Suchergebnis
- normal (bis zum Weiterlesen-Link)
- vollständig (ohne Weiterlesen-Link) oder in einer
- Kurzfassung (nur Text)
angezeigt werden.
- Post-Thumbnails verwenden
Mit dieser Option wird die Post-Thumbnail-Funktion aktiviert. Damit besteht die Möglichkeit jedem Artikel ein Artikelbild zuzuordnen, welches dann im Theme an verschiedenen Stellen angezeigt wird.
- Anzeige Artikelinformationen
Ist diese Option aktiviert, werden Artikelinformationen, wie Veröffentlichungsdatum, Kategorie und Tags, ausgegeben.
- Anzeige Autor
Wird die Option zur Anzeige von Artikelinformationen genutzt, kann mit dieser Option der Name des Artikelautors angezeigt werden.
Artikelempfehlung und Artikelnavigation
- Anzeige Artikelempfehlung
Unterhalb eines Artikels kann eine Empfehlung für themenverwandte Artikel angezeigt 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 oben/Anzeige Artikelnavigation unten
Oberhalb bzw. unterhalb des Artikels kann 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.
Sidebar
- Anzeige Sidebar
- Anzeige Footer-Widget-Bereich
Wenn diese Option aktiviert wurde, wird im unteren Teil ein Bereich mit vier Widget-Feldern angezeigt. Die Widgets werden über den Menüpunkt „Widgets“ im „Design“-Menü festgelegt.
Theme-Design
- Farbschema
Mit dieser Option wird das Farbschema gewählt. Zur Auswahl stehen neben der Standard-Farbe Orange, die Farben Rot, Blau, Dunkelgrau und Oliv.
- Eigene Farben
Mit den Optionen
- Standard-Farbe
- Alternativ-Farbe
- Hyperlink-Farbe
- Hover-Farbe
besteht die Möglichkeit ein eigenes Farbschema zu erstellen. Beim Klick in ein Eingabefeld öffnet sich ein Color-Picker. Mit diesem kann die entsprechende Farbe ausgewählt werden.
- Google Web Fonts
Mit den Optionen
- Schriftart für Überschriften und
- Standard-Schriftart
können die voreingestellten Schriftarten verändert werden. Zur Auswahl stehen weitere Google Web Fonts.
Soziale Netzwerke
In diesem Bereich werden Verknüpfungen zu sozialen Netzwerken eingerichtet. Es stehen folgende zur Auswahl:
- Google+
- 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 schreib einen Kommentar. Ich werde das Netzwerk dann hinzufügen.
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:
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 300 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 50 x 50 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 – 20.10.2012
- Release
v1.1 – 30.12.2012
- [
functions.php] Shortcodes in der Kurzfassung der Artikel entfernt - [
theme-options.phpundfunctions.php] Bezeichnung „Zeichen“ durch „Wörter“ der Kurzfassung der Artikel in den Theme-Optionen ersetzt
Hallo Oliver,
ich würde gerne mein altes Theme durch dieses ersetzen, daher habe ich noch eine Frage/einen Wunsch: In Ari besteht die Möglichkeit, nur Teile des Artikels anzuzeigen. Das ist dort mittels
umgesetzt, das habe ich nach der Anleitung von Majeres in
umgebaut. Das hat für mich mit langen Artikeln deutliche Vorteile, ich habe aber keine Möglichkeit gefunden, dass ihn Zehn umzusetzen – habe ich da was übersehen? Danke schonmal!
Hallo Wobintosh,
das kannst du bequem über die Theme-Optionen steuern. Schau mal bei den Artikel-Optionen. Dort kannst du die Anzeige der Artikel auf die Kurzfassung (the_excerpt) umstellen. Du kannst sogar die Anzahl der Zeichen der Kurzfassung einstellen und bei Bedarf auch einen Weiterlesen-Button anzeigen lassen.
Hab’s gerade mal auf dem Test-Blog auf die Kurzfassung umgestellt.
Gruß Olli
Hey, danke – das hatte ich nicht gesehen :)
Ach, eins noch ;)
Wie kann ich dafür sorgen, dass das Kommentarfeld nicht neben sondern unter den ähnlichen Artikeln angezeigt wird?
Hi,
setz mal die Breite für die Artikelempfehlung auf 100%:
.post .body .artikelempfehlung { float: left; width: 100%; margin: 10px 0 0 0; }Gruß Olli
Jop, danke :)
Sehr schönes Theme muss man einfach sagen. Hat mich dazu gebracht mal wieder meinem Blog ein wenig Leben einzuhauchen. Allerdings wäre es toll wenn man auch Custom Menüs hinzufügen könnte. Gibt es die Möglichkeit das irgendwie einzubauen?
Okey..hab gerade gesehen, dass das Theme automatisch ein Custom Menu übernimmt :D leicht verwirrend gewesen :D
hatte gerade ne zweite Reihe im Menü und da ging beim Firefox von Headerbild oben ein wenig verloren.. nicht tragisch aber als Anmerkung :)
Ein superschönes und praktisches Design, dass ich gleich mal bei mir installiert habe. Kann dir nur dafür danken, dass du das zur Verfügung stellst.
Bin auch auf meinem neuen Blog wie immer sehr zufrieden mit dem Theme :) finde es sieht ein wenig aus wie das Waipoua von elmastudio, nun ist aber ZEHN besser, da es kostenlos ist. Echt super Arbeit :)
Einzig was ich besser finden würde, wäre, wenn die Post-Thumbs so um die Hälfte bis Doppelt so groß wären, da diese doch sehr klein ausfallen.. villt gibt es ja eine Möglichkeit dies nachträglich zu machen?
Dann gibt es noch einen kleinen Bug, wie ich finde:
http://www.foto-news-blog.de/?attachment_id=559
Das Admin Panel am oberen Rand ist wenn ich eingeloggt bin immer über dem Menü.. egal welcher Browser, egal welcher Blog…
Ansonsten aber echt TOP :)
Gruß Mirko
Hallo Mirko,
ist kein Bug. Sind beides fixierte Elemente. Nur ich verliere, weil mein Menü einen kleineren
z-indexhat ;-)Wenn du die Post-Thumbs größer darstellen möchtest, dann ändere in der
content.phpsowie dersingle.phpfolgenden Eintragthe_post_thumbnail('post-thumbnail', array('title' => ''.get_the_title().'' ));in
the_post_thumbnail('medium-thumbnail', array('title' => ''.get_the_title().'' ));für 100 x 100 Pixel oder
the_post_thumbnail('big-thumbnail', array('title' => ''.get_the_title().'' ));für 250 x 250 Pixel. Du musst dann aber einige andere Elemente in der
style.cssanpassen, wie den rechten Innenabstand des Titels, etc..Gruß Olli
Ah cool danke dir :) muss ich mich mal in ner ruhigen Minute dransetzen :)
nochmal ne Frage: Kann man die Shortocdes, hauptsächlich Infobox und Button nicht in den Widgets nutzen? Wollte über das normale Textwidget einen Button einsetzen, aber da steht nur der Code, und nicht der tolle Button?…
Hallo Mirko,
ne, Shortcodes funktionieren nur in Artikeln und Seiten. Aber du kannst die Buttons trotzdem im Text-Widget nutzen. Musst nur auf den HTML-Code ausweichen:
Gruß Olli
Ja super Olli :)
jetzt bin ich überglücklich mit dem Theme :)
Hallo Oliver,
Wäre es möglich größere Vorschau-Bilder zu verwenden?
Grüße,
Pascale
Hallo Pascale,
schau mal ein paar Kommentare über deinem. Da habe ich Mirko beschrieben, wie man größere Post-Thumbs verwenden kann.
Gruß Olli
Hallo,
ich bin dabei mich mit deinem Theme 10 zu versuchen. Bis jetzt hat alles wunderbar geklappt.
Wie bekomme ich es aber hin, den ersten Beitrag oben zu sehen. Bei mir steht immer der letzte oben.
Mfg Taeuber
Hallo,
das ist die Standard-Sortierung von WordPress. Wenn du den ältesten Beitrag oben haben möchtest, änderst du in der
index.php, derarchive.phpund dersearch.phpden Loop und fügst eine Abfrage ein.Aus
<?php if (have_posts()) : // Beginn Loop ?> <?php while (have_posts()) : the_post(); ?> <?php get_template_part('content'); // Content-Template laden ?> <?php endwhile; ?> <?php endif; // Ende Loop ?>machst du:
<?php query_posts($query_string. "&order=ASC"); ?> <?php if (have_posts()) : // Beginn Loop ?> <?php while (have_posts()) : the_post(); ?> <?php get_template_part('content'); // Content-Template laden ?> <?php endwhile; ?> <?php endif; // Ende Loop ?>Gruß Olli
Hallo, danke für deine Hilfe.
Ich habe bis jetzt immer mit Joomla gearbeitet.
Ich möchte dein Theme10 für mobile Geräte nutzen. Ich bin noch in der ausprobieren Phase und
experimentiere mit Xampp.
Ist es möglich wie bei Joomla ein Backup zu machen und dann auf dem Server offline zustellen?
Taeuber
Hi,
du meinst eine lokale Kopie der Webseite? Dann sollte dir dieser Artikel weiterhelfen.
Gruß Olli
Hallo!
Danke, ok ich versuche es.
Taeuber
Hi,
ich bin mit dem Theme eigentlich ziemlich zufrieden, habe jetzt aber ein ganz neues Problem: Twitter stellt den API-Support für das „Letzter Tweet“-Widget aus Jetpack ein, dabei wird empfohlen, das Twitter-Timeline-Widget zu nutzen. Kennst du irgendeinen Weg, wie ich den letzten Tweet ausgeben kann, und nur den?
Hi,
ne, keine Ahnung. Hast du schonmal direkt bei Twitter geschaut? Da gibt es normalerweise gut beschriebene Dokumentationen für ihre Widgets.
Gruß Olli
Hallo, ich suche zur Zeit ein solches Theme. Nur hätte ich gerne einen Header (Bild) über dem oberen Menü,wäre das zu machen?Ich suche folgendes Theme:Mit Headerbild dann Menü dann Content mit Sidebar dann unten auf jeden Fall mindestens drei Footerwidgets.
Gruss
Hubmoritz
Hallo Olli,
vielen Dank für die vielen tollen Themes, die du kostenlos zur Verfügung stellst. Das ist für mich als WordPress Anfänger sehr hilfreich. Ich habe einige deiner Themes ausprobiert und mich erst einmal für ZEHN entschieden.
Hierzu habe ich auch einige Fragen, die ich nach eigener Google-Recherche nicht beantworten konnte.
1. Gibt es eine Möglichkeit, das Suchfeld auszuschalten?
2. Kann ich die Farbe der Menüeinträge im Header ändern?
3. Gibt es die Möglichkeit ein Kontaktformular einzubinden (als Plugin?) oder zu aktivieren?
4. Ich habe die Breite des Inhaltsbereiches auf 80% gestellt. Dies soll aber nur für die Desktop Seite und nicht für die mobile Seite gelten. Geht das?
Und 5. Gibt es vielleicht eine WordPress Info Seite, die du empfehlen würdest? Wo ich vielleicht Antworten auf meine zukünftigen Fragen finde, gerade in Bezug auf deine Themes?
Vielen Dank für deine Zeit :-)
MfG
Leon
Hallo Leon,
in der Hoffnung, dass du eben selbige in Erwartung einer Antwort noch nicht aufgegeben hast, hier meine Lösungsvorschläge für deine Fragen:
zu 1.) das Suchfeld kannst du über das Stylesheet (Menü „Design“ -> „Editor“) ausblenden. Such nach dem Eintrag
.sucheund ergänze die vorhandenen Deklarationen um.suche { display: none; ... }zu 2.) Meinst du die Hintergrundfarbe oder die Schriftfarbe? Im Normalzustand, oder wenn du mit der Maus darüber fährst? Auch das erledigst du im Stylesheet.
Die einzelnen Menüelemente sind deklariert als
#navigation li a. Farben für das gerade aktive Seitenelement kannst du mit diesen Elementen steuern:#navigation .current-menu-item > a, #navigation .current-menu-ancestor > a, #navigation .current_page_item > a, #navigation .current_page_ancestor > a.zu 3.) Na klar. Ich persönlich nutze Contact Form 7.
zu 4.) Auch hier wieder in das Stylesheet und im Bereich
@media screen and (max-width: 1200px) { ... }bei allen Elementen
width: auto;durchwidth: 100%;ersetzen.zu 5.) Da gibt es sicher einige. Ich würde dir aber das WordPress Deutschland Forum empfehlen. Da findest du stest kompetente Hilfe (Ich bin da auch öfter mal unterwegs).
Sorry, für die verspätete Antwort, hab’s aber nicht früher geschafft.
Gruß Olli
Hi Olli,
vielen Dank für deine Antwort.
Momentan fehlt mir die Zeit aber sie wird mir sicherlich hilfreich sein, wenn ich ich das nächste mal dran setze.
Gruß Leon