Wordpress macht eine mobile Version. Mobile Version von WordPress – WPtouch-Plugin. Mobiles Plugin WP Mobile Edition

Mach es endlich! Erstellen mobile Version Erstellen Sie Ihre Website auf WordPress und ersparen Sie jedem Besucher von einem mobilen Gerät aus die Unannehmlichkeiten, ständig in die Seiten hineinzuzoomen, um den Text lesbar zu machen, und eine bestimmte Anzahl unnötiger Bewegungen auszuführen.

Wir bieten Ihnen die 7 coolsten und vor allem kostenlosen WordPress-Plugins, mit denen Sie dies in nur wenigen Minuten tun können.

Plugins zum Erstellen einer mobilen Version Ihrer WordPress-Site

Höchstwahrscheinlich ist der Begriff „Responsive Design“ für Sie nicht neu, da er bereits seit etwa 2 Jahren in aller Munde ist. Aber wenn Sie es noch nicht wissen, dann bedeutet es, die Website zu „transformieren“ oder „anzupassen“. mobile Geräte. Das heißt, ein Besucher kann die Seiten Ihrer Website von jedem Gerät aus, sei es ein Tablet oder ein Smartphone, genauso bequem anzeigen wie von einem Desktop-PC oder Laptop aus.

Nachfolgend finden Sie vier Plugins, die Ihnen zu 100 % bei der Lösung dieses Problems helfen und eine mobile Version Ihrer WordPress-Site erstellen.

1. Hammy

Beginnen wir mit dem sehr praktischen Hammy-Plugin zum Ändern der Bildgröße entsprechend der Bildschirmauflösung des Mobilgeräts, auf dem die Site angezeigt wird. Es ersetzt das Tag An

und verwendet außerdem WordPress 3.5-Bildcode, um die Größe des Bildes zu ändern.

Um das Plugin nutzen zu können, müssen Sie einige Haltepunkte setzen und das HTML-Containerelement auswählen. Mithilfe der von Ihnen ausgewählten Haltepunkte passt das Plugin die Bildgröße an, wenn die Bildschirmbreite den Haltepunkt erreicht. Sie können auch bestimmte Klassen so festlegen, dass einige Bilder ignoriert werden.

2. Responsive Widgets

Dieses Plugin bietet neue WordPress-Text-/HTML-Widgets, die nur auf Geräten wie iPad, Nook, PlayStation Vita und anderen verfügbar sind gemeinsam genutzte Geräte– Tablets und Smartphones.

Um das Plugin nutzen zu können, benötigen Sie grundlegende Kenntnisse von WordPress-Widgets. Öffnen Sie die Widgets-Seite und Sie werden viele neue Widgets für die folgenden Geräte und Bildschirmtypen sehen:

  • Handy, Mobiltelefon
  • Mobil (Querformat)
  • iPhones und iPods
  • Phablets
  • Tablet (Hochformat)
  • Tablet (Querformat)
  • iPad-Porträt
  • iPad-Landschaft
  • Nexus-Tablets
  • Kindle-Tablets
  • Surface-Tablet
  • Nook-Tablets
  • PS Vitas
  • Desktops
  • Große Monitore (1240 Pixel+ Bildschirme)
  • Nur drucken

Viele dieser Widgets verfügen über Kontrollkästchen, mit denen Sie die Widgets so konfigurieren können, dass sie auf bestimmten Geräten angezeigt werden. Wenn Sie das Widget beispielsweise nur auf Tablets, nicht aber auf iPads anzeigen möchten, dann aktivieren Sie das entsprechende Kontrollkästchen.

3.WP Lightbox 2

Ein sehr beliebtes „Lightbox“-Plugin zur Verwendung von Popup-Bildern und Galerien mit Overlay-Effekten. Bedenken Sie jedoch, dass dieses Plugin nicht das Problem der „Reaktionsfähigkeit“ löst, sondern selbst anpassungsfähig ist.

Um das Plugin nutzen zu können, müssen Sie es lediglich aktivieren. Es verfügt über mehrere Einstellungen, wie z. B. die Aktivierung der Lightbox in Kommentaren oder die Änderung der Animationsdauer. Aber im Allgemeinen funktioniert das Plugin sofort nach der Aktivierung und erfordert keine zusätzliche Konfiguration.

4. Verantwortlich

Extrem nützlich WordPress-Plugin. Damit können Sie Responsive Design in Ihrem Browser testen, ohne den Checkout zu verlassen. Mithilfe des Viewport Resizer-Lesezeichens wird oben auf der Seite ein fester Bereich platziert, in dem Sie die Größe der Seite für die gewünschten reaktionsfähigen Geräte (z. B. Smartphones, Tablets, Desktop-PC-Bildschirme) ändern und die erforderlichen Bildschirmauflösungen festlegen können.

Um mit der Arbeit mit dem Plugin zu beginnen, aktivieren Sie es einfach und besuchen Sie eine der Seiten der Website. Auf jedem von ihnen erscheint das Panel, sodass das responsive Design problemlos getestet werden kann.

Plugins zum Erstellen mobiler Themes

Diese Plugins funktionieren nach einem sehr interessanten Prinzip: Sie zeigen verschiedene WordPress-Themes, wenn der Benutzer über ein mobiles Gerät auf Ihre Website zugreift. Diese Funktion ist besonders nützlich, wenn Ihre Website ein Theme verwendet, das nicht für mobile Geräte geeignet ist. Und wenn Sie weder Zeit noch Lust haben, das Thema der Website für ein mobiles Gadget zu ändern, dann wurden die folgenden drei Plugins speziell für faule Leute wie Sie erstellt! :-)

