2013-04-23 2 views
14

Ich möchte eine andere statische Homepage für meine mobile Version meiner Website haben. Es ist nicht wirklich eine extra mobile Version, aber es reagiert.Wie stelle ich eine andere Static Homepage für Mobile Version ein? (wordpress)

Ich habe einen Vollbild-Schieberegler, der jetzt als statische Homepage eingestellt ist. Dies passt sich aufgrund des responsiven Aufbaus der Website der Bildschirmgröße an, sieht aber auf einem mobilen Gerät wie einem iPhone nicht besonders gut aus. Ich habe also dieses andere Homepage-Template, das ich verwenden möchte, wenn die Website auf einem mobilen Gerät angesehen wird.

Kann dies durch irgendwelche Plugins geschehen oder sollte es durch Kodierung geschehen? Ich möchte keinen Theme-Switcher oder ähnliches verwenden, ich möchte nur eine andere statische Seiteneinstellung für mobile Geräte haben.

Wer weiß, wie man das macht?

Antwort

10

könnten Sie wp_is_mobile verwenden für mobile zu überprüfen, und Haken in template_redirect eine andere Vorlage zu laden, wenn Handy erkannt wird:

function so16165211_mobile_home_redirect(){ 
    if(wp_is_mobile() && is_front_page()){ 
     include(get_template_directory() . '/home-mobile.php'); 
     exit; 
    } 
} 
add_action('template_redirect', 'so16165211_mobile_home_redirect'); 
+0

Ich könnte falsch sein (und ich hoffe, ich bin ich als würde benutze das auch gern), aber ich verstehe, dass "wp_is_mobile" auch Tablets in die Liste der Geräte aufnimmt, auf die die Weiterleitung angewendet wird? Haben Sie das selbst benutzt und können Sie das bestätigen? +1 – McNab

+1

Der Code ist nicht perfekt, könnte diese Diskussion interessant finden: http://wordpress.stackexchange.com/questions/73273/wp-is-mobile-function – diggy

+0

Sehr nützlicher Link, danke :) – McNab

0

Sie könnten versuchen, detectmobilebrowsers Skript zu verwenden.

Wie ich mich erinnere, ist es nur eine PHP-Datei und hat eine einzige Funktion, die fragt, wie verschiedene mobile Geräte (iPhones, iPads, Androids, Windows Phones, BlackBerry und Palm-Geräte) behandelt werden.

Sie können eine bessere Idee bekommen, wie das Skript funktioniert, indem Sie auf diese function generator Seite gehen.

9

würde ich Mobile-Detect in das Thema in einem eigenen Ordner enthalten und diesen Code hinzufügen, am Anfang des header.php:

if(is_front_page()){ 

    include_once('mobile-detect/Mobile_Detect.php'); 
    $detect = new Mobile_Detect(); 

    if ($detect->isMobile() || $detect->isTablet()) { 
     $redirect_url = 'http://example.com/mobile_home'; 
     header('Location: ' . $redirect_url); // Redirect the user 
    } 
} 

Sie diese Lösung anpassen konnte nur arbeiten, wie Sie wollen. Ich habe dies für mehrere Projekte für ähnliche Lösungen verwendet.

+0

Ich habe verwendet Dies gilt auch für einige Projekte - es funktioniert ganz gut und kann leicht angepasst werden. – gscharles

0

Es ist einfach und keine Notwendigkeit, alles zu codieren. Installieren Sie das "Redirection" -Plugin aus dem Wordpress-Repository. 1. Gehen Sie zur Einstellungsseite. 2. Geben Sie die "Quell-URL" mit der Startseite Ihres Standard-Desktops ein. 3. Wählen Sie bei der Option "Match" die Option "URL and user agent" & und wählen Sie "Redirect to URL". Klicken Sie auf "Umleitung hinzufügen". 4. Neue Konfigurationsoption wird angezeigt. Gib einen beliebigen Titel. Die "Quell-URL" muss leer sein (das ist Ihre Basis-Homepage). Wählen Sie auf der "User Agent" -Option, ob iPhone oder Android. Legen Sie in der Option "Abgestimmt" die gewünschte Umleitung für die mobile Startseite fest.

Fertig!

Sie können die Startseite auf dem Desktop und auf dem Mobilgerät anhand der von Ihnen vorgenommenen Umleitung mit diesem Plugin unterscheiden. Sie können jedoch nicht denselben URL-Namen haben (z. B. www.abcde.com für den Desktop & www.abcde.com/mobilehomepage für mobile Geräte).

0

Dies sollte funktionieren: (setzen Sie sie in functions.php)

//* Redirect homepage on mobile 
 
add_action('wp_head', 'wps_params', 10); 
 
function wps_params() { 
 
    ?> 
 
    \t <script> 
 
\t if (window.location.pathname == '/' && jQuery(window).width() <= 480) { 
 
\t window.location = "/webshop/"; 
 
\t } 
 
\t </script> 
 

 
    <?php 
 
}

Ersetzen Sie "/ Webshop /" mit dem Link der mobilen Homepage.

0

Dies ist für mich:

function so16165211_mobile_home_redirect(){ 
    if(wp_is_mobile() && is_front_page()){ 
     include(get_template_directory() . '/home-mobile.php'); 
     exit; 
    } 
} 
+0

Vielleicht erweitern Sie diese Antwort mit, wo dieser Code gehen soll, was es tut und wie man es benutzt? – Clonkex

0

Folgendes functions.php Hinzufügen von den Trick tun sollten:

//* Redirect homepage on mobile 

add_action('wp_head', 'wps_params', 10); 

function wps_params() { 
?> 

<script> 
if (window.location.pathname == '/' && jQuery(window).width() <= 480) { 
    window.location = "/webshop/"; 
} 
</script> 

<?php 
} 
Verwandte Themen