Mobiler WordPress-Blog mit WPtouch

Ich habe gerade ein wirklich praktisches PlugIn für WordPress gefunden. Mit WPtouch kann man ohne auch nur den geringsten Aufwand seinen WordPress-Blog fitt für mobile Endgeräte machen.

Die Installation von WPtouch

Das PlugIn selbst kann man direkt aus dem WordPress-Userinterface installieren. Hierfür geht man auf den Menüpunkt Plugins->Installieren und gibt WPtouch in die Suchmaske ein. Dann sollte an erster Stelle ein PlugIn namens WPtouch auftauchen. Hier klickt man dann auf ‚Jetzt Installieren‘. beispielwptouch Auf der folgenden Seite muss man noch auf ‚PlugIn Aktivieren‘ Klicken und dann kann’s auch schon losgehen mit der Mobilen Website 😉 .

Die Anpassung an die eigenen Bedürfnisse

Theorethisch könnte man alle Einstellungen so belassen und sich nicht weiter kümmern. Beim Anschauen des Blogs mit einem mobilen Endgerät wird automatisch das von WPtouch erstellte mobile Design angezeigt welches sich schon sehr angenehm bedienen lässt. Allerdings sieht das Ganze noch nicht wirklich schön aus.wpid-Screenshot_2013-03-11-21-28-20.png Folgende Punkte sind noch zu bemängeln:

  1. Kein Logo/Branding
  2. Unpassende Icons im Menü
  3. Unpassende Kamera Icons vor den Beiträgen
  4. Kein schöner Hintergrund

Das kann man aber bei WPtouch ohne Probleme ändern 😉   Die Einstellungen Zu WPtouch findet man unter dem Menüpunkt Einstellungen->WPtouch.

Das Logo

Es ist gar nicht so einfach mit WPtouch wirklich sein eigenes Logo anzeigen zu lassen da es hierfür in dem PlugIn selbst keine Einstellungsmöglichkeiten gibt. Allerdings kriegt man das mit einem kleinen Trick hin. In den einstellungen zu WPtouch gibt es ein Eingabefeld für den Namen der oben im header angezeigt werden soll. In diesem kann man auch HTML-Quelltext einfügen wodurch beispielsweise die einbindung eines Logos möglich ist.

Ich habe dies nun mit folgendem Code gemachte:

<img src="http://t-jark.de/wp-content/uploads/2013/01/logo4.png" style="min-height: 40px; text-align: center;" />

Jetzt hat man allerdings noch das nervige von WPtouch mitgelieferte Icon im Header links kleben.
Das bekommt man nur durch einen kleinen Trick hin.

Da man bei diesem PlugIn leider ein Icon in dem Header platzieren muss, ist der einzige Ausweg ein transparentes Icon zu erstellen und dieses Hochzuladen. Das Icon habe ich hier zum runterladen bereitgestellt 🙂 .

Dieses kann man in Den Einstellungen von WPtouch hochladen wenn man relativ weit nach unten scrollt.

jojojo

 

Dann muss man noch in der Dropdown-Liste im Kasten darunter nach dem namen der Datei suchen:

wptouchtransparent

Die Menü-Icons

Die Icons im Menü kann  man wieder im WPtouch Userinterface bearbeiten.

In der gleichen Box wie die Logo-Einstellungen kann man auch ein passendes Icon für jede Seite auswählen.
Im Userinterface bis ganz nach unten Scrollen und aus der entsprechenden Dropdownliste auswählen.

lolololotolololo

Die Beitrag-Icons

Die Icons neben den Beitragsvorschauen werden automatisch aus den Beitragsbildern erstellt.

Das heißt man muss zu jedem Beitrag ein Beitragsbild hinzufügen und die Icons machen keine Probleme mehr.
ein Beitragsbild kann man bei WordPress auf der Editor-Seite unten Links festlegen.

Der Hintergrund

Gleich vorweg: man kann kein eigenes Bild für den Hintergrund hochladen oder einbinden, worin ich einen großen nachteil von WPtouch sehe. Allerdings hat WPtouch von Haus aus eine relativ kleine Auswahl an Hintergrundbildern die leider auch in einer Dropdownliste dargestellt sind und somit  keine vorschaubilder oder ähnliches haben. Das heißt man muss ausprobieren was das Zeug hält.

Man findet die Optionen hierzu im vierten Kasten von oben in den WPtouch Einstellungen.

zzzzzzz

Im gleichen Kasten kann man auch einstellungen über die Schriftgröße etc. vornehmen.

Die User-Agents

Ein wirklich großer Nachteil von WPtouch ist, dass die mobile Site die es erstellt nicht automatisch auf  allen Mobilgeräten gezeigt wird sondern nur auf den allerwichtigsten(Android,Apple etc.).

Wer allerdings mit einem Nokia Handy auf den Mobile-Blog geht bekommt das normale Design zu sehen.

Um das zu verhindern müsste man jedemenge User-Agents von Hand eintragen.
Man sollte Theorethisch mehrere mit hilfe von kommaseparierten Listen eintragen können leider gibt es User-Agents die ein komma beinhalten wodurch diese Funktion nur schlecht zu gebrauchen ist.

Adsense in WPtouch

Ein sehr praktisches Feature von WPtouch ist die automatische einbindung von Adsense-Anzeigen in den Blog.

Hierfür muss man nur seine Google Adsense-ID und den Channel angeben und die Anzeigen wrden von selber zufällig untergebracht.

Einen Nachteil hat das Ganze: man kann die Anzeigen überhaupt nicht steuern.

Fazit

Im allgemeinen finde ich das PlugIn WPtouch sehr Hilfreich da es ohne großen Aufwand eine sehr gut zu bedienende mobiel Website für einen Designt. Allerdings hapert’s noch an einigen Ecken und Kanten.

Im Folgenden habe ich nochmal alle Vor- und Nachteile aufgezählt.

Vorteile

  • Sehr leicht zu bedienen
  • Intuitiv zu bedienende Mobile Website
  • Vollautomatisch
  • Automatische Google Adsense Funktion

Nachteile

  • funktioniert nicht auf allen mobilen Endgeräten
  • Logo aufwändig zu Integrieren
  • Hintergrund nicht frei wählbar
  • Adsense-Anzeigen nicht seuerbar

Ankündigung

Ich habe entschlossen nun wöchentlich mindestens einen Artikel oder ein Tutorial zu erstellen 🙂
Jeden Donnerstag um 17:00Uhr wird von nun an ein neuer Beitrag in meinem Blog zu Lesen sein.

Vielleicht kommen dazwischengestreut auch noch welche aber auf jedenfall immer Donnerstags 😉

 

 

j

Kommentar verfassen