Mit dem schnellen Wachstum von Smartphone-Benutzer, In der Webentwicklung wird es immer wichtiger, sicherzustellen, dass Besucher, die über Handheld-Geräte auf Ihre Website zugreifen, entsprechend bedient werden. Diese Besucher können auf verschiedene Weise angesprochen werden. In diesem Lernprogramm wird eine Funktion zum nativen Erkennen von iPhone-Nutzern beschrieben WordPress.
Stellen Sie sicher, dass Sie die Funktion vor dem Schließen einfügen Etikett. Standardmäßig verwenden die Designs TwentyEleven und TwentyTen die
body_class ();
Funktion in der Datei header.php, um Klassen dynamisch zum Standard hinzuzufügen Etikett.
Zum Beispiel, wenn Sie eine einzelne Seite in WordPress anzeigen, ist ein Beispiel für eine Body-Klasse für eine einzelne Seite / einen Beitrag, mit der Sie den Stil bestimmter Elemente Ihres Designs mithilfe von CSS dynamisch ändern können. Wenn Ihr Thema das nicht verwendet
body_class ();
tag (auch wenn es das eigentlich schon tun sollte!), machen Sie weiter und fügen Sie es wie folgt hinzu:
>
WordPress verfügt über eine Reihe globaler Variablen, die zur Browsererkennung verwendet werden können, einschließlich der $ is_iphone
Variable. Wir werden diese Variable zusammen mit dem Body Class System in WordPress verwenden. Dazu müssen wir zunächst eine Funktion schreiben:
Dies ist unsere Funktion. Erstens geben wir unserer Funktion den Namen? Detect_iphone? damit wir es von unseren anderen Funktionen entschlüsseln können. Sie werden dann feststellen, dass "global" hinzugefügt wird. zu unserer $ is_iphone
Variable, weil die Variable außerhalb unserer Funktion definiert ist. Wir teilen WordPress dann mit, dass diese Bedingung erfüllt ist (wenn der Benutzer die Website von einem iPhone aus durchsucht). zu unserer Körperklasse. Fahren Sie fort und fügen Sie dieses Codefragment oberhalb der Schließung ein Tag in der header.php
Mit dieser Funktion können wir jetzt gezielt iPhone-Benutzer mit CSS ansprechen, indem wir unser neu erstelltes iPhone verwenden. Klasse. In unserem Stylesheet können wir beispielsweise Folgendes angeben, um unser Format anzuzeigen h1
Tag anders als iPhone Nutzer:
h1 font-size: 30px; Zeilenhöhe: 110%; Textdekoration: Unterstrichen; .iphone h1 Schriftgröße: 35px; Textdekoration: keine; Farbe: # FF0000;
Es gibt eine zunehmende Anzahl von Methoden, um WordPress-Websites für unsere mobile Zielgruppe zu verbessern, und ich hoffe, dieser Quick-Tipp hat Ihnen dabei geholfen, einen anderen Ansatz für mobile mobile Websites zu verstehen.
Ich möchte Sie dazu ermutigen, in den folgenden Kommentaren Ihre bevorzugten Methoden zur Mobilisierung Ihrer WordPress-Sites zu besprechen!