Als Webdesigner und -entwickler leben wir seit einigen Jahren im mobilen Zeitalter. In diesem Lernprogramm werden sieben Plugins beschrieben, die dazu beitragen, dass Ihre Website gut aussieht und für mobile Besucher eine gute Leistung bringt.
Mobile Besucher beziehen sich normalerweise auf diejenigen, die die Website über ein Tablet oder Smartphone besuchen. Natürlich müssen wir Websites erstellen, die auf mobile Geräte reagieren und sich anpassen. Andernfalls werden wir nicht viele Besucher erreichen, die unsere Websites und / oder Anwendungen besuchen.
Aber wie holen wir uns ein? Natürlich, indem wir unsere Websites mobil machen. In diesem Lernprogramm werden wir sieben Plugins überprüfen, die Ihnen dabei helfen, Ihre Website für mobile Benutzer gut aussehen zu lassen.
Es ist unwahrscheinlich, dass Sie in den letzten zwei Jahren noch nie von den Begriffen "responsives Webdesign" oder "adaptives Webdesign" gehört haben. Der Zweck dieses Ansatzes im Webdesign besteht darin, Webseiten an die Grenzen der Bildschirme mobiler Geräte anzupassen.
Mit den folgenden vier WordPress-Plugins können Sie auf Ihrer Website Mobile-Ready-Seiten präsentieren.
Hammy ist ein praktisches Plugin, das die Größe der Bilder auf Ihrer Website für mobile Geräte ändert. Es ersetzt das Tags mit
Tags und verwendet WordPress 3.5-Bildcode, um die Größe der Bilder zu ändern.
Um das Plugin verwenden zu können, müssen Sie einige Haltepunkte setzen und ein Container-HTML-Element auswählen. Mit den von Ihnen angegebenen Haltepunkten kann das Plugin die Größe der Bilder ändern, wenn die Bildschirmbreite einen Haltepunkt erreicht. Sie können auch einige Klassennamen festlegen, um zu verhindern, dass bestimmte Bilder ignoriert werden.
Responsive Widgets ist ein Plugin, das neue WordPress-Text / HTML-Widgets einführt, die nur auf bestimmten Geräten wie iPads, Nooks, PlayStation Vitas und anderen generischen Geräten wie Tablets oder Smartphones erscheinen.
Um das Plugin verwenden zu können, benötigen Sie lediglich ein grundlegendes Verständnis der WordPress-Widgets. Öffnen Sie die Widgets-Seite, und Sie sehen viele neue Widgets für die folgenden Geräte und Bildschirmtypen:
Viele Widgets haben Kontrollkästchen, mit denen Sie Ausnahmen machen können. Wenn Sie beispielsweise ein Widget auf Tablets, aber nicht auf iPads anzeigen möchten, können Sie ein Kontrollkästchen aktivieren und schon kann es losgehen.
WP Lightbox 2 ist ein sehr beliebtes "Lightbox" -Plugin, mit dem Sie In-Page-Popup-Bilder und Galerien mit Overlay-Effekten verwenden können. Es handelt sich nicht um ein Plugin, das Sie mit responsivem Webdesign an sich unterstützt, sondern es ist sofort einsatzbereit, sodass Sie es mit Ihren Websites verwenden können.
Um das Plugin verwenden zu können, müssen Sie nichts weiter tun, als das Plugin zu aktivieren. Es gibt einige Optionen wie das Aktivieren von Lightbox im Kommentarbereich oder das Ändern der Animationsdauer. Grundsätzlich funktioniert die Aktivierung jedoch ohne weitere Konfiguration.
Verantwortlich ist ein äußerst hilfreiches WordPress-Plugin, mit dem Sie Ihre responsive Designs im Browser in Echtzeit testen können. Es verwendet das Viewport Resizer Bookmarklet, um eine feste Leiste am oberen Rand Ihrer Seite zu platzieren, in der Sie die Seite auf die gewünschten Abmessungen wie Smartphones, Tablets oder Desktop-Bildschirme sowie benutzerdefinierte Dimensionen einstellen können.
Um das Plugin zu verwenden, aktivieren Sie es einfach und besuchen Sie eine Ihrer Seiten. Die Leiste wird auf jeder Seite angezeigt, sodass Sie Ihre Designs völlig problemlos testen können.
Diese Plugins arbeiten auf eine spezielle Art und Weise: Sie helfen Ihnen, ein anderes WordPress-Theme anzuzeigen, wenn der Benutzer über ein Mobilgerät eine Verbindung zu Ihrer Website herstellt. Dies ist besonders nützlich, wenn Sie ein Motiv haben, das nicht für Mobilgeräte geeignet ist. Wenn Sie weder die Zeit noch die Energie haben, um Ihr Theme für Mobilgeräte bereit zu stellen, können Sie diese fantastischen Plugins für die Arbeit nutzen.
Mit mehr als fünf Millionen Downloads und einer Bewertung von 3,9 von 5 Sternen ist WPTouch das wahrscheinlich beliebteste mobile Theme-Plugin. Es bietet eine der einfachsten Möglichkeiten, eine mobile Version Ihrer Website zu erstellen, die sofort einsatzbereit ist.
Um das Plugin verwenden zu können, müssen Sie nur das Plugin installieren und aktivieren. Während die Standardeinstellungen für viele Benutzer ausreichen, können Sie auf den Konfigurationsseiten eine Vielzahl von Einstellungen anpassen.
Ein Wort der Warnung: Mit großer Kraft geht eine große Verantwortung einher, mit über fünf Millionen Downloads sogar noch mehr. Im Juli 2014 wurde bekannt gegeben, dass WPTouch 3.x-Versionen eine tödliche Sicherheitsanfälligkeit aufweisen, die sofort behoben wurde, aber möglicherweise zu großen Problemen für Benutzer des Plugins geführt hat. Es ist immer eine gute Idee, nach Updates zu suchen. Dies gilt für den Kern und alle Ihre Plugins und Designs.
WordPress Mobile Pack ist ein weiterer großer Player, der mobile Themes für WordPress-Websites anbietet. Derzeit gibt es über 600.000 Downloads und eine Bewertung von 3,8 von 5 Sternen. WordPress Mobile Pack bietet ein sehr einzigartiges mobiles Design für Sie und Ihre Besucher - eine mobile App-artige Oberfläche anstelle eines klassischen mobilen Designs.
Wie WPTouch ist WordPress Mobile Pack einsatzbereit, wenn Sie das Plugin installieren und aktivieren. Wenn Sie möchten, können Sie auf der Konfigurationsseite einige Anpassungen vornehmen.
Jetpack ist nicht nur eines der beliebtesten WordPress-Plugins je, Es wird jedoch auch von WordPress.com und Automattic unterstützt und verwaltet. Und dieses große Plugin hat auch eine "Mobile Theme" -Funktion, von der wir profitieren können.
Um die "Mobile Theme" -Funktion verwenden zu können, müssen Sie auf die Jetpack "Einstellungen Konfigurationsseite, nachdem Sie Jetpack installiert und aktiviert haben. Suchen Sie in der Liste der Jetpack-Module nach "Mobile Theme" und aktivieren Sie es. Es ist nicht wirklich viel, aber es bietet ein schnelles und sauberes Design für mobile Geräte. Ein Hinweis aus persönlicher Erfahrung: Mit dem offiziellen Disqus-Plugin spielt es nicht gut.
Im Internet ist es immer wichtig, mit den Trends Schritt zu halten und den Benutzern das zu bieten, was sie wollen, insbesondere wenn Sie von ihnen etwas erwarten (sei es Geld oder Lob). Heutzutage wird "mobile ready" zum Standard und es wäre dumm, Ihre Benutzer mit einer Website abzuschrecken, die sich nicht gut auf mobile Geräte überträgt.
Kennen Sie andere gute Plugins, die Websites mobiler machen? Bitte teilen Sie uns Ihre Gedanken und Ihr Wissen, indem Sie unten kommentieren. Und wenn Ihnen dieser Artikel gefallen hat, vergessen Sie nicht, ihn mit Ihren Freunden zu teilen!