Share
Med den raske veksten av smarttelefonbrukere, Det har blitt stadig viktigere i webutvikling for å sikre at besøkende som får tilgang til nettstedet ditt via håndholdte enheter, blir tatt vare på riktig. Det finnes en rekke måter som disse besøkende kan målrettes mot, og i denne opplæringen vil vi utforske å skape en funksjon for å oppdage iPhone-brukere nasjonalt. WordPress.
Pass på at du lime inn funksjonen før avslutningen stikkord. Som standard bruker TwentyEleven og TwentyTen temaene body_class (); funksjon i header.php filen for å dynamisk legge klasser til standarden stikkord.
For eksempel, hvis du ser en enkelt side i WordPress, er et eksempel på en kroppsklasse for en enkelt side / post, som vil tillate deg å endre stilen til visse elementer av designet dynamisk ved hjelp av CSS. Hvis temaet ditt ikke bruker body_class (); tag (selv om det virkelig burde gjøre det allerede!), gå videre og ta med det slik:
>
WordPress har en rekke globale variabler som kan brukes til leseroppdagelse, inkludert $ is_iphone variabel. Vi bruker denne variabelen sammen med kroppsklassesystemet i WordPress. For å gjøre det må vi først skrive en funksjon:
Dette er vår funksjon. For det første gir vi vår funksjon et navn på? Detect_iphone? slik at vi kan dechifrere det fra våre andre funksjoner. Vil du så legge til? Global? til vår $ is_iphone variabel, dette skyldes at variabelen er definert utenfor funksjonen vår. Vi forteller så WordPress at hvis denne betingelsen er oppfylt (hvis brukeren surfer på siden fra en iPhone), for å legge til? Iphone? til vår kroppsklasse. Fortsett og lim inn denne kodestykket over lukkingen tag inn header.php
Denne funksjonen lar oss nå spesifikt målrette iPhone-brukere ved hjelp av CSS, ved å bruke vår nyopprettede? Iphone? klasse. For eksempel kan vi inkludere følgende i vårt stilark for å vise våre h1 Merk forskjellig fra iPhone-brukere:
h1 skriftstørrelse: 30px; linjehøyde: 110%; tekst-dekorasjon: understreke; .iphone h1 font-size: 35px; tekst-dekorasjon: ingen; farge: # FF0000;
Det er et økende antall metoder for å gjøre WordPress-webområder vennlige for mobilmiljøet vårt, og jeg håper dette raske tipset har hjulpet deg til å forstå en annen tilnærming ved å takle mobilvennlige nettsteder.
Jeg oppfordrer deg til å diskutere dine egne foretrukne metoder for å gjøre dine WordPress-områder mobilvennlige i kommentarene nedenfor!
Accentsconagua