5. WPTouch Mobile-Plugin

Dies ist vielleicht eines der beliebtesten kostenlosen Plugins zum Erstellen einer attraktiven Website in der mobilen Version. Derzeit liegt die Bewertung bei 3,9 von 5 möglichen Sternen. Nach der Installation und Aktivierung des Plugins haben Sie Zugriff auf eine Reihe cooler Funktionen, obwohl sich viele Benutzer möglicherweise auf den Standardsatz zum Erstellen einer mobilen Version der Website beschränken.

Aber sei vorsichtig! Bereits im Juli 2014 wurde die Schwachstelle der Plugin-Version WPTouch 3 bekannt. Sie wurde sofort bemerkt und behoben, konnte jedoch vielen Websites, die dieses Plugin verwendeten, Schaden zufügen. Behalten Sie daher immer die Updates der Plugins im Auge und achten Sie auf die Sicherheit Ihrer Website in allen Versionen.

6. WordPress Mobile Pack

Ein weiterer Marktführer bei Themes für die mobile Version von WordPress-Sites. Die Anzahl der Downloads des Plugins hat 600.000 überschritten und die Bewertung beträgt 3,8 von 5 möglichen Sternen. Seine Coolness liegt darin, das klassische Design durch eine mobile Anwendungsoberfläche zu ersetzen.

Wie das vorherige WPTouch-Plugin muss dieses nur installiert und aktiviert werden. Wenn Sie möchten, können Sie sich mit den Einstellungen befassen, dies ist jedoch nicht erforderlich. Das Plugin ist sofort nach der Aktivierung nutzbar.

7. Jetpack

Dieses Plugin nimmt unter ähnlichen Tools einen Spitzenplatz in der Beliebtheit ein, was durch die Unterstützung von WordPress.com und Automattic bestätigt wird. Es hat sehr nützliche Funktion„Mobiles Thema“. Um es zu verwenden, müssen Sie nach der Installation und Aktivierung des Plugins zur Einstellungsseite (Jetpack → Einstellungen) gehen. Minimale Aktionen, maximale Möglichkeiten. Sie werden es selbst sehen, wenn Sie sich für dieses kostenlose Plugin entscheiden.

Der einzige Rat, den wir Ihnen geben können, ist, dieses Plugin nicht mit dem Disqus-Plugin zu verwenden, da diese nicht sehr kompatibel sind.

Abschluss

Im Bereich Webdesign ist es wichtig und notwendig, immer ein Auge auf neue Produkte zu haben, insbesondere wenn diese für Sie wirklich nützlich sein können. In unserem Fall ist die „Anpassbarkeit für mobile Geräte“ bereits im Kommen Standardfunktion, die von allen Website-Betreibern genutzt werden muss und sozusagen den Anforderungen des Zeitalters der mobilen Gadgets gerecht wird.

Wenn Sie bereits ein Plugin aus dieser Serie verwendet haben oder eine eigene Option haben, die nicht auf unserer Liste steht, seien Sie nicht gierig und teilen Sie sie mit anderen Benutzern.

In den letzten Jahren haben Webdesigner und -entwickler sehr viel gelebt mobile Welt. Dieser Artikel enthält eine Übersicht über sieben Plugins, die Ihnen dabei helfen, Ihre Website für Besucher auf Mobilgeräten schöner und komfortabler zu gestalten.

Diese Besucher greifen in der Regel über ein Tablet oder Smartphone auf die Seite zu. Natürlich müssen Ihre Websites mobilfreundlich sein, sonst könnten wir solche Besucher verlieren.

Wie kann dies erreicht werden? Wir müssen unsere Websites mobilfreundlich gestalten. Dieser Artikel bietet einen Überblick über sieben Plugins, die Ihnen dabei helfen, Ihre Website schöner und mobilfreundlicher zu gestalten.

Hilfs-Plugins mit adaptiver und reaktionsfähiger Oberfläche
Es ist unwahrscheinlich, dass Sie in den letzten zwei Jahren nicht einmal die Begriffe „responsive Schnittstelle“ oder „adaptive Schnittstelle“ gehört haben. Das Ziel dieses Ansatzes besteht darin, Webseiten zu erstellen, deren Informationen korrekt auf den Bildschirmen mobiler Geräte angezeigt werden.

Die vier folgenden WordPress-Plugins helfen Ihnen bei der Erstellung mobilfreundlicher Seiten auf Ihrer Website.

1. Hammy

Hammy ist ein praktisches Plugin, das die Größe von Bildern auf Ihrer Website anpasst, damit sie auf mobilen Geräten korrekt angezeigt werden. Es ersetzt Tags An

und verwendet den Code WordPress-Bilder um die Größe von Bildern zu ändern.

Um das Plugin nutzen zu können, müssen Sie mehrere Haltepunkte setzen und das gewünschte HTML-Element auswählen. Am Haltepunkt können Sie die Größe des Bildes festlegen, wenn die Breite den Haltepunkt erreicht. Sie können auch festlegen, dass einige Bildklassen ignoriert werden.

2. Responsive Widgets

Responsive Widgets ist ein Plugin, das neue Text-/HTML-Widgets für WordPress einführt, die nur auf bestimmten Geräten wie iPads, Nooks, PlayStation Vita und anderen angezeigt werden. universelle Geräte, wie Tablets oder Smartphones.

