Du bist hier: Start

Inhaltsverzeichnis (Table of Contents)

in Wordpress Plugins

Bei längeren Artikeln oder Anleitungen ist es oft sehr hilfreich ein Inhaltsverzeichnis anzugeben. Wikipedia ist ein sehr gutes Beispiel dafür.

Das Inhaltsverzeichnis bietet dem Besucher eine schnelle Übersicht über den Inhalt und man kann auch sehr schnell zu den gewünschten Sektionen einer Seite mittels eines Links springen. Wieder ein Schritt für die Verbesserung der Usability eines Blogs, siehe auch Breadcrumbs. Auch auf die Suchmaschinen-Optimierung wirkt sich ein Inhaltsverzeichnis positiv aus.

Inhaltsverzeichnis für WordPress

Natürlich kann man manuell für die gewünschten Beiträge die jeweiligen HTML-Link Attribute (Beispiel) setzen, jedoch stellt sich das sehr schnell sehr schwierig dar, bzw. kann man sehr schnell den Überblick verlieren welche Elemente man schon verlinkt hat.

Hierfür – ich verwende es auch auf diesem Blog – gibt es ein nettes Plug-In für WordPress, Table of Content. Wie gewohnt das Plug-In installieren und in WordPress aktivieren.

Für die Verwendung in einem Post, muss man lediglich einen Code am Anfang und Ende eines jeweiligen Artikels einfügen.

[ table-of-content ]
Das ist ein Blogeintrag mit Überschriften.
[ /table-of-content ]

Tipps für Inhaltsverzeichnis

Richtige Formatierung.

Damit das Plug-In korrekt funktioniert, musst du sicherstellen, dass deine Überschriften innerhalb des Posts korrekt formatiert sind, ansonsten sieht dein Inhaltsverzeichnis komisch aus. Also tatsächlich die Hierarchien H1 – H6 verschachtelt verwenden.

Design anpassen.

Du solltest unbedingt das Design des Inhaltsverzeichnisses deinem Design anpassen. Wie üblich kannst du das über die custom.css vornehmen. Hier gibt es den Selektor .pni-navigation.

.pni-navigtion {
  display: inline;
  float: right;
  background-color: #FEF6E2;
  border: 1px solid #94B3C5;
}

Automatisch hinzufügen.

Ich würde davon abraten die Funktion auf jeder Seite zu integrieren! Erstens ist es nicht überall angebracht, zweitens sind manche Artikel teilweise zu kurz dafür oder verfügen über keine Überschriften. Also nur bei ausgewählten Beschreibungen und Artikeln anwenden.

{ 1 comment }

Google Search In WordPress Einbinden – Variante 2

in Technisches

Inhaltsverzeichnis
  1. “Google Suche” Code erstellen
    1. Erster Schritt – AdSense Setup
    2. Zweiter Schritt – Such-Einstellungen
    3. Dritter Schritt – Design auswählen
    4. Vierter Schritt – Suchergebnisseite
    5. Fünfter Schritt – Suchmaschine speichern
    6. Sechster Schritt – Code kopieren
  2. Google Suche in WordPress integrieren
    1. Erster Schritt – Suchformular einfügen
    2. Zweiter Schritt – Suchergebnisseite anlegen

In Variante 1 hab ich beschrieben, wie man eine Google Suche in der Sidebar integrieren kann. Diese Variante hat seine Vor- und Nachteile. Heute beschreibe ich, wie man die Suchergebnisse auf einer eigenständigen Unterseite darstellt.

“Google Suche” Code erstellen^

Anders als bei Variante 1 steigen wir jetzt direkt bei Google Adsense ein.

Erster Schritt – AdSense Setup^

Um die Suchmaske & Ergebnisseite zu erstellen, navigiere in Google Adsense zu dem Menüpunkt “Adsense-Setup”.

Hier gibt es in der Auflistung den Punkt “Adsense für Suchergebnisseiten”.

google_adsense_search

Zweiter Schritt – Such-Einstellungen^

