Kommentare 18

8 Tools und Plugins, um eine mobile Version deiner WordPress-Seite zu erstellen

Es gibt bereits etliche praktische Tools und Plugins, um deine WordPress-Webseite auch für mobile Geräte (iPhones, Android, Blackberry & Co) fit zu machen. Z.B. kannst du dir bei beliebten Anbietern wie Mobify ein kostenloses Account einrichten und dort eine mobile Version deiner Webseite erstellen. Ein passendes WP-Plugin leitet deine Besucher dann automatisch weiter. Oder du setzt ein WordPress-Plugin/Theme Paket ein, damit deine Besucher auf ein Mobile-Theme deiner Seite umgeleitet werden. Da wir zur Zeit auch an einer mobilen Version der Elmastudio-Seite basteln, habe ich ein wenig recherchiert und möchte dir die hilfreichsten Tools kurz vorstellen.

1. Mobify

Tools fuer mobile WordPress Webseiten

Bei »Mobify« kannst du dir kostenlos ein Account einrichten und deine mobile Webseiten-Version Schritt für Schritt in deinem Mobify-Account erstellen. Die mobile Version kannst du dann auf eine Subdomain deiner Seite (z.B. m.deinedomain.de) umleiten. Mit ein bisschen CSS-Anpassung (das Style-Cheet kannst du direkt in deinem Mobify-Account anpassen) kannst du recht schnell ein schönes Ergebnis hinbekommen.

Um Inspirationen zu sammeln kannst du dir die Mobify-Gallery anschauen, bevor du mit deinem mobilen Design loslegst.

Tools fuer mobile WordPress Webseiten
Ein schönes Beispiel für eine mobile Webseiten-Version aus der Mobify-Gallery.

Das WordPress-Plugin »WordPress Mobile by Mobify« übernimmt anschließend die automatische Umleitung aller Besucher mit mobilen Geräten auf deine neue mobile Webseiten-Version.

2. Mofuse

Tools fuer mobile WordPress Webseiten

»Mofuse« ist einer der größten Anbieter für mobile Webseiten-Versionen und wird u.a. von Seiten wie Mashable genutzt. Es gibt allerdings keine kostenlose Version des Tools, das kleinste Paket (für eine nicht-kommerzielle Webseite) kostest 7,95$ im Monat.

Das Tool hat allerdings auch etliche Features zu bieten, u.a. die Möglichkeit Google Maps und Google Checkout auf deiner Seite zu integrieren, und Statistiken für die mobile Nutzung deiner Seite auszuwerten. Für die Umleitung deiner Besucher auf die mobile Version gibt es ebenfalls ein WordPress-Plugin.

3. Mippin Mobilizer

Tools fuer mobile WordPress Webseiten

Mit »Mippin Mobilizer« kannst du in ein paar Schritten eine kostenlose, mobile Version deiner Webseite erstellen. Dein eigenes Logos kannst du auf der Seite anpassen.

4. Wirenode

Tools fuer mobile WordPress Webseiten

Bei »Wirenode« kannst du mehrere Webseiten in deinem Account verwalten (bis zu 3 Seiten kostenlos). Bei der kostenlosen Version kannst du allerdings nicht deine eigene URL verwenden. Dafür gibt es bei dem Tool etliche Features wie ein Twitter-, Umfragen- und Formular-Widget.

5. WPTouch Pro

Tools fuer mobile WordPress Webseiten

»WPTouch« ist ein kostenpflichtiges WordPress-Plugin (29$), welches deine Webseite automtisch auf eine mobile Theme-Version umleitet, sobald ein Besucher deine Webseite mit einem mobilen Gerät aufruft. Alle Bilder und Videos werden dann automatisch verkleinert und lange Artikel-Seiten untergeteilt, damit die Inhalte schneller laden. Das WPTouch-Theme hat ebenfalls etliche spannende Features zu bieten und einen eigenen Admin-Bereich für dein mobile Device gibt es auch mit dazu.

WPTouch Version 1.9.16 (kostenlos)

Tools fuer mobile WordPress Webseiten

Die ältere Version 1.9.16 des WPTouch-Plugins (ebenfalls kompatibel mit WordPress 3.0) kannst du übrigens weiterhin kostenlos nutzen.

6. WPtap

