Die Zugriffe über mobile Browser werden immer häufiger. Grund genug, auch für diese Browser optimierte Seiten bereitzustellen. Wer seine Webseite mit dem Content Management System WordPress erstellt, kann dies mit der Installation eines einfachen Plugins erledigen.
Das Angebot ist reichhaltig. Ich habe einige der kostenlosen Plugins getestet. Manche sind gut, manche weniger gut. Viele erfordern viel Arbeit bei der Installation oder bei der Konfiguration. Letztendlich habe ich mich für das Plugin WP-PDA entschieden, denn dieses Plugin ist einfach zu installieren (Standard) und muss nicht konfiguriert werden. Plug and Play sozusagen.
Doch einen Nachteil hat das Plugin. Es wird nicht auf Deutsch angeboten. Und das hat mich gestört. So sehr, dass ich mich mit Übersetzungstabellen, .mo und .po-Dateien und anderen Programmen beschäftigt habe. Nach viel herumprobieren, grauen Haaren und wüsten Flüchen, habe ich es geschafft. Das Plugin spricht auf dem mobilen Browser deutsch.
Ich stelle Euch hier die wp-pda Sprachdateien zum Download bereit. Geht wie folgt vor:
- Installiert über WordPress das Plugin WP-PDA. Aktuelle Version für diese Anleitung ist die 1.3.1. Die Sprachdateien sollten auch für folgende Versionen kompatibel sein.
- Ruft Eure Seite über einen mobilen Browser (Handy, PDA) auf. Ihr solltet nun Eure Seite aufbereitet über das Plugin sehen.
- Das Plugin hat zwei Templates. Es unterscheidet zwischen Aufrufen per PDA („pda-theme“) und Aufrufen durch mobile Browser („jqmobile-theme“), zu dem das IPhone, IPod sowie Android-Browser gehören.
- Die deutsche Sprachdatei für das PDA-Template könnt Ihr hier herunterladen. Kopiert diese über einen FTP-Browser in das Verzeichnis „/wp-content/plugins/wp-pda/pda-theme“ und benennt die Datei in „pda-theme-de_DE.mo“ um.
- Die deutsche Sprachdatei für das jqmobile-theme könnt Ihr hier herunterladen. Diese Datei bitte ebenfalls per FTP, allerdings in das Verzeichnis „/wp-content/plugins/wp-pda“ kopieren und ebenfalls umbenennen in „pda-theme-de_DE.mo“.
- Ein erneuter Aufruf Eurer WordPress-Seite sollte nun eine deutschsprachige Oberfläche zeigen.
- Ihr werdet sehen, dass zumindest in der Version 1.3.1 die Buttons unten weiterhin in englischer Sprache sind. Dies ist ein Fehler des Programmierers, denn er hat die Buttons nicht in eine Sprachdatei mit einbezogen. Ich habe den Entwickler darauf hingewiesen. Evtl. wird in einer neueren Version der Fehler behoben. Wenn die Buttons in deutscher Sprache erscheinen, könnt Ihr den Punkt hier abbrechen.
- Ladet die Datei single.php aus dem Ordner „/wp-content/plugins/wp-pda/jqmobile-theme“ auf Euren Rechner herunter und öffnet die Datei mit einem einfachen Texteditor (Windows: Notepad o.ä. KEIN Word oder eine andere Textverarbeitungssoftware!)
- Sucht die folgende Stelle:
<?php previous_post_link('%link','Previous') ?> <?php next_post_link('%link','Next') ?>
- Ersetzt die Zeilen durch folgende:
<?php previous_post_link('%link',__('Previous Page','pda-theme')) ?> <?php next_post_link('%link',__('Next Page','pda-theme')) ?>
Ersetzt nun die Datei “single.php” auf Eurer WordPress-Installation auf dem Webserver.
- Das Plugin spricht jedoch noch immer nicht zu 100 Prozent deutsch. Diesmal ist es kein Fehler des Programmierers, sondern ein Problem des Frameworks, das der Programmierer nutzt. Basis des Webaufbaus ist das JQuery-Framework jquery.mobile-1.0a2.min.js von http://jquerymobile.com. Diese Datei wird automatisch bei jedem Seitenaufbau geladen. Und soweit ich weiß, gibt es das Framework nur auf Englisch. Die folgenden Modifikationen stehen meines Erachtens in keinem Verhältnis zum Aufwand, so dass die meisten Installationen damit leben sollen, dass es einen „Back“-Button und ein „loading“-Fenstern gibt. Wer dies noch beheben möchte, der kann die folgenden Schritte unternehmen.
- Ladet Euch das Framework unter „http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js“ herunter.
- Öffnet die Datei über einen Texteditor. Es handelt sich um komprimiertes JavaScript. Keine Sorge, Ihr müsst den Code nicht verstehen. Sucht mit Hilfe des Texteditors die Stelle „loadingMessage:“loading““ und „backBtnText:“Back““. Ersetzt die Worte innerhalb der Hochkommas. ACHTUNG: Nur die Worte ersetzen, keine Hochkommas löschen!
- Da das Framework bisher von http://jquerymobile.com geladen wurde, Ihr aber Änderungen vorgenommen habt, müsst Ihr diese Datei nun auf Euren Webserver lokal bereitstellen. Ladet die Datei auf Euer Web hoch.
- Schaut Euch die header.php-Dateien in den beiden Template-Ordner an. Passt die Zeile <script type=“text/javascript“ src=“http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js“></script> so an, dass der Link auf Eure modifizierte js-Datei zeigt. Geschafft. Fertig sind die Änderungen.
- Nachteile der Modifikation des JQuery-Framework: Das Laden der Datei über das Web von jquerymobile.com hat zwei entscheidende Vorteile, die durch Eure Modifikation verloren gehen. Zum einen erspart Ihr Euch Traffic (und vielleicht auch Kosten), da die Datei jedes mal nicht von Eurem Server geladen wird. Ferner bekommt Ihr nicht mit, wenn die Entwickler die Datei ändern bzw. verbessern. Diese Nachteile haben allerdings auch Vorteile: Sollte mal der Webserver von jquerymobile offline sein, läuft Euer Web immer noch. Auch könnt Ihr sicher sein, dass Euer Web noch läuft, selbst wenn die Entwickler eine neu Version (mit neuem Namen/Link) veröffentlichen und diese Version von ihrem Webserver löschen. Wie bei allem gibt es zwei Seiten der Medaille…