Um das Plugin nutzen zu können, benötigen Sie lediglich grundlegende Kenntnisse von Widgets für WordPress. Öffnen Sie die Widgets-Seite und Sie werden viele neue Widgets sehen folgende Geräte und Bildschirmtypen:

  • Handy, Mobiltelefon
  • Mobil (Querformat)
  • iPhones und iPods
  • Phablets
  • Tablet (Hochformat)
  • Tablet (Querformat)
  • iPad-Porträt
  • iPad-Landschaft
  • Nexus-Tablets
  • Kindle-Tablets
  • Surface-Tablet
  • Nook-Tablets
  • PS Vitas
  • Desktops
  • Große Monitore (1240 Pixel+ Bildschirme)
  • Nur drucken
Viele Widgets verfügen über Kontrollkästchen, mit denen Sie Ausnahmen machen können. Wenn Sie das Widget beispielsweise auf Tablets, aber nicht auf iPads anzeigen möchten, können Sie das Kontrollkästchen aktivieren und erhalten dann die benötigten Informationen.

3. Verantwortlich

Verantwortlich ist ein sehr nützliches Plugin für WordPress, das die Reaktionsfähigkeit Ihrer Seiten im Handumdrehen im Browser überprüft. Es verwendet das Viewport Resizer-Lesezeichen in einer Leiste oben auf Ihrer Seite, in der Sie die Größe der Seite für mobile Geräte wie Smartphones, Tablets oder Desktop-Bildschirme ändern und die Abmessungen an Ihre Bedürfnisse anpassen können.

Um das Plugin zu nutzen, aktivieren Sie es einfach und öffnen Sie eine Ihrer Seiten. Das Panel wird auf jeder Seite angezeigt, sodass Sie die Reaktionsfähigkeit Ihrer Seiten problemlos überprüfen können.

Mobile Theme-Plugins
Diese Plugins funktionieren auf eine speziellere Art und Weise: Sie helfen Ihnen dabei, verschiedene WordPress-Themes anzuzeigen, wenn ein Benutzer von einem mobilen Gerät aus auf Ihre Website zugreift. Dies ist besonders nützlich, wenn Sie ein Theme haben, das nicht für Mobilgeräte geeignet ist. Wenn Sie nicht die Zeit oder die Möglichkeit haben, Ihr Theme für mobile Geräte anzupassen, können Sie dieses erstaunliche Plugin für Ihre Arbeit verwenden.

4. WPTouch Mobile Plugin

Dieses Plugin hat über fünf Millionen Downloads und eine Bewertung von 3,9 von 5 Sternen. WPTouch ist heute wahrscheinlich das beliebteste mobile Theme-Plugin. Damit können Sie ganz einfach eine mobile Version Ihrer Website erstellen auf einfache Weise, Vollautomatisch.

Um das Plugin nutzen zu können, müssen Sie es lediglich installieren und aktivieren. Die Standardeinstellungen werden für viele Benutzer ausreichend sein. Viele Einstellungen können Sie auch in der Seitenkonfiguration konfigurieren.

Als Warnung muss gesagt werden, dass im Juli 2014 bekannt gegeben wurde: WPTouch 3-Versionen hatten eine Killer-Schwachstelle. Die Schwachstelle wurde sofort behoben, könnte aber für Nutzer des Plugins zu weiteren Problemen geführt haben. Ein guter Grund, nach Updates zu suchen, und das gilt sowohl für den Kern als auch für alle Plugins und Themes.

5. WordPress Mobile Pack

WordPress Mobile-Paket ist ein weiteres gutes Plugin, das mobile Themes für WordPress-Sites bietet. Mittlerweile hat es über 600.000 Downloads und eine Bewertung von 3,8 von 5 Sternen. WordPress Mobile Pack bietet ein einzigartiges mobiles Theme für Sie und Ihre Website-Besucher – eine mobile App-Oberfläche anstelle einer klassischen Mobiltelefonoberfläche.

Wie WPTouch ist WordPress Mobile Pack ein vollständig gebrauchsfertiges Plugin, sobald Sie es installieren und aktivieren. Wenn Sie möchten, können Sie auf der Konfigurationsseite einige Anpassungen vornehmen.

6. Jetpack von WordPress.com

Jetpack ist nicht nur eines der beliebtesten Plugins für WordPress, es wird auch von WordPress.com und Automattic unterstützt. Dieses Plugin verfügt auch über eine Mobile Theme-Funktion, die für Sie sehr nützlich sein kann

Um die Funktion „Mobile Theme“ nutzen zu können, müssen Sie sich nach der Installation und Aktivierung von Jetpack bei Jetpack anmelden und dann die Einstellungen auf der Konfigurationsseite aufrufen. Suchen Sie in der Liste der Module nach „Mobile Theme“ und aktivieren Sie es. Es ist nicht viel, aber danach genießen Sie eine schnelle und übersichtliche mobile Benutzeroberfläche.

Abschluss
Im Internet ist es immer wichtig, mit der Zeit zu gehen und den Besuchern das zu bieten, was sie wollen, insbesondere wenn man von ihnen eine Gegenleistung erwartet (sei es Geld oder Lob). Mobile Reaktionsfähigkeit wird heutzutage zum Standard und es wäre töricht, die Besucher Ihrer Website zu verlieren, die mobile Geräte verwenden.

Hallo liebe Leser!