Auf der folgenden Seite kannst du nun die Informationen zu deiner Domain & Webseite angeben. Hier empfohlene Einstellungen:

  1. Nur von mir ausgewählte Websites auswählen! – Ist zwar standardmäßig so ausgewählt, aber sicherheitshalber überprüfen.
  2. Ausgewählte Websites – wie bereits in Variante 1 erwähnt, wenn du ähnliche Webseiten betreibst, macht es Sinn diese hier auch anzuführen.
  3. Optionale Keywords – einfach fünf deiner beliebtesten Keywords angeben. Bis jetzt hat es wenig Effekt bei mir gezeigt, aber man kann ja nie wissen.
  4. Sprache & Land richtig setzen!
  5. Benutzerdefinierter Channel – ein absolutes Muss! wenn du mehrere Webseiten betreibst. Google Adsense zeigt dir dann separat alle Statistiken für die jeweiligen Channels an. Hier bspw. “DIYTheme Suche” oder dgl. wählen.
  6. SafeSearch – Wenn du nicht gerade im Erotik-Bereich tätig bist, würde ich dir empfehlen dies aktiviert zu lassen. Man weiß nie, was sonst alles an Werbung daherkommt.

Dritter Schritt – Design auswählen^

Hier bietet dir Google verschieden Varianten des Layouts an, welche aber allesamt hässlich sind. Ich verwende immer das Suchfeld mit dem Wasserzeichen (erfordert zwar JavaScript, aber dafür ist es nicht so hässlich).

Bei der Länge des Textfeldes würde ich dir empfehlen zuerst zu überlegen wo das Suchfeld platziert werden soll, bzw. wie viel Platz dort vorhanden ist. Wenn es in die Sidebar integriert werden soll, werden die standardmäßigen 31-Zeichen vermutlich zu groß sein. Aber keine Angst, diese Nummer kannst du zu einem späteren Zeitpunkt auch noch umändern.

Vierter Schritt – Suchergebnisseite^

Jetzt kommen wir endlich einmal zu etwas wichtigem. :) Die Suchergebnisseite.

google_suchergebnisseiteNachdem wir eine eigenständige Seite für die Suchergebnisse haben möchten, wählen wir den dritten Punkt “Ergebnisse auf meiner eigenen Website öffnen”. Hier musst du nun wählen, wie die Seite auf deiner Domain lauten soll (keine Angst, wir erstellen diese Seite nachher). Hier bieten sich Seitennamen wie “suche” oder “suchergebnis” und dergleichen an.

Die Breite muss mindestens 795 Pixel sein, kleiner erlaubt Google leider nicht. 

Bei der Wahl des Anzeigenstandorts würde ich vorsichtig sein. Es hat sich gezeigt, dass es am besten ist, wenn die bezahlte Werbung nur “rechts” angezeigt wird. Ansonsten verliert man sehr schnell einen Webseiten-Besucher. Man hat zwar ein paar Cent mehr in der Tasche, aber vielleicht kann man noch mehr rausholen auf der eigenen.

Das Design musst natürlich du vorgeben. Generell sollte es sich in dein Design integrieren damit es nicht zu sehr heraussticht.

Fünfter Schritt – Suchmaschine speichern^

Hier verlangt Google zusätzlich zu den normalen Google Adsense Richtlinien noch weitere Richtlinien für die Verwendung der Google Suche. Ich hab sie mir ehrlich gesagt noch nie durchgelesen, also, einfach das Hackerl setzen, benennen und “Übermitteln und Code erhalten” drücken.

Sechster Schritt – Code kopieren^

Google liefert uns auf der letzten Seite der Erstellung zwei verschiedene Codes. Der erste Code stellt das Suchformular dar, der zweite Code – auch wenn es nach wenig aussieht – kümmert sich um die Auslieferung der Suchergebnisse.

Beide Codes separat kopieren und in eine Text-Datei packen. Wir benötigen diese in Kürze.

Google Suche in WordPress integrieren^

Nachdem wir alle Einstellungen bei Google getroffen haben, geht es jetzt um die Integration in WordPress.

Erster Schritt – Suchformular einfügen^

Unter “Design > Widgets” jetzt ein neues Text-Feld in die gewünschte Sidebar & Position ziehen. Als Inhalt fügen wir den ersten Code von Google ein.

Nun die Sidebar speichern.

Falls dir das Suchfeld zu klein oder zu groß ist, kannst du den Wert size=”” erhöhen oder verkleinern.

Zweiter Schritt – Suchergebnisseite anlegen^

