Sfat rapid detectarea nativă a utilizatorilor de iPhone în WordPress

Cu creșterea rapidă a utilizatorii de telefoane inteligente, a devenit din ce în ce mai importantă în dezvoltarea web pentru a asigura că vizitatorii care accesează site-ul dvs. prin dispozitive portabile sunt îngrijiți corespunzător. Există o serie de moduri în care acești vizitatori pot fi vizați, iar în acest tutorial vom explora crearea unei funcții pentru a detecta nativ utilizatorii iPhone în WordPress.


Pasul 1 Scrierea funcției

Asigurați-vă că inserați funcția înainte de închidere etichetă. În mod implicit, temele TwentyEleven și TwentyTen utilizează body_class (); în fișierul header.php pentru a adăuga dinamic clase la standard etichetă.

De exemplu, dacă vizionați o singură pagină în WordPress, este un exemplu de clasă corporală pentru o pagină / post singulară, care vă va permite să modificați dinamic stilul anumitor elemente ale designului utilizând CSS. Dacă tema dvs. nu utilizează body_class (); (chiar dacă ar trebui să facă deja asta!), mergeți mai departe și includeți-l, după cum urmează:

 >

WordPress are un număr de variabile globale care pot fi folosite pentru detectarea browserului, inclusiv $ is_iphone variabil. Vom folosi această variabilă împreună cu sistemul de clasă corporală din WordPress. Pentru a face acest lucru, trebuie să scriem mai întâi o funcție:

 

Aceasta este funcția noastră. În primul rând, dăm funcției noastre un nume de "detect_iphone" astfel încât să o putem descifra din celelalte funcții ale noastre. Veți observa apoi adăugat? Global? pentru noi $ is_iphone variabila, deoarece variabila este definită în afara funcției noastre. Apoi, spunem WordPress că dacă această condiție este îndeplinită (dacă utilizatorul navighează pe site dintr-un iPhone), pentru a adăuga "iphone" la clasa corpului nostru. Continuați și lipiți acest fragment de cod deasupra închiderii tag în header.php


Pasul 2: Direcționarea utilizatorilor iPhone cu CSS

Această funcție ne permite acum să vizăm utilizatorii iPhone folosind CSS, folosind noul iPhone creat? clasă. De exemplu, putem include următoarele în foaia de stil pentru a ne afișa h1 eticheta diferit de utilizatorii iPhone:

 h1 font-size: 30px; înălțimea liniei: 110%; text-decorare: subliniere;  .iphone h1 font-size: 35px; text-decoration: nici unul; culoare: # FF0000; 

Concluzie

Există un număr din ce în ce mai mare de metode pentru a face site-urile WordPress prietenoase pentru publicul nostru mobil și sper că acest sfat rapid vă-a ajutat să înțelegeți o altă abordare în abordarea site-urilor prietenoase pentru dispozitive mobile.

Vă încurajez să discutați propriile metode preferate de a vă face site-urile WordPress mobile-friendly în comentariile de mai jos!

Cod