Diese Woche sind auf meinem Blog zwei wundervolle Dinge passiert! Erstens hat die Besucherzahl endlich die 1.000-Marke überschritten (am Dienstag waren es 1.040 einzelne Besucher). Zweitens habe ich es in der Seitenleiste installiert. Ich freue mich auf Ihre Kommentare zu Aussehen Werbeblock. Und ich werde für Ihre Klicks äußerst dankbar sein :)

Unterdessen hat mir Google kürzlich mitgeteilt, dass mein Blog auf Mobilgeräten nicht gut angezeigt wird. Für großen Aufruhr im Internet sorgte die Meldung, dass ab dem 21. April 2015 alle Seiten, die nicht für Mobiltelefone geeignet sind, in den Suchergebnissen weiter unten angezeigt werden.

Es stellte sich die Frage: Ist eine mobile Version der Website notwendig? Den Statistiken des letzten Monats nach zu urteilen, habe ich über 1.500 Besucher, die zum Ansehen Mobiltelefone oder Tablets verwenden. Das sind etwa 50 Menschen pro Tag, was gar nicht so wenig ist. Und wenn man das jedes Jahr bedenkt mobile Technologien Immer mehr in unser Leben eingeführt werden, müssen wir darüber nachdenken, mit der Zeit zu gehen. In diesem Artikel schauen wir uns an, wie man eine mobile Version für einen WordPress-Blog erstellt.

Wie kann ich die mobile Version der Website überprüfen?

Als Erstes müssen Sie überprüfen, ob Ihre Ressourcen den Google-Anforderungen entsprechen. Jeder kann hier analysieren, wie einfach die Website auf mobilen Geräten angezeigt werden kann - google.com/webmasters/tools/mobile-freundlich.

Hier ist das Ergebnis, das ich erhalten habe:

Hier ist ein anderes nützlicher Service von Google, um die Ladegeschwindigkeit zu überprüfen verschiedene Versionen Webseite: Developers.google.com/speed/pagespeed/insights. Es erklärt sehr detailliert, was genau auf Ihrer Website nicht stimmt konkrete Beispiele mit Screenshots Ihres Blogs. Wenn Sie also über HTML + CSS-Kenntnisse verfügen und diese Anweisungen verwenden, können Sie Ihre Ressource perfekt verbessern.

Wenn Sie die mobile Version einer Website in Google überprüfen, können Sie dem Link mit Empfehlungen zur Anpassung einer WordPress-Website für mobile Geräte folgen (dritte Spalte rechts – „Weiter“). Da ist noch einer detaillierte Anleitung für WordPress mit Plugins, Links zu Responsive Vorlagen Und so weiter. Ich rate Ihnen, auch dieses Dokument zu studieren.

Ich möchte Sie daran erinnern, dass es anpassungsfähig ist WordPress-Vorlagen- Dies sind Themen, die ursprünglich zum Erkennen gedacht waren verschiedene Typen Geräte. In dem Artikel haben wir die wichtigsten Kriterien untersucht, auf die es sich zu achten lohnt. Dazu gehörte auch die Anpassungsfähigkeit.

Wie uns der Google-Support mitteilt, findet man in den Beschreibungen solcher Themen meist die Wörter responsive (adaptiv) oder mobile (mobil). Diese. Wenn Sie ein responsives Theme für Ihr Blog gewählt haben, müssen Sie sich keine Gedanken darüber machen, wie Sie eine mobilfreundliche Website-Vorlage erstellen. Ihre Hauptvorlage passt sich automatisch an Ihr Mobilgerät an. Nun, für diejenigen, die ihren Blog schon vor langer Zeit erstellt haben, als es solche Themen noch nicht gab, und ihre etablierte Vorlage nicht ändern möchten, machen wir weiter diese Rezension. Und wir finden heraus, was getan werden muss, damit Ihre Website auf Mobiltelefonen und Tablets gut wahrgenommen wird.

Mobile Version für WordPress-Blog: Funktionen

Sie müssen verstehen, dass alle anderen Optionen, außer einem adaptiven Theme oder der direkten Bearbeitung von Dateien, die Erstellung einer zusätzlichen WordPress-Vorlage für die mobile Version der Site erfordern. Diese Vorlage sollte sich unter Berücksichtigung der Funktionen mobiler Geräte von der Hauptvorlage unterscheiden:

  • Kleine Bildschirmgröße;
  • Niedrigere Download-Geschwindigkeit;
  • Fehlende Tastatur und Maus.

In einem Wort, diese Version Die Website sollte vereinfacht werden. Es sollte nur das Wesentliche angezeigt werden, Inhalte, die schnell und effizient geladen werden.

Es gibt verschiedene Möglichkeiten, diese Funktionen zu implementieren. Am einfachsten geht es mit Plugins (ideal für Einsteiger).

Plugins zur Website-Anpassung

Die gängigsten Plugins: WPTouch Mobile Plugin, WP Mobile Detector, MobilePress, WPSmart Mobile.

WpTouch und MobilePress sind einfach kostenlose Versionen Plugins, die auf fortgeschrittenere Versionen mit einem größeren Umfang an Einstellungen und Funktionen aktualisiert werden können. Laut Benutzerrezensionen ist WpTouch Pro ziemlich schwer und kann zu Konflikten mit Caching-Plugins führen (). Das kommt vor mobiler Benutzer Aus dem Cache kann eine Seite für einen PC angezeigt werden. Dies kann bei anderen WordPress-Plugins für mobile Versionen von Websites passieren. Basisversionen von MobilePress und WPTouch können für Blogs mit einfacher Struktur und Inhalt verwendet werden.

