Mit fortschreitender Technologie nutzen immer mehr Menschen mobile Geräte, um im Internet zu surfen. Dies ist ein Trend, den viele Website-Ersteller bemerkt haben, weshalb sie jetzt mobile Versionen ihrer Websites erstellen. Daher ist es notwendig zu prüfen, wie diese Seiten auf verschiedenen Mobilgeräten aussehen. In diesem Artikel erfahren Sie, wie Sie die mobile Version von WordPress-Sites auf Ihrem Computer anzeigen können.
1. Verwenden Sie die Entwicklertools in Ihrem Browser
Die einfachste und beliebteste Möglichkeit, eine mobile Version einer Website auf einem Computer anzuzeigen, ist die Verwendung der in den meisten Browsern verfügbaren Entwicklungstools. In Google Chrome können Sie dies beispielsweise wie folgt tun:
- Klicken Sie mit der rechten Maustaste auf die Seite und wählen Sie „Entwicklertools“ oder verwenden Sie die Tastenkombination (F12 oder Strg+Umschalt+I).
- Suchen Sie in den Entwicklertools nach dem Symbol „Gerätesymbolleiste umschalten“ (Tastenkombination Strg+Umschalt+M), das sich in der oberen linken Ecke befindet, und klicken Sie darauf.
- Wählen Sie das Gerätemodell aus, auf dem Sie Ihre Website testen möchten.
- Aktualisieren Sie die Seite (F5).
2. Verwenden Sie ein WordPress-Plugin
Es gibt viele WordPress-Plugins, mit denen Sie die Anzeige der mobilen Version Ihrer Website auf Desktop-Computern erzwingen können. Mit dem Plugin „Mobile Preview“ können Sie beispielsweise eine mobile Version einer Website auf einem Desktop-Computer anzeigen.
Um dieses Plugin zu installieren und zu konfigurieren, befolgen Sie diese Schritte:
- Melden Sie sich im WordPress-Administrationsbereich an.
- Gehen Sie zu „Plugins“ > „Neu hinzufügen“.
- Suchen Sie nach „Mobile Preview“ und klicken Sie auf „Jetzt installieren“.
- Aktivieren Sie nach der Installation das Plugin.
- Gehen Sie zu „Einstellungen“ > „Mobile Vorschau“ und konfigurieren Sie Ihre bevorzugten Einstellungen.
3. Verwenden Sie ein PHP-Snippet
Wenn Sie technisch versierter sind, können Sie das folgende PHP-Snippet auf Ihr WordPress-Theme anwenden, um die Anzeige der mobilen Version Ihrer Website auf Desktop-Computern zu erzwingen. Denken Sie daran, dass Sie immer ein Backup Ihrer Website erstellen sollten, bevor Sie Codeänderungen vornehmen.
function force_mobile_theme($theme) {
if (isset($_GET['mobile']) && $_GET['mobile'] == 'yes') {
return 'mobile-theme-name';
} else {
return $theme;
}
}
add_filter('template', 'force_mobile_theme');
add_filter('option_template', 'force_mobile_theme');
add_filter('option_stylesheet', 'force_mobile_theme');
In diesem Code Name des mobilen Themes
sollte der Ordnername Ihres mobilen Themes sein. Sie können die mobile Version Ihrer Website jetzt auf einem Computer testen, indem Sie „?mobile=yes“ am Ende der URL hinzufügen.
4. Nutzen Sie einen Onlinedienst
Schließlich gibt es viele Online-Dienste, mit denen Sie testen können, wie eine Website auf verschiedenen Geräten aussieht. Einige von ihnen sind:
- MobileTest.me
- BrowserStack
- Responsinator
Sie erfordern, dass Sie die URL der Seite eingeben und dann anzeigen, wie die Seite auf verschiedenen Mobilgeräten aussehen wird. Einige dieser Dienste sind kostenpflichtig, bieten aber kostenlose Testversionen an.
Jede dieser Methoden hat ihre Vor- und Nachteile. Daher lohnt es sich, verschiedene Ansätze auszuprobieren, um herauszufinden, welcher Ihren Anforderungen am besten entspricht. Denken Sie daran, dass das ultimative Ziel darin besteht, sicherzustellen, dass Ihre Website auf Mobilgeräten genauso gut aussieht und funktioniert wie auf dem Desktop.