Darf ich vorstellen: mein neues WordPress-Theme ‚NEUN‘:
‚NEUN‘ ist ein stylisches und modernes deutschsprachiges Theme, welches eine Vielzahl von coolen CSS3-Funktionen beinhaltet. Das Theme kann durch vielfältige Theme-Optionen auf einfache Weise den eigenen Bedürfnissen angepasst werden. Die Social-Media-Integration, ein aus dem Backend anpassbares Logo und Optionen zum Anpassen des Hintergrunds, sowie vorbereitete Templates für ein Gästebuch und eine Artikelübersichtsseite sind weitere Highlights. Außerdem kannst du entscheiden, ob das Theme eckig oder mit abgerundeten Ecken daher kommt.
Highlights:
- 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
- 4 Widgetbereiche im Footer
- vielfältige Theme-Optionen
- Social Media-Integration (Twitter, Facebook, Google+, Xing, Picasa, flickr, Last.fm, Youtube und RSS-Feed)
- Custom-Background- und Custom-Header-Funktion
- Shortcodes für mehrspaltiges Layout, Info-Boxen und Buttons
- ab WordPress Version 3.4
Eine Live-Demo gibt es hier:
und den Download findest du unter folgendem Link:
‚NEUN‘ 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.
Werfen wir mal einen Blick auf die Theme-Optionen, welche ihr im „Design“-Menü unter dem Punkt „Theme Optionen“ findet, nachdem ihr das Theme aktiviert habt:
Theme Optionen
- Breite des Inhaltsbereichs
Mit dieser Option kann die Breite des Inhaltsbereichs verändert werden. Der Inhaltsbereich hat standardmäßig eine Breite von 1000 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
Ist die Option aktiviert, wird im Kopfbereich der Name des Blogs sowie der Slogan angezeigt.
- Anzeige Top-Artikel
Mittels dieser Option besteht die Möglichkeit eine spezielle Auswahl von vier Artikeln oberhalb des Artikelbereichs einzublenden.
Dabei kann zwischen den meistkommentierten Artikeln, zufällig ausgewählten Artikeln, die bei jedem aktualisieren der Seite neu zusammengestellt werden oder von euch gewählten hervorgehobenen Artikeln (Sticky-Posts) gewählt werden.
- Anzeige hervorgehobene Artikel auf Startseite
Diese Option ist lediglich interessant, wenn als Top-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 Top-Artikel ebenfalls diese Artikel angezeigt werden, würden diese doppelt, einmal als Top-Artikel und auf der Startseite angezeigt. Wer das möchte, aktiviert diese Option. Standardmäßig werden die hervorgehobenen Artikel auf der der Startseite nicht angezeigt.
- Überschrift Top-Artikel
Als Standard wird „Meistkommentierte Artikel“, „Zufällig ausgewählte Artikel“ oder „Ausgewählte Artikel“ 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 Top-Artikel
Wenn diese Option aktiviert ist, wird eine kurze Vorschau auf den Artikel (excerpt) angezeigt. Du kannst die Länge der Kurzfassung übrigens mit der Option „Anzahl Zeichen für Kurzfassung“ selbst festlegen.
- Anzeige Anzahl Artikel und Kommentare
Mit dieser Option kann im Fußbereich die Anzahl der veröffentlichten Artikel und erhaltenen Kommentare angezeigt werden.
- 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.
- 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 Option „Vorschau für Top-Artikel“ aktiviert wurde, kann mit dieser Option ein Weiterlesen-Link 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.
- Anzeige Artikelinformationen
Mittels dieser Option werden Informationen zu den Artikeln (Veröffentlichungsdatum, Kategorie und Tags) ausgegeben.
- Anzeige Autor
Wer die Option zur Anzeige von Artikelinformationen nutzt, kann entscheiden, ob der Name des Artikelautors eingeblendet werden soll.
- Anzeige Artikelempfehlung
Unterhalb eines Artikels kann eine Empfehlung für vier themenverwandte Artikel angezeigt werden. Die Ähnlichkeit der Artikel wird anhand des ersten verwendeten Schlagworts ermittelt.
- Ü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 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
- Abgerundete Ecken
Ist diese Option aktiviert, wird das Theme (inklusive Eingabefeldern und Buttons) mit abgerundeten Ecken dargestellt.
- Farbe der Hyperlinks und der Hover-Farbe
Die Farben der Hyperlinks sowie der Hover-Farbe kann bequem über einen Color Picker ausgewählt werden. Soll wieder die Standardfarbe genutzt werden, kann der Wert einfach aus den Eingabefeldern gelöscht werden.
Soziale Netzwerke
In diesem Bereich werden Verknüpfungen zu sozialen Netzwerken eingerichtet. Es stehen die wichtigsten Sozialen Netzwerke zur Auswahl:
- Google+
- Picasa
- flickr
- Last.fm
- Youtube
- Artikel-RSS-Feed
Durch setzen des Hakens 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 ausgegeben. Dieser Tooltip kann durch einen eigenen Text entsprechend angepasst werden..
Fehlt dir ein wichtiges Netzwerk? Dann schreib es in die Kommentare und ich werde es ergänzen.
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. In den Top-Artikeln werden Thumbs in der Größe 100 x 100 Pixel verwendet, in der 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 – 29.09.2012
- Release
v1.1 – 02.10.2012
- Shortcodes hinzugefügt
v1.11 – 22.10.2012
- Fehler in
comments.php
korrigiert; Danke @Thomas
v1.2 – 30.12.2012
- [
theme-options.php
undfunctions.php
] Bezeichnung „Zeichen“ durch „Wörter“ der Kurzfassung der Artikel in den Theme-Optionen ersetzt - [
functions.php
] Shortcodes in der Kurzfassung der Artikel entfernt; Danke @Bob - Standard-Schriftart auf „Open Sans“ geändert
- Neue Schriftart für Überschriften „Fjalla One“
- diverse Design-Anpassungen
Hallo Oliver,
Du hast sehr tolle Themes und ich werde ab nächster Woche eines auf meiner Seite einsetzen.
Wollte noch Anfragen, ob man die vier ausgewählten Artikelboxen auch mit fester, identischer Größe umsetzen könnte, da es sonst imho etwas unschön aussieht.
Ansonsten würde ich an Deiner Stelle mal überlegen, ob Du nicht Premiumthemes anbieten willst ;-)
Beste Grüße
Udo
Hallo Udo,
schön, dass meine Themes deinen Geschmack getroffen haben.
Die Top-Artikel sind alle gleich groß. Von daher weiß ich nicht genau, was du meinst. Evtl. auch nur ein Darstellungsproblem auf einem älteren Browser?
Gruß Olli
Hi Oliver, ich las Dich immer auf dem iPad und bin von 9 begeistert. Installiere es jetzt und habe bestimmt noch die eine oder andere Frage wie z. B. : Kann ich statt der „Zufällig ausgewählten Artikel“ oben in den 4 Containern auch die 4 letzten Artikel bekommen?
Das wäre mir wichtiger.
Danke schon vorab … Bob
Hallo Bob,
du könntest dort „hervorgehobene Artikel“ anzeigen lassen. Bei den letzten vier Artikel setzt du dann jeweils den Haken bei „Diesen Artikel oben halten“.
Du könntest natürlich auch die entsprechenden Abfragen im Theme (
top_artikel.php
) anpassen. Dazu seien dir folgende Codex-Seiten ans Herz gelegt:für die Abfrage:
http://codex.wordpress.org/Class_Reference/WP_Query
und für den Offset-Parameter, damit die Artikel nicht doppelt angezeigt werden (
index.php
):http://codex.wordpress.org/Template_Tags/get_posts
Viel Erfolg.
Gruß Olli
Hi Olli, das mit zufällig ausgewählten Artikeln finde ich mittlerweile doch gut. Ich habe aber das gleiche Problem wie der Udo: Auch ich hätte gern, dass die Anzeige der Top-Artikel immer gleich groß ist. Selbst wann man in allen 4 Boxen die Überschriften gleich hat (also alle eine Zeile, oder alle zwei Zeilen), nehmen die Boxen unterschiedliche Vorschaulängen auf. Man kann sie auch nicht in den Theme-Optionen einstellen, zwar lässt sich eine Zeichenmenge eintragen, ja. Aber diese setzt die Größe dann dennoch willkürlich. Schreibe ich eine 30 ein, kommen rund 60 Zeichen. Beim Standard von 55 über 100. Und dann ist die Zeichenmenge in jeder Box noch anders, bis dass „weiterlesen“ kommt.
Gibt es da eine Möglichkeit? Bei Dir sind die Boxen übrigens auch unterschiedlich groß, obwohl ausreichend Text in den Beiträgen steht.
Hallo Bob,
das ist immer das Problem, gefloatete Elemente mit unterschiedlichem Inhalt auf eine einheitliche Höhe zu bringen.
Die einfachste Möglichkeit: du gibst eine Mindesthöhe für die Boxen vor:
Mit dem Wert musst du mal etwas spielen.
Gruß Olli
Danke, das war eine gute Idee. Dann stimmt die Höhe überein. Allerdings bewertet der Zeichenzähler in den Einstellungen (Standard 55) trotzdem immer unterschiedlich – woran liegt das?Nächste Frage: Wenn man die Mehrspaltigkeit eines Artikels anlegt, erscheint der Vorschautext nicht mehr in den Top-Artikeln – was natürlich blöd ist, wenn der Zufallsgenerator dann drauf greift. Gäbe es da eine Lösung, dass trotz Mehrspaltigkeit der Vorschautext gezogen wird?
Wieder mal danke sagt der Bob :-)
Nochmal der Bob mit Bitte um Hilfe: Ich suche im style.css die Klasse „children“, um der Kinder-ul eine breitere Breite zu verpassen – hast Du einen Tip, wo ich diese anpassen kann? Im css bin ich nicht fündig geworden… Danke für Deine Geduld … Bob
Hallo Bob,
zum Zeichenzähler: es werden nicht die Zeichen gezählt sondern die Wörter. Hab das in den Theme-Optionen falsch formuliert. Wird mit dem nächsten Update ausgebessert ;-)
Weiß nicht genau was du mit „Mehrspaltigkeit eines Artikels“ meinst. Hast du eventuell einen Link, wo ich mir das mal live anschauen kann? Gerne auch per Kontaktformular.
Die Klasse
children
nutze ich nicht. Wenn du die Untermenüs vergrößern willst, ändere die folgenden Werte:Gruß Olli
Hallo Bob,
das keine Shortcodes in der Kurzfassung ausgegeben werden, war mir noch gar nicht aufgefallen. Nach einigem Suchen hab ich hier die Lösung gefunden.
In der
functions.php
fügst du folgenden Code ein:Dann sollte die Kurzfassung angezeigt werden.
Gruß Olli
Hallo Oliver,
besten Dank für die tollen Themen.
Ich habe mir das Neuner Thema heruntergeladen, und es kommen mir zwei fragen ;-)
Erstens ich habe das Plugin WP-reCAPTCHA
https://wordpress.org/extend/plugins/wp-recaptcha/ installiert, bekomme es aber bei den Kommentaren nicht angezeigt.
Und die zweite frage, wo bekomme ich diese animierten Twitter Facebook und co Links her (siehe unten)
Frohe Weihnachten noch !
Hallo Stefan,
kenne das Plugin nicht weiter. Kann es vielleicht daran liegen, dass du eingelogt bist und es daher nicht angezeigt wird?
Zu deiner zweiten Frage: kann man nicht kaufen ;-) Ist eine nette CSS3-Spielerei; schau dir mal meinen Artikel zum Thema „transitions“ an. In meiner Spielwiese habe ich auch ein Beispiel dafür (Social Icons).
Auch dir noch ein frohes Weihnachtsfest.
Gruß Olli
Hallo,
ich habe dein Templat neun im Einsatz bin auch sehr begeistert, leider habe ich immer noch ein Problem mit dem reCapchta dieser geht jetzt nur leider wird der unter FF fehlerhaft angezeigt falsche Position. Kannst du mir da weiterhelfen ?
Hallo Stefan,
das will ich gerne tun. Hast du einen Link für mich? Wenn du den hier nicht öffentlich posten magst, kannst du mir den auch gerne per Kontaktformular schicken.
Gruß Olli
Number nine, Number nine, Number nine….
Dein Neuner Theme ist richtig klasse !!!
Super Olli
Gruß
der Örnie
Hallo Ollie,
ich möchte eine Bildwechsel Funktion, also klassisch Maus über ein Bild und es wird ein anderes angezeigt. Muss ich dazu z.B. sowas hier http://ppfeufer.de/css-bildwechsel-bei-mouseover/ in die Datei style.css einfügen ? Bin ich da auf dem richtigen Weg ?
Gruß
der Örnie
Hallo Örnie,
ja, da bist du definitiv auf dem richtigen Weg :)
Hier ein kurzes Beispiel:
Viel Erfolg.
Gruß Olli
Hallo Oliver,
ich nutzte deine Thema und bin sehr zufrieden, ich habe nur ein Problem mit dem Autoren Bild Anzeige bei google
http://www.google.de/webmasters/tools/richsnippets
Ich habe da schon sämtliche Artikel und Foren durch. Die Foren Berichte sagen mir das ich die Anleitung befolgt habe und es eigentlich danach gehen sollte nur ich bekomme keine Anzeige meines Autorenbildes bei google .
Jetzt haben einige im Forum geschrieben das es vielleicht an dem WP Theme liegen kann, kannst du was dazu sagen ? Sind dir diese Probleme bekannt?
Würde mich freuen wenn du hier helfen könntest
Hallo Stefan,
du meinst die Anzeige des Google+-Profilbildes in den Suchergebnissen, richtig? Mit dem Thema habe ich mich bisher noch nicht beschäftigt.
Hast du mal einen Link zu dem Forum-Thread, wo ich mal ein wenig nachlesen kann?
Gruß Olli
Hallo,
kein Problem ich habe mich an diese Anleitungen gehalten.
http://blog.urbancms.de/wordpress-google-rich-snippet-hier-author-bild-fur-google-suche-einfugen/
http://www.baynado.de/blog/so-erscheint-der-autor-mit-in-den-google-suchergebnissen
http://mizine.de/html/blogbeitrage-richtig-mit-google-profil-verknupfen/
Der angepassten Link Google habe ich in mein WP Thema in footer.php eingebunden, trotzdem bleibt meine Suchabfrage negativ.
Ich habe auch Zahlreiche WP Plugins getestet Single Author G+ META undGoogle+ Author Information in Search Results (Free Version)
Über dein Thema wurde nicht diskutiert, sondern nur die frage behandelt ob es an dem Thema liegen kann.
Gruß
Hallo Stefan,
hab es mit der Anleitung deines ersten Links versucht und bei mir klappt es. Habe
in die
header.php
eingebunden und den Link zu meiner Webseite im Google+-Profil eingetragen. Test mit dem Google Test-Tool war erfolgreich.Gruß Olli
Hallo
also mein Test bei http://www.google.com/webmasters/tools/richsnippets?url= geht und alles steht auf grün. Problem ist aber nur das bei der google Suche mein Autorenbild nicht angezeigt wird. Bei dir aber auch nicht, es soll aber nach kurzer Zeit online sein. Also abwarten .
Gruß und danke
Stefan
Hallo Stefan,
scheint etwas länger zu dauern. Hängt wohl davon ab, wann der Google-Bot deine Seite wieder besucht. Bei mir taucht das Bild nun bei den ersten Suchergebnissen auf.
Gruß Olli
Hallo,
schon gesehen. Bei mir ist noch keine Veränderung ;-( aber vielleicht liegt das auch an meinem Profilbild, habe das einmal geändert.
Ich hatte nach dem ersten Test auch das Bild in der Suche nur leider war das Bild nach einem Tag wieder weg.
Gruß Stefan