Aber mir gefiel das WPSmart Mobile-Plugin besser. Es stehen drei mobile WordPress-Vorlagen zur Auswahl.

Zwar sind alle Einstellungen auf Englisch, aber es gibt dort nichts Kompliziertes.

Hier können Sie ein Logo festlegen, Kommentare abgeben, die Website durchsuchen und die Anzeige von Beiträgen anpassen. Darüber hinaus können Sie einen Code oder einen anderen Code sowie Statistikzähler installieren. Außerdem können Sie im Abschnitt „Darstellung“ die Schriftart und Farbe der Einträge, die Hintergrundfarbe usw. ändern. Natürlich wird dies nicht mehr Ihre Website in ihrer gewohnten Form sein, der Inhalt wird eine andere Form annehmen, aber sie wird für mobile Benutzer praktisch.

Sie können sehen, wie die Website auf einem mobilen Gerät aussehen wird, indem Sie auf „Vorschau“ klicken:

Nach der Installation eines beliebigen mobilen WordPress-Plugins sollte es automatisch erkennen, welches Gerät der Besucher verwendet, und ihm die entsprechende Version der Website anbieten.

Das Anzeigen der mobilen Version der Website oder die Anzeige in einem beliebigen Browser oder Gerät kann mit der speziellen User-Agent Switcher-Erweiterung erfolgen. So sieht es im Google Chrome Store aus:

Damit können Sie den Seitenanzeigetyp direkt in Chrome ändern:

Dementsprechend können Sie die Cross-Browser-Kompatibilität Ihres Blogs und dessen Erscheinungsbild überprüfen verschiedene Geräte vom iPhone bis zum Samsung Galaxy.

Weitere Optionen zum Erstellen einer mobilen Version einer WordPress-Site

Optionen ohne Verwendung von Plugins:

  • Inanspruchnahme spezieller Dienste.
  • Erstellen einer mobilen Version auf einer Subdomain;
  • Erstellen einer separaten CSS-Stildatei für die mobile Version;
  • Registrieren Sie Daten für alle Anzeigeoptionen in einer CSS-Datei.

Hier ist einer der Dienste, der durch die Analyse Ihrer Website eine mobile Version generiert – dudamobile.com. Anschließend müssen Sie in Ihrem Blog einen Code einfügen, der zur mobilen Version der Website weiterleitet. Dieses Tool verfügt über viele Einstellungen, seine Funktionalität ist jedoch im kostenlosen Modus eingeschränkt.

Die Nutzung von Subdomains erfolgt nach einem ähnlichen Prinzip. Es ist sinnvoll, sie für schwere, multifunktionale Standorte zu erstellen. Sie können sehen, wie das funktioniert Beispiel YouTube, wo eine Weiterleitung zur mobilen Version der Website erfolgt. Hier ist die Hauptdomain youtube.com und für mobile Geräte m.youtube.com. VKontakte funktioniert genauso.

Wenn Sie sich zum Erstellen entscheiden zusätzliche Datei Erstellen Sie eine Kopie des Hauptstils und benennen Sie ihn beispielsweise style-m.css. Jetzt müssen Sie Änderungen an der Datei header.php vornehmen, an den Zeilen, in denen die Stile enthalten sind.

Sie könnten zum Beispiel so aussehen:

" /> /style-m.css" />

Und wenn Sie über CSS-Kenntnisse verfügen, können Sie dann direkt Änderungen an der Datei style-m.css vornehmen. Ändern Sie beispielsweise die Schriftarten auf kontrastreichere Schriftarten, machen Sie die Anzeige einspaltig und alles, was Google empfiehlt.

Ich habe mich für diese Methode entschieden, schnell ein paar Stile skizziert und Google hat die Arbeit angenommen. Er erwies sich als nicht allzu wählerisch; es reicht aus, den Inhalt in einer schmalen Spalte zu platzieren, und der Google-Dienst meldet sich glücklich: "Großartig! Die Seite ist für mobile Geräte optimiert.“. Bisher ist meine Arbeit nicht besonders schön geworden, aber das ist eine vorübergehende Option, die in ein paar Stunden erledigt ist. Vielleicht schaffen sie es eines Tages, es effizient und gut zu machen.

Viel Glück beim Beherrschen der mobilen Version der WordPress-Site, teilen Sie Ihre Ergebnisse. Wir sehen uns wieder!

Die Anpassung einer Website für mobile Geräte ist ein notwendiger Bestandteil erfolgreicher Werbung, da die meisten Benutzer Komfort lieben. In letzter Zeit haben Suchmaschinen wie Google und Yandex damit begonnen, das Ranking von Websites zu senken, die nicht für mobile Geräte geeignet sind. Infolgedessen nimmt der Website-Verkehr ab. Um diesen Indikator aufrechtzuerhalten, benötigen Sie daher eine mobile Version von WordPress.

Zunächst lohnt es sich, die aktuelle Darstellung der Seite auf mobilen Geräten zu analysieren. Gehen Sie dazu einfach zum Google-Webmaster-Panel. Hier erfahren Sie detaillierte Informationen zu den Mängeln und können diese mit Programmierkenntnissen beheben.

Die beste Lösung wäre, den folgenden Text zum CSS-Bereich Ihres Themes hinzuzufügen:

#content(max-width: 1280 px;)