Jetzt erstellen wir die Seite in WordPress wo später einmal die Suchergebnisse aufgelistet werden sollen.

Unter “Seiten > Erstellen” die Seite “Suche” oder wie auch immer du sie bei Google genannt hast erstellen. Auf dieser Seite nun im Bearbeitungsfenster auf “HTML” umstellen, damit WordPress nicht die HTML-Tags zerstört.

Hier musst du nun den zweiten Teil des Google-Codes einfügen. Es ist ratsam auf der Seite ebenfalls überhalb der Suchergebnisse noch einmal eine Suche zu integrieren, falls Besucher weiter suche möchten. Außerdem solltest du ein Template für diese Seite verwenden, die keine Sidebars hat. So bleibt der Fokus bei der Suche.

{ 1 comment }

Google Search In WordPress Einbinden – Variante 1

in Technisches

Inhaltsverzeichnis
  1. Google Custom Search Code erstellen
    1. Erster Schritt – Create a Custom Search Engine
    2. Zweiter Schritt – Details ausfüllen
    3. Dritter Schritt – Design Vorlage wählen
    4. Vierter Schritt – Code kopieren
    5. OPTIONAL Schritt Fünf – Monetarisieren
  2. Google Custom Search in WordPress einbinden
    1. Erster Schritt – Suche in die Sidebar einfügen
    2. Zweiter Schritt – Code einfügen
    3. Dritter Schritt – Bewundern
  3. Vorteile
  4. Nachteile

google_custom_search Eine Suche auf einem Blog oder Webseite anzubieten gehört schon zum guten Ton und sollte auch auf jeder vorhanden sein!

WordPress kommt bereits mit einer recht umfangreichen Suche, dennoch macht es Sinn Google Custom Search zu verwenden. Google liefert sehr schnell Resultate und teilweise auch bessere als die WordPress-eigene Suche, besonders bei sehr umfangreichen Seiten.

Nicht zuletzt lässt sich auch die Suche auf einer Seite mit Google Custom Search monetarisieren, nämlich über Google Adsense.

Was auch immer die Beweggründe sind, hier eine Anleitung wie du Google Custom Search auf deinem Blog einrichten kannst.

Google Custom Search Code erstellen^

Die Google Suche kommt in zwei Varianten, zum einen kostenlos und auch eine bezahlte Version ist verfügbar. Die bezahlte “Site Search” startet bei $100,—pro Jahr und bietet mehr Optionen. Für Otto-Normal aber absolut nicht notwendig! Den die kostenlose ist bereits sehr gut!

Erster Schritt – Create a Custom Search Engine^

Google bietet für die Erstellung des Custom Searches ein Wizzard an, wo du die Suche erstellen kannst. Einfach auf Google.com/cse gehen und auf “Create a Custom Search Engine” klicken.

google_custom_search_001

Zweiter Schritt – Details ausfüllen^

Nun fragt dich Google nach Informationen rund um deine Webseite. Wichtig ist die richtige Sprache auszuwählen!

Unter Sites to Search kannst du die Seiten angeben, die in der Suche eingebunden werden sollen. Diese Funktion ist nützlich, wenn du z.B.: mehrere Webseiten zum selben Thema betreibst. So kannst du die diese Seite auch mit einbeziehen.

Dritter Schritt – Design Vorlage wählen^

Neu bei der Google Suche ist, dass man ein Design auswählen kann, bzw. sogar sein eigenes Design zusammenstellen kann.

Google liefert sechs Standardvorlagen die du nach deinen Bedürfnissen anpassen kannst.

google_custom_search_design Dazu erzeugt dir Google auch dynamisch eine Voransicht unterhalb des Designs. Wenn die Farben stimmen, einfach mit “Next” bestätigen.

Vierter Schritt – Code kopieren^

Somit ist deine Custom Search bereits erstellt. Auf der letzten Seite des Wizards bekommst du den benötigten HTML-Code geliefert. Einstweilen einfach kopieren und in ein Notepad oder so zwischenspeichern.

google_custom_search_code

OPTIONAL Schritt Fünf – Monetarisieren^

Wenn du mit der Suche auch Geld verdienen möchtest, empfiehlt es sich, dass du die Suche mit deinem Google Adsense Konto verknüpfst.