Tools fuer mobile WordPress Webseiten

»Wptap« ist eine weiteres Plugin/Theme Paket, um deine WordPress-Seite für iPhone, iPad, Android & Blackberry fit zu machen. Das Plugin leitet deine Besucher automatisch auf die mobile Version um. Du kannst aus 5 kostenpflichtigen Themes (je 49$) und einem FreeTheme wählen.

Tools fuer mobile WordPress Webseiten
Eine Demoansicht des WPtap Free-Themes »New Press«.

7. WordPress Mobile Pack

Tools fuer mobile WordPress Webseiten

Das kostenlose WordPress Mobile Pack-Plugin bietet jede Menge Optionen, um deine WordPress-Seite mobile ready zu machen. Es gibt einen Theme Switcher zwischen mobiler- und Vollversion deiner Webseite, verschiedene Themes und Möglichkeit der CSS-Anpassung, einem mobilen Admin-Bereich und etliche weiteren Features.

8. Mobile Press

Tools fuer mobile WordPress Webseiten

»Mobile Press« ist ein ebenfalls ein kostenloses WordPress-Plugin, um für deine Webseite eine mobile Version zu erstellen. Es bietet die Möglichkeit eigene Themes für die unterschiedlichen mobilen Geräte zu erstellen.

Welche Erfahrungen hast du mit den Tools/Plugins für mobile WordPress-Versionen schon gemacht? Hast du Tipps parat oder kennst du weitere praktische Tools, um WordPress-Seiten für mobile Devices zu rüsten? Über deine Erfahrungen und dein Feedback freue ich mich sehr!