Darüber hinaus empfiehlt es sich, die Breite der Seiten der mobilen Version zu ändern (dafür ist das Attribut „width“ verantwortlich). Sobald Sie es im CSS-Bereich gefunden haben, müssen Sie seinen Wert durch „100 %“ ersetzen. Dadurch kann der Browser Ihre Website automatisch an jeden Bildschirm anpassen. Es ist jedoch zu beachten, dass diese Anpassungsmethode nicht effektiv ist, da das Laden der Website lange dauert. Die Hauptziele der mobilen Version sind schnelles Laden und Komfort. Darüber hinaus ist diese Art der Anpassung nicht schnell. Sie müssen nach den erforderlichen Attributen suchen, mit ihren Werten experimentieren, falls Fehler auftreten, und so weiter.

Wenn Sie keine Programmierkenntnisse haben, sollten Sie spezielle Plugins installieren, die Ihnen helfen, Zeit zu sparen und das Laden der mobilen Version zu beschleunigen.

1. Hammy notwendig für die proportionale Darstellung von Bildern auf mobilen Geräten. Die Funktionsweise besteht darin, dass das Plugin das standardmäßige Bildaufruf-Tag img in „figure“ ändert. Auf Wunsch besteht in den Plugin-Einstellungen die Möglichkeit, die Anzeige von Bildern einer bestimmten Klasse zu deaktivieren. Dies ist bei der Anpassung von Nachrichten und anderen großen Portalen erforderlich. Andernfalls dauert das Laden der Seite deutlich länger.

2. Responsive Widgets erforderlich, um spezielle Widgets zu erstellen, die nur auf mobilen Geräten angezeigt werden. Ein Widget ist ein Block einer Website, der beliebige Informationen enthält (aktuelle oder beliebte Nachrichten, Umfragen usw.). Die Auswahl an Widgets ist groß genug, um eine multifunktionale Website zu erstellen.

3. Plugin WP Lightbox 2 hilft Ihnen beim Erstellen von Popup-Fenstern auf einer mobilen Website. Es beginnt sofort nach der Aktivierung zu funktionieren. Bei Bedarf können Sie die Dauer der Anzeige ändern. Im Allgemeinen sollte es bei der Einrichtung keine Probleme geben.

4. erleichtert Ihnen die Einrichtung der Website-Anpassung erheblich. Nach der Aktivierung erscheint oben auf der Seite ein Panel, mit dem Sie die Größe der Seite je nach Art des Mobilgeräts anpassen können. Dieses Plugin ist praktisch, da Sie beim Ändern von Parametern sofort das Ergebnis sehen können.

5. Wenn Sie in wenigen Minuten eine fertige responsive Website erstellen möchten, sollten Sie ein Plugin verwenden WP Touch. Es ist sehr beliebt, da es von mehr als 5 Millionen Webmastern verwendet wird. Dieses Plugin enthält Grundeinstellungen (Name, Sprache, Region) und ein Theme. Wenn Sie eine funktionellere mobile Version der Website für Smartphones erstellen möchten, sollten Sie die Premium-Version von WP Touch Pro erwerben. Es gibt eine Vielzahl unterschiedlicher Themes und zusätzlicher Einstellungen, sodass Ihre Seite nicht eintönig wird.

6. WP Mobiler Detektor dient dazu, das Gerät zu ermitteln, von dem aus der Besucher auf die Website zugreift. Es ist in der Lage, etwa 5.000 verschiedene Geräte zu erkennen. Das Plugin zeichnet außerdem Statistiken zu einzelnen Besuchen, Empfehlungsquellen und vielem mehr auf.

7. Dies ist ein multifunktionales Plugin. Dadurch können Sie die Anzeige verschiedener Schaltflächen in der Leiste anpassen (zu Lesezeichen hinzufügen usw.), Schaltflächen zum Ändern der Website-Version von klassisch auf mobil und Blöcke mit Werbung von Google oder AdMob. Es enthält auch eine mobile Version des Site-Control-Panels. Dies erhöht den Komfort erheblich, da in der Standardversion des Control Panels beim Arbeiten auf mobilen Geräten einige Optionen nur eingeschränkt zugänglich sind.

8. Dies ist eine vollständige Kopie des vorherigen. Zusätzlich zu den oben genannten Optionen ermöglicht dieses Plugin die Möglichkeit, Beiträge über das Disqus-System zu kommentieren und erstellt außerdem eine zusätzliche XML-Karte für die mobile Version.

9. hilft Ihnen bei der Erstellung einer schnellen und auffälligen Website für ein mobiles Gerät. Es funktioniert perfekt mit allen Themes, die auf der offiziellen Website der WordPress-Engine angeboten werden. Dieses Plugin wird von den Erstellern von NY Times, Forbes und anderen beliebten Websites verwendet.

10. MobilePress ist ganz einfach. Dieses Plugin erstellt eine praktische mobile Version ohne Spezialeffekte. Der Vorteil dieses Plugins besteht darin, dass es die Belastung des Servers reduziert. Wie Sie wissen, wird eine Website umso schneller auf dem Gerätebildschirm geladen, je weniger verschiedene Widgets sie hat.

11. WP Mobile Splash Page Editor wird Ihnen bei der Erstellung einer Gastseite für die mobile Version Ihres Internetportals nützlich sein. Es lässt sich ganz einfach anpassen und enthält eine große Anzahl verschiedener Stile. Mit dem richtigen Design können Sie den Website-Traffic steigern. Erwähnenswert ist auch, dass dieses Plugin ein schnelles Laden von Seiten auf jedem tragbaren Gerät gewährleistet.