google_custom_search_adsenseHier bietet dir Google unter “Next Steps” den Link “make money” an. Auf der darauffolgenden Seite musst du auswählen, ob du bereits ein Google Adsense Konto hast, oder dich mit einem existierenden Konto einloggen möchtest. Falls du bereits ein Konto hast musst du noch deine Google Adsense Email Adresse  eingeben, bzw. Postleitzahl und die letzten 5 Nummern deiner Telefonnummer (die möchten wohl wirklich auf Nummer sicher gehen. :) ).

Google Custom Search in WordPress einbinden^

Jetzt hast du zwei Möglichkeiten die Suche zu integrieren. Entweder über ein Plug-In (worauf ich hier nicht weiter eingehen werde) oder über ein Text-Sidebar Widget.

Erster Schritt – Suche in die Sidebar einfügen^

WordPress Administration öffnen und zu “Design > Widgets” navigieren.

Einfach ein “Text” Widget in die gewünschte Position & Sidebar mittels Drag’n’Drop ziehen, hier wird dann die Suche erscheinen. Meine Empfehlung: Die Suche ganz weit nach oben geben, damit sie auch wirklich jeder findet.

Zweiter Schritt – Code einfügen^

Den zwischengespeicherten Code in das neu erstellte Widget einfügen und speichern.

google_custom_search_widget

Dritter Schritt – Bewundern^

Alles fertig. Die Suche ist integriert. Bei jeder Suche wird die Sidebar erweitert und die Ergebnisse direkt in der Sidebar angezeigt.

google_search_integratedVorteile^

  • Die Suche ist kompakt an einer Stelle
  • Der Benutzer wird nicht auf eine weitere Seite geleitet

Nachteile^

  • Die Suche kann sehr leicht das ganze Blog-Design zerstören, wenn es zu viele Suchergebnisse zurückliefert.
  • Es gibt nur eine Werbefläche.

{ 1 comment }

Thesis Hilfe

in Technisches

Ich habe soeben begonnen die Thesis-Hooks nach und nach zu beschreiben. Du findest alle bereits recherchierten und beschriebenen Thesis-Hooks inklusive eines jeweiligen Beispiels im Menü unter Thesis-Hooks.

Außerdem hab ich eine Übersicht erstellt, wie du am schnellsten und effektivsten mit Thesis starten kannst. Diese Übersicht findest du ebenfalls im Menü unter Erste Schritte.

Wenn du eine Frage hast rund um Thesis hast, würde ich mich über deine Zusendung freuen, ich werde auch garantiert auf deine Frage eingehen! Einfach das Formular unter Thesis Frage ausfüllen.

{ 0 comments }

Suchmaschinen Zugriffe messen

in Wordpress Plugins

Inhaltsverzeichnis
  1. Crawl Rate Tracker
  2. Was macht Crawl Rate Tracker
  3. Statistiken von Crawl Rate Tracker
    1. Detail Report
    2. Seiten Detail Report

Wolltest du schon immer einmal wissen, welche Suchmaschinen deine Webseite wann und wo besuchen? Natürlich kann man dazu die LOG-Files auswerten, aber es gibt dafür auch ein WordPress Plug-In welches komfortabel festhält, welche Suchmaschine dich besucht hat.

Ich verwende dieses Plug-In auf meinen Webseiten um zu sehen, ob Suchmaschinen eventuell Probleme haben, meine Inhalte zu finden. Nachdem wir ja schon bereits ein tolles SEO-Theme verwenden, sollte dies aber nicht der Fall sein. Dennoch interessant zu sehen, wie die Suchmaschinen-Zugriffe sich aufteilen,bzw. verhalten.

crawl_report

Crawl Rate Tracker^

dashboard_crawl_rate_tracker Das “magische” Plug-In das hier zur Verwendung kommt heißt Crawl Rate Tracker und kann bequem über WordPress installiert werden (einfach danach suchen), oder hier heruntergeladen werden.

Was macht Crawl Rate Tracker^

Das Plug-In schreibt bei jeder Seite deiner Webseite mit um welche Suchmaschinen es sich handelt, bzw. welche Seite wann aufgerufen wurde. So ergibt sich der oben abgebildete Graph mit den Zugriffen der Suchmaschinen. Hier lässt sich auch ablesen, welche Suchmaschinen am öftesten zugreifen.

Statistiken von Crawl Rate Tracker^

Detail Report^