18 Kommentare

    • @Chris: Vielen Dank für deinen Kommentar. Freut mich, dass du die Zusammenstellung der Tools gut gebrauchen kannst :-)

      Wir werden unsere mobile Version wohl bei Mobify einrichten. Die Gallery verspricht auf alle Fälle so einiges, ich bin schon echt gespannt :-)

      Viele Grüße
      Ellen

  1. Erstmal danke für den Artikel und die tolle Übersicht.

    Ich habe mir meine mobile Seite mit dem WordPress Mobile Pack eingerichtet. Es hat den Vorteil, dass ich auf einen externen Anbieter weniger angewiesen bin.

    Des Weiteren sind die Standard-Themes meiner Meinung nach mehr als ausreichend. Wenn ich mit dem Smartphone surfe möchte ich schnelle und kompakte Informationen. Da benötigt man meiner Meinung nach kein “buntes” Theme mit Grafiken die noch extra geladen werden müssen. ;-)

    LG

    • @zypral: Vielen Dank für deinen Kommentar und dein Feedback :-) Ich finde es klasse, dass du dir eine mobile Seiten-Version eingerichtet hast!

      Deine Einschätzung zum Thema Design und Images auf den Smartphones finde ich sehr interessant. Da hast du sicher Recht, zu überladen sollte ein Design wirklich nicht sein, da man wie du ja schon gesagt hast auf die geringe Display-Größe und die Ladezeiten sicherlich eingehen muss.

      Eine gewisse Corporate Identity finde ich allerdings auch sehr wichtig, damit der Leser auch einen Bezug und einen Wiedererkennungswert zur Seite hat. Wir haben gestern einen Artikel mit einem mobile Webdesign-Showcase gemacht. Ich finde da sind einige Beispiele dabei, die diese Herausforderung wirklich schön gelöst haben. Schau doch mal in den Artikel rein, deine Meinung würde mich sehr interessieren :-)

      Viele Grüße
      Ellen

  2. Christian

    Ich bin im wesentlichen zyprals Meinung. Zum einen kann ich die CI-relevanten Elemente ja im WordPress Mobile Pack nachversorgen, zum anderen finde ich die Arbeit mit Mobify eher schwierig und was macht ihr wenn Mobify demnächst seinen Service einstellt?
    Aber welche Gründe haben haben bei eurer Entscheidung für Mobify gesprochen?

    BTW: Im Link von Ellens letztem Kommentar fehlt ein f (bei href), ich habe den Artikel aber trotzdem gefunden :-) Mich spricht dabei das Minimaldesign von ‘I Love Typography’ am meisten an, da ich Inhalten interessiert bin.

    Viele Grüße
    Christian

    • Hallo Christian,

      vielen Dank für deinen Kommentar und dein tolles Feedback zum Thema Mobile Webdesign :-)

      In erster Linie möchte ich derzeit einfach verschiedene Dienste (u.a. Mobify) ausprobieren. Natürlich ist ein solcher Dienst eher noch ein Kompromiss, und wahrscheinlich auf Dauer sicher nicht die beste Lösung. Das WordPress Mobile Pack finde ich übrigens mindestens genauso spannend :-)

      Viele Grüße,
      Ellen

      PS: Der Link im vorherigen Kommentar ist korrigiert :-)

  3. Dorothee

    Hallo Ellen, finde den Artikel (und Eure Website) ziemlich klasse, weil ich glaube, keiner einer kommt ums Thema “Mobile” herum. Deswegen fände ich auch einen Artikel aus der quasi Gegenrichtung interessant: Welches WordPress-Theme eignet sich besonders gut fürs mobile Bloggen… Hintergrund: Ich suche gerade ein Theme für einen neuen Blog und mir fällt auf, dass viele Themes das Thema Bilder einfach toll ausreizen (featured-Elemente, custom fields). Das ist ja auch richtig – Bild und Bewegtbild zieht einfach Leser. Beim Bloggen von unterwegs (E-Mail-Funktion in WordPress, bisher nie getestet) sehe ich keine Möglichkeit, die schönen Bilder in passendem Ausschnitt gleich mitzuschicken. Kann man sowas nicht programmieren? Oder kennst Du ein Template für “Unterwegs-Blogger”, das optisch trotzdem ok ist? Ich weiß gerade nicht, wo oder wie ich noch suchen soll….. Viele Grüße, Dorothee

  4. Hallo Dorothee,

    vielen Dank für deinen Kommentar :-)

    Ja, da hast du auf alle Fälle Recht. Das Thema “Mobile” wird bestimmt immer wichtiger werden, da mehr und mehr Menschen das Internet von unterwegs aus nutzen und auch mit ihrem Blog mobil sein wollen.

    Auch mit WordPress gibt es da schon etliche Möglichkeiten, z.B. das schon im Artikel erwähnte Mobile Pack. Das Plugin bietet Optionen für mobile Nutzung im Frontend und Adminbereich von WordPress. In der Plugin-Beschreibung (siehe Link) findest du alle Features des Pakets.

    Im Artikel “100 Free WordPress Themes” bei Smashing Magazine findest du unter dem Punkt “Mobile Themes für WordPress” weitere Optionen für Themes.

    Wenn du offen bist, Neues auszuprobieren, könntest du eventuell auch einmal einen Posterous- oder Tumblr-Blog ausprobieren. Bei diesen beiden Diensten ist das posten von Artikeln mit Fotos und Texten per Email extra gefeatured und beide Dienste bieten tolle Möglichkeiten, einen mobilen, “leichten” Blog auch von unterwegs zu führen :-)

    Viele Grüße,
    Ellen

  5. Dorothee

    Cool – den mobilen Admin-Bereich im mobile-pack-Plugin hatte ich überlesen. Um so eine Möglichkeit ging’s mir im Prinzip.

    Ich glaub, was mir zusätzlich fehlt, wäre ein “Zufalls-Bild-einfüg”-Plugin: Jeder Artikel, der gepostet wird, enthält automatisch ein hübsches Bild aus einem vorher bestimmten Webspace-Ordner. Auch wenn das Bild thematisch nichts direkt mit dem Thema zu tun hat, wäre es ein Eyecatcher.

    In jedem Fall danke und schnell noch ein dickes Lob für Euer Blogtheme und alle Grafiken – ist (nicht nur inhaltlich, sondern auch) optisch ein echtes Sahneschnittchen.

    Viele Grüße, Dorothee

    • Hallo Dorothee,

      das freut mich sehr, dass dir diese Tipps weiterhelfen und natürlich auch, dass die unser Blog so gut gefällt :-)

      Mhhh, um ein Bild automatisch einzufügen, fällt mir jetzt spontan gar keine Lösung ein. Ich werde aber noch einmal überlegen, ob das irgendwie möglich wäre, ja :-)

      Viele Grüße,
      Elle

  6. Also erstmal vielen Dank für die vielen anschaulich und gut erklärten Tipps. Da ich als reiner Anwender so gut wie keinen Plan habe, was es überhaupt zu tun gibt, um eine website mobilfähig zu machen, aber immer mehr Kunden den Bedarf erkennen, bin ich sehr gespannt auf die konkrete Umsetzung – ich habe ja noch Hoffnung ;)

  7. Alex

    Hallo ich habe eine WPTouch Pro Lizenz, nur das Theme was ich nutze ist nicht kompatible die vom Support meinen ich muss es Fixen !?

    Wie soll ich das anstellen das es klappt ?

    Danke

  8. Hi Ellen,

    ich lese diesen Artikel mit ca. drei Jahren Verspätung, danke aber trotzdem für Deine Mühe, ihn für uns aufzuschreiben.

    Aktuell beschäftige ich mich gerade mit eben diesem Thema und stieß unter anderem auf den alternativen Ansatz von “First Page Mobile”, der daher auch nur marginal zu Deinem Artikelthema passt. Aber vielleicht freut sich ja dennoch jemand über den Hinweis.

    “What First Page Mobile is not…First Page Mobile does not turn your entire site into a mobile-friendly website. Instead, it is a tool to build a customized, action-powered home page experience.” (Quelle: http://firstpagemobile.com)

    Elmastudio hat ja einige mobile-orientierte Themes im Portfolio, von denen ich auch schon einige ausprobiert habe. Mein aktueller Ansatz ist es aber, eine eher klassische Website, die nicht so sehr auf geringe Datenlast ausgerichtet ist, zu haben und mobile NutzerInnen auf eine gesonderte Version zu leiten.
    User agent sniffing kann sicher auch mal daneben gehen, und so richtig winzig sind diese Mobile Detection Skripte ja auch nicht, aber irgendwo anders werde ich schon ein paar Bytes aus meiner mobilen Site herausquetschen, so dass dies kein großes Problem sein sollte. Mein Traum ist es, eine komplette mobile Website in unter 100kb zu realisieren… Mal schauen.

    Obwohl die Screenshots zu “WordPress Mobile Pack” nicht allzu hübsch anmuten und es Zweifel aufkommen lässt, dass dieses WP Plugin vor gut einem Jahr zuletzt aktualisiert wurde, werde ich es mir bestimmt auch noch mal anschauen und die Möglichkeiten ausloten. Möglicherweise lassen sich ja recht einfach eigene Themes erstellen und verwenden.

  9. Miriam

    Moin moin,
    was auch immer ich über WordPress googel, jedes Mal lande ich hier :-)
    Ich hab mal eine Frage. Und zwar habe ich zwar eine recht schöne Website – die nur leider keine mobile Version hat. Ich hab’s mit Mobify versucht, jedoch entnervt aufgegeben.
    Nun dachte ich, ich könnte ja einfach eine neue Website basteln, mit Twenty 11, 12 oder 13, die haben ja wunderbare mobile Versionen. Mit einem einfachen Theme-Switcher ist es nur leider nicht getan – erstens hat meine PC-Website Tabellen und Widgets, die sich nicht vertragen, und zweitens hätte ich auf der mobilen Seite gerne weniger Unterseiten als am PC. Wenn ich nun also eine komplett neue Website erstelle, mit eigenem Ordner im FTP und eigener Datenbank und die beispielsweise in eine Subdomain packe – gibt es da eine Möglichkeit, zu switchen? Sodass der mobile Besucher beispielsweise ein Popup sieht, ob er zur mobilen Version wechseln möchte – der PC-User jedoch nicht? Gibt’s da was?
    Gruß
    Miriam

  10. Hallo Ellen,
    die genannten Plugins haben mich alle nicht so glücklich gemacht.

    Ich bin bei meiner Suche auf das Plugin “Mobile Smart” gestoßen, das ist eher genau das was ich suchte. Es unterscheidet zwischen Desktop und Mobile Browser und lädt für die Mobile Version ein anderes Template. So kann man unabhängig von externen Anbietern und Lizenzmodelle bleiben.

    So habe ich mir mal schnell ein einfaches JQuery-Mobile Theme geschrieben und bin zufrieden. Meinen ersten Versuch haben ich mit dem Theme Yoko gemacht, das klappte auch sehr gut.

    Liebe Grüße – Harald

Schreibe eine Antwort