12. Bei der Verwendung Wapple Architect Mobile Sie erhalten eine angepasste Version, deren URL mit der klassischen identisch ist. Das heißt, es erfolgt keine Weiterleitung auf eine Subdomain wie „m.site.com“. Dies hat keinerlei Auswirkungen auf die SEO-Kennzahlen. Eine Besonderheit dieses Plugins ist auch die Möglichkeit, absolut jedes Theme an mobile Geräte anzupassen (auch ein Theme mit einer großen Anzahl verschiedener Widgets). Dadurch müssen Sie keine zusätzliche Zeit mit der Gestaltung verbringen.

Wie erfolgt die Anpassung ohne Plugins?

Wenn Sie keine Plugins verwenden möchten, gibt es spezielle Dienste, mit denen Sie eine mobile Version für jedes Gerät erstellen können.

Der Dienst dudamobile.com ist sehr beliebt, da er eine große Auswahl an Optionen bietet. Dieser Service ist jedoch kostenpflichtig. Der Preis beträgt 9,00 $. Das ist ein angemessener Preis, wenn man bedenkt, dass Sie keine Plugins verwenden müssen.

Zunächst müssen Sie sich hier registrieren oder über Facebook anmelden. Gehen Sie anschließend zum Abschnitt „Design“ und klicken Sie auf das Feld „Layout“. Mögliche Navigationsplatzierungsoptionen werden vor Ihnen geöffnet. Zur Auswahl müssen Sie nur auf die gewünschte Option klicken. Um Farbschemata anzupassen, müssen Sie auf das Feld „Stil“ klicken. Sie können auch Ihr eigenes Hintergrundbild hochladen. Das Feld „Titel“ ist für das Logo zuständig. Sie können es als Bild hochladen oder mit Text versehen. Im Allgemeinen erfolgt der Designprozess in einem visuellen Modus. Sie „konfigurieren“ und der Dienst generiert einen speziellen Code. Erwähnenswert ist auch, dass es auch eine kostenlose Version gibt. In diesem Fall wird jedoch automatisch Werbung auf der Website angezeigt.

Eine einfachere Variante ist mippin.com, die deutlich weniger Optionen enthält. Der Arbeitsmechanismus ähnelt dem vorherigen Dienst.

Anpassungsprüfung

Nach den durchgeführten Maßnahmen sollten Sie das gewünschte Ergebnis erhalten. Um jedoch sicherzustellen, dass die Anpassung für ein mobiles Gerät korrekt erfolgt, sollten Sie die folgenden Dienste nutzen.

Zunächst sollten Sie zum Webmaster-Panel von Google zurückkehren und nachsehen, wie viel Prozent dort die Leistung Ihrer mobilen Version bewerten. Bei einem Wert von 100 % ist das Ziel vollständig erreicht. Ihre Website wird im Ranking steigen und guten Traffic haben. Liegt der Wert um ein paar Prozent darunter, stellt dies kein nennenswertes Problem dar. Wenn das Ergebnis nicht zufriedenstellend ist, sollten Sie Ihre Anpassungsmethode überdenken. Bei der Auswahl der Adaptionsmethode spielt die Vorlage eine entscheidende Rolle. Wenn die Plugins gut mit Ihrer Vorlage funktionieren, sollte es keine Probleme geben. Andernfalls empfiehlt es sich, die installierten Vorlagen zu deaktivieren und einen kostenpflichtigen Dienst zu nutzen. Bei Bedarf sollten Sie sich an einen Spezialisten wenden oder eine einfachere Vorlage installieren.

Mit dem iPad Peek-Dienst können Sie völlig kostenlos die Anzeigefunktionen Ihrer mobilen Version auf Geräten wie iPad, iPhone und anderen Apple-Gadgets sehen. Dieser Dienst ist beliebt, da die meisten Internetnutzer Apple-Geräte bevorzugen.

Sie können auch den Dienst Mobile Phone Emulator nutzen, mit dem Sie die Anzeige Ihrer mobilen Version nicht nur auf Apple-Produkten, sondern auch auf Produkten von Samsung, HTC und BlackBerry sehen können.

Screenfly ist beliebt. Dank dieses Dienstes können Sie ganz einfach herausfinden, wie Ihre Website nicht nur auf Telefonen, sondern auch auf Fernsehern, verschiedenen Laptops, Tablets und anderen Geräten angezeigt wird. Wenn Sie möchten, können Sie Ihre Parameter einstellen und die Leistung sehen.

Wenn Sie keine Websites erneut aufrufen möchten, installieren Sie Opera Mobile Emulator einmal. Dies ist eine Ergänzung zum berühmten Opera-Browser. Es ist kostenlos und einfach zu bedienen.

Falls Sie es noch nicht wissen: In zahlreichen Ländern und Regionen bilden mobile Gadgets heute die Grundlage für den Internetverkehr, und Tools wie iMessage und WhatsApp verarbeiten Unmengen von Briefen und Nachrichten nicht auf Papier, sondern auf dem Bildschirm. Immer mehr Menschen greifen auf mobile Websites statt auf ihre Desktop-Versionen. Wie können Sie sicherstellen, dass Ihre Website nicht nur auf einem Laptop- oder PC-Bildschirm, sondern auch auf einem Smartphone und Tablet richtig aussieht und funktioniert? Die Plugins, von denen wir Ihnen heute erzählen, werden Ihnen bei der Bewältigung dieser Aufgabe auf jeden Fall helfen.