Der “Detail Report” listet dir alle Seiten auf, die von Suchmaschinen abgerufen wurden.

detail_report

Neben der Anzahl der Zugriffe auf eine jeweilige Unterseite, kannst du hier mit einen Klick auch auf die Yahoo Backlinks zugreifen.

Seiten Detail Report^

Geht man nun eine Ebene tiefer bei einer Seite, bekommt man die Information welche Suchmaschine zu welcher Uhrzeit & Datum zugegriffen hat.

report_detail_seite

{ 0 comments }

DIYTheme Fonts

in Design

Inhaltsverzeichnis
  1. Google Schriftarten verwenden
  2. Google Webfonts für älteres DIYTheme
    1. Erster Schritt – HTML kopieren
    2. Zweiter Schritt – HTML einfügen
    3. Dritter & Letzter Schritt – CSS anpassen

Seit der Version 1.8 von Thesis kann man Google Fonts für Überschriften und Fließtext verwenden. Die Google Schriftarten erhält man über ein CSS und werden von Google kostenlos zur Verfügung gestellt.

Zur Zeit werden 19 Schriftarten zur Verfügung gestellt und durch die Integration über ein CSS wird die Schriftart direkt von den Google-Servern geladen. Somit musst du dich nicht kümmern ob der Benutzer eine jeweilige Schrift installiert hat oder nicht.

Google Schriftarten verwenden^

Um die Schriftarten zu verwenden, navigiere einfach zu dem Menüpunkt “Thesis > Design Options”.

Nun kannst du für jede Sektion der Webseite, sei es Menü oder Content, eine passende Schriftart wählen. Wie bereits im Bild auch zu erkennen ist, wird empfohlen generell nur Schriftarten zu wählen wo ein Stern (*) oder ein G dabei steht. Alle Schriftarten mit “G” werden dynamisch von Google geladen.

Google Webfonts für älteres DIYTheme^

Falls du dein DIYTheme noch nicht auf den neuesten Stand gebracht hast oder kannst (hier eine Anleitung), gibt es natürlich auch Mittel und Wege um die Google Fonts zu verwenden.

Dafür musst du dir die passende Schriftart auf http://code.google.com/webfonts auswählen und “Get the code” wählen.

Nun zeigt dir Google die zu integrierende Teile. Das besteht zum einen aus einen Link zu einer CSS-Datei und zum anderen aus tatsächlichem CSS.

Wenn du bspw. die Schriftart “Droid Sans” integrieren möchtet – Code unterhalb – gehe wie folgt vor:

Erster Schritt – HTML kopieren^

Als ersten Schritt musst du dir den <link….>-Teil von der Google Seite kopieren, er sieht in etwa so aus:

Zweiter Schritt – HTML einfügen^

Nun müssen wir diese CSS-Datei auch in unserer Thesis Installation integrieren. Gehe dazu auf “Thesis > Site Options” und suche die Sektion “Additional Scripts”:

Hier nun den kopierten Teil einfügen und speichern.

Dritter & Letzter Schritt – CSS anpassen^

Nun haben wir die CSS Datei auf jeder Unterseite unserer Webseite integriert. Jetzt müssen wir die “custom.css” öffne um zum Beispiel die H1-Überschriften zu ändern.

In deiner custom.css einfach folgenden Code einfügen:

.custom h1 { font-family: 'Droid Sans', arial, serif; }

{ 0 comments }

WordPress 3 Menü richtig einsetzen

in Technisches

Inhaltsverzeichnis
  1. DIYTheme Menü
  2. WordPress 3 Menü Anleitung
    1. Erster Schritt – Menü anlegen
    2. Zweiter Schritt – Primäres Menü wählen
    3. Dritter Schritt – Menüpunkte wählen
    4. Vierter Schritt – Anordnung
    5. Fünfter Schritt – Menü Items anpassen
    6. Sechster Schritt – Einmal speichern
    7. Siebter Schritt – Letzter Schritt
  3. Fazit

Über die Erneuerung, dass DIYTheme 1.8 jetzt auch das neue Menü von WordPress 3 unterstützt, habe ich ja bereits berichtet.

Heute eine kleine Anleitung, wie du das WordPress 3 Menü in Thesis einsetzen kannst.

DIYTheme Menü^

Bis jetzt waren wir es ja mit DIYTheme gewohnt, unser Menü damit zu verwalten.

Eigentlich sehr elegant, verglichen zu dem, was vorher bei WordPress vorhanden war. Allerdings gibt es hier auch einige Mankos. Zum Beispiel ließ sich keine Sub-Navigation damit realisieren (auch mit der dztg. Version 1.8 geht das nicht).

thesis_menu

WordPress 3 Menü Anleitung^

Erster Schritt – Menü anlegen^

wordpress3_menu_erstellen

Wenn du nur ein Menü auf deiner Webseite erstellen möchtest, ist es relativ egal, wie du das Menü nennst. Solltest du mehrere Menüs benötigen (bspw. für die Sidebar), dann würde ich dir einen merkenswerten Namen wie “Hauptmenü” empfehlen.

Name eingeben und mit den blauen Button rechts “Menü erstellen” bestätigen.

Zweiter Schritt – Primäres Menü wählen^

Beim Hauptmenü ist wichtig, dass man WordPress mitteilt, welches der erstellten Menüs tatsächlich das Hauptmenü ist. Hier einfach in der Dropdown das gewünschte Menü auswählen und bestätigen.

wordpress3_menu_order

Dritter Schritt – Menüpunkte wählen^

WordPress 3 erlaubt, dass man:

  • (externe) Links hinzufügt – also Links die nicht unmittelbar auf der eigenen Webseite vorhanden sein müssen.
  • Interne Seiten – also von dir erstellte Seiten
  • Kategorien

in das Menü einfügt. Diese können bequem per Checkbox ausgewählt werden und mittels “Zum Menü hinzufügen” übernommen werden.

wordpress3_menu_add_items

Vierter Schritt – Anordnung^

Jetzt kannst du die jeweiligen Menüpunkte mittels Drag’n’Drop frei positionieren.

wordpress3_menu_order_001

Fünfter Schritt – Menü Items anpassen^

wordpress3_menu_edit_item

Was bis jetzt bei WordPress immer ein Problem war: WordPress hat 1:1 den Titel einer jeweiligen Seite für das Menü verwendet. Mit WordPress 3 kann man den gewünschten Menü Titel frei wählen, bzw. noch weitere Attribute festlegen.

Sechster Schritt – Einmal speichern^

Damit nicht alles umsonst war, speichern wir unser konfiguriertes Menü und wir können uns endlich um die Einbindung in unser Design kümmern.

Siebter Schritt – Letzter Schritt^

Nun müssen wir noch DIYTheme beibringen, dass wir das nun erstellte WordPress 3 Menü anstelle des DIYTheme Menüs verwenden möchten.

Navigiere hierzu einfach zu den Menüpunkt “Thesis > Site Options”.

Hier findest du den Punkt “Navigation Menu”.

thesis_navigation_menu

Nun “WordPress nav menu” auswählen und den beliebten Big Ass Save Button betätigen und dein WordPress 3 Menü ist eingebunden.

Fazit^

Ich denke nicht, dass Thesis weiterhin an der Entwicklung des Menüs sonderlich weiter entwickeln wird, da die Umsetzung von WordPress 3 bereits sehr gelungen ist. Mein Tipp: wenn du eine neue Webseite erstellst, verwende das WordPress 3 Menü. Für existierende Seiten wird es wohl wenig bis keinen Sinn machen hier sonderlich ein Update durchzuführen, da die Webseite so wie sie ist, ja jetzt auch schon funktioniert.

{ 0 comments }

DIYTheme Error Seiten selbst gestalten

in Technisches

Error Seiten tauchen immer wieder auf einer Webseite auf. Entweder hat jemand falsch auf deinen Artikel verlinkt, oder es ist dir irgendwie passiert, einen falschen Link anzugeben oder der Dateiname wurde verändert.

Diese oben genannten Fehler resultieren in einen 404 Error – Seite nicht gefunden.

404_thesis

Thesis DIYTheme kommt mit einigen Funktionen, die uns das bearbeiten der Seite erleichten, bzw. automatisch Inhalte einfügt, wo wir sie möchten. Dasselbe gilt natürlich auch für die 404 Error Seiten.

404 Titel anpassen

Für den Titel der 404 Error Seite gibt es die Funktion thesis_hook_404_title. Diese fügt einen beliebigen Seiten-Title auf der 404 Error Seite ein.