Sie müssen also Ihre reguläre WordPress-Website in eine auf Mobilgeräte reagierende Website umwandeln. Hier sind Plugins, die zwar völlig kostenlos sind, Ihnen aber dabei helfen, Ihre Website für mobile Benutzer zugänglich zu machen und dabei Design und Struktur beizubehalten.

1. JetPack

Beginnen wir mit der einfachsten und vielleicht effektivsten Möglichkeit, eine WordPress-Site mobilfreundlich zu gestalten. Werkzeugset JetPack ermöglicht es Ihnen, dieses Problem mit nur einem Tastendruck zu lösen. Außerdem: Sie haben es wahrscheinlich bereits neben anderen Basis-Plugins installiert. Wenn ja, klicken Sie einfach auf den Link „JetPack“ im Site-Administratormenü und gehen Sie zur Modulseite. Dort müssen Sie „aktivieren“ Mobiles Thema" - und alles ist bereit.

2.WPtouch


Das zweiteffektivste Tool auf der Liste der kostenlosen Tools ist ein Plugin. WPtouch. Es wurde bereits mehr als 4,3 Millionen Mal heruntergeladen. Damit können Sie in nur wenigen Minuten eine schöne und schnelle mobile Website erstellen, ohne eine einzige Codezeile schreiben zu müssen. Die kostenpflichtige Version namens WPtouch Pro bietet außerdem ein separates Admin-Panel und Unterstützung im Ticketsystem.

3.WP Mobiler Detektor


Dieses Plugin verfügt über eine automatische Erkennung normaler Mobiltelefone und Smartphones. Abhängig davon wird die Seite in einer kompatiblen Version für jedes spezifische Mobiltelefon oder andere Gadget geladen (unter Berücksichtigung von Bildschirmauflösung, Diagonale und anderen Parametern). Es gibt insgesamt 7 vorinstallierte mobile Theme-Optionen. Dieses Plugin ändert außerdem automatisch die Größe und Auflösung von Bildern abhängig von der Anzeige des Benutzers. Darüber hinaus verfügt es über eigene Widgets und eine eigene Statistiksammlung.

Hauptmerkmale:

  • Automatische Geräteerkennung basierend auf einer Datenbank mit mehr als 5.000 verschiedenen Mobiltelefonen und Smartphones.
  • Die Fähigkeit, zwischen Standard-Dialern und fortschrittlichen mobilen Geräten zu unterscheiden.
  • Sammlung von Statistiken über mobile Benutzer, einschließlich der Anzahl eindeutiger Besuche, Suchverkehr usw.

4. WordPress Mobile Pack


Dieses Plugin unterstützt Domain-Mapping und Suchagenten, um verschiedene beliebte Mobilgeräte zu identifizieren und Inhalte in der für ein bestimmtes Mobiltelefon erforderlichen Auflösung und Qualität anzuzeigen. Darüber hinaus gibt es anpassbare Farbschemata für ein einzelnes Designthema.

Das Plugin enthält auch:

  • Wechseln Sie zwischen mobilem und klassischem Desktop-Theme.
  • eine Reihe unterstützter und anerkannter Geräte, einschließlich Themes für Nokia- und WebKit-Browser;
  • Anpassen der Farbpalette nach Thema mit Unterstützung für Optimierungen in CSS;
  • automatische Anpassung von Bildern und Aufteilung von Beiträgen und Seiten;
  • mobiles Admin-Panel;
  • Widget für mobile Werbung, das Plattformen wie AdMob oder Googles Mobile Adsense unterstützt;
  • mobile Analyse;
  • Widget zum Hinzufügen von Barcodes zur Site, um die Site schnell als Lesezeichen auf einem mobilen Gerät zu speichern, wenn die Site auf einem großen Desktop-Bildschirm angezeigt wird.

5.WP Mobile Edition


Tatsächlich ist dies der Zwillingsbruder des vorherigen Plugins. Es verfügt über alle gleichen Funktionen und Optionen, es gibt jedoch auch Unterstützung für ein Kommentarsystem und eine mobile XML-Karte mit eigenem Generator für Websites, was sich positiv auf die Suchmaschinenoptimierung auswirken wird. Dieses Plugin erstellt auch eine mobile Version auf einer Subdomain wie m.facebook.com, was für schnelleres Caching und die Unterstützung mobiler Cookies sorgt.

6. Wapple Architect Mobile Plugin


Dieses Plugin ist in der Markup-Sprache WAPL geschrieben, die speziell für die Anpassung, Darstellung und Bereitstellung von Webinhalten auf verschiedenen Geräten und Plattformen entwickelt wurde. Dieses Plugin verwendet für jedes spezifische Benutzergerät eine eigene API, was besser ist als die Sniffing-Methode. Hat keinen Einfluss auf die Adressstruktur der Desktop-Site. Eine recht einfache Lösung, die genauso einfach funktioniert.

7.MobilePress


Ein recht beliebtes und einfaches Plugin, das zwei Themes enthält und die weitere Theme-Entwicklung durch mobile Entwickler unterstützt.

8. Duda Mobile Website Builder


Der Duda Mobile-Plugin-Builder half bei der Erstellung mobiler Versionen von Websites, unter anderem für Projekte und Veröffentlichungen wie Forbes, Huffington Post und NY Times. Es ist sehr einfach und verwandelt Ihre normale Website schnell in eine mobile. Funktioniert mit allen WordPress-Themes und synchronisiert sich automatisch mit Ihrer Hauptseite.

gastroguru 2017