function custom_404_title() {
?>
  Artikel leider nicht gefunden!
<?php
}

remove_action('thesis_hook_404_title', 'thesis_404_title');
// entfernt den derzeitigen title
add_action('thesis_hook_404_title', 'custom_404_title');
// setzt den eigenen title

Wir erstellen also eine Funktion innerhalb unserer custom_functions.php mit einen beliebigen Namen (in diesem Fall custom_404_title) und ersetzen den Standard Titel mit unserer Funktion.

404 Inhalt anpassen

Natürlich geben wir uns nur mit dem Titel nicht zufrieden, denn es kann auch der Inhalt der Error Seite angepasst werden und zwar mit thesis_hook_404_content. So können bspw. weitere Informationen oder weiterführende Links angeboten werden. Um den Text der Error Seite zu ändern, einfach folgenden Code in der custom_functions.php einfügen.

function custom_404_content() {
?>

Keine Angst! Das war nicht beabsichtig, aber ich konnte die von dir gewünschte Seite leider nicht finden.

Während ich probiere, die Seite wieder zu finden, könntest du inzwischen in meinen Kategorien stöbern:

<?php
  wp_list_categories();
}

remove_action('thesis_hook_404_content', 'thesis_404_content');
add_action('thesis_hook_404_content', 'custom_404_content');

Mit dieser Funktion custom_404_content habe ich nicht nur den Text geändert, sondern liste auch alle Kategorien meiner Seite auf, damit der Besucher nicht ganz verloren geht. :)

{ 0 comments }

Breadcrumbs verwenden!

in Nützliches,SEO

Die Verwendung von Breadcrumbs auf Webseiten ist nicht nur ein Vorteil hinsichtlich OnSite-SEO, sondern hilft auch bei der Usability der Seite. Suchmaschinen hilft es zu verstehen, wie eine gegebene Seite hierarchisch aufgebaut ist und der User findet sich auch besser zu recht.

Genau für diesen Zweck hat Joost de Valk das WordPress Plugin “Yoast Breadcrumbs” ins Leben gerufen.

Das schöne an diesem durchdachten Plugin ist, dass es Out-of-the-box automatisch mit Thesis DIYTheme zusammenspielt!

breadcrumbs_yoast

Nach der Installation des Plugins (hier kannst du es downloaden) hast du eine zusätzliche Option und dem WordPress-Reiter “Einstellungen”, namens “Breadcrumbs”.

Auf dieser Seite kannst du die Sprache und weitere Dinge anpassen. Am Ende der Seite findest du die Option “Try to add automatically”. Das Wort “try” verfehlt es etwas, denn das Ding funktioniert auch.

Für die Bastler unter euch: Ihr könnt auch die CSS-Klasse dafür konfigurieren.

.custom #yoastbreadcrumb {
  font-size: 16px;
}

Mit dieser Auswahl kannst du das Format des Breacrumbs anpassen, wie oben bspw. die Schriftgröße.

{ 8 comments }

DIYTheme Design links ausrichten

in Design

Das DIYTheme-Framework ist standardmäßig immer zentriert und noch gibt es keine Möglichkeit in den Thesis Optionen dies bequem zu ändern. Bis jetzt kann man die Anordnung der Spalten bestimmen, bzw. die breiten und Anzahl der Spalten im Interface bestimmen.

Nicht immer macht das Sinn bzw. nicht immer gewünscht, dass die ganze Webseite zentriert dargestellt wird. Hier müssen wir uns noch mit ein paar kleinen CSS-Einstellungen zufrieden geben. Wenn du die Webseite links ausgerichtet haben möchtest, füge folgenden Code in deine custom.css ein:

Full-width Framework

.custom .page {
 margin-left: 15px;
}

Page Framework

.custom .container {
 margin-left: 15px;
 margin-top: 15px;
}

Damit ist die ganze Seite nach links gewandert mit einen Einzug von 15 Pixel.

Update:
Bei Full-width Framework würde ich das nicht empfehlen, da der eigentliche Nutzen des ganzen Frameworks verloren geht. Also würde eher empfehlen Page Framework zu nehmen und dort die Änderungen durchzuführen. :)

{ 0 comments }

← Ältere Einträge

Neuere Einträge →