Vinur minn hafði nýlega samband við mig til að biðja um hjálp við WordPress síðu sem hann hafði smíðað með X þema. Skjólstæðingur hans hafði hringt í hann um morguninn eftir að hann tók eftir því að vefsíða hans birtist ekki rétt á iPhone hans. Nick skoðaði það sjálfur og vissulega var fallega móttækilega hönnunin sem hann hannaði ekki að virka lengur.
Hann var enn frekar dulur við þá staðreynd að þegar hann breytti stærð vafragluggans á skjáborðinu, síðunni var móttækilegur, en á iPhone hans var aðeins skjáborðsútgáfan sýnd. Af hverju væri síða móttækilegur á borðtölvu og svarar ekki í farsíma?
Af hverju móttækileg hönnun virkar ekki
Móttækileg hönnun hættir að virka þegar eina línu af kóða vantar í haus HTML skjalsins. Ef þessa einu línu af kóðanum vantar munu iPhone, Android og önnur farsímatæki gera ráð fyrir að vefsíðan sem þú ert að skoða sé skjáborðsíða í fullri stærð og stilla stærð útsýni að ná yfir allan skjáinn.
Hvað meinaru með útsýnisstærð og útsýnisstærð?
Í öllum tækjum vísar stærð útsýnisins til stærðar flatarmáls vefsíðu sem er sýnileg notandanum eins og er. Ímyndaðu þér að þú sért með iPhone 5 með 320 pixla breidd. Nema annað sé sérstaklega sagt, gera iPhone ráð fyrir að sérhver vefsíða sem þú heimsækir sé skjáborðsíða með breiddina 980 pixla.
Nú, með ímyndaða iPhone 5 þínum,þú heimsækir vefsíðu sem er hannað fyrir skjáborð sem er 800 pixlar á breidd. Það hefur ekki móttækilegt skipulag og því birtir iPhone skjáborðsútgáfan í fullri breidd.
af hverju get ég ekki eytt myndum af iphone mínum
En iPhone 5 er aðeins 320 pixlar á breidd. Er það ekki alltaf stærð útsýnishafnarinnar?
Nei það er það ekki. Með stærð útsýnis stigstærð getur komið við sögu . IPhone þarf að stækka til að sjá útgáfu vefsíðunnar í fullri breidd. Mundu að útsýni vísar til þess svæði á síðunni sem er sýnilegt notandanum eins og er. Er iPhone notandinn sem stendur að sjá aðeins 320 punkta af síðunni, eða er hann að sjá útgáfuna í fullri breidd?
Það er rétt: Þeir sjá vefsíðuna í fullri breidd á skjánum sínum vegna þess að iPhone hefur gengið út frá því að það sé sjálfgefin hegðun: Það er súmað út svo notandinn gæti skoðað vefsíðu upp í 980 punkta breidd. Þess vegna er útsýni iPhone símans 980 pixlar.
Þegar þú stækkar eða stækkar breytist stærð útsýnisstaðarins. Við sögðum áður að ímyndaða vefsíðan okkar hefði 800 pixla breidd, þannig að ef þú myndir stækka iPhone þinn svo að brúnir vefsíðunnar snertu brúnir skjásins á iPhone þínum væri útsýnisstefnan 800 pixlar. IPhone dós hafðu 320px útsýni á skjáborðsvef, en ef það gerðist, myndirðu aðeins sjá lítinn hluta þess.
þarf ég símahylki
Móttækileg vefsíða mín er biluð. Hvernig laga ég það?
Svarið er ein lína af HTML sem þegar hún er sett inn í haus vefsíðu segir tækinu að stilla sýnishornið á eigin breidd (320 pixla þegar um er að ræða iPhone 5) og ekki að minnka (eða stækka) síðuna.
Til að fá meiri tæknilega umfjöllun um alla valkosti sem tengjast þessu metamerki skaltu skoða þessi grein á tutsplus.com .
Hvernig á að laga WordPress X þema þegar það er ekki móttækilegt
Aftur til vinar míns frá áður: Þessi eina lína af kóða hvarf þegar hann uppfærði X þemað. Þegar þú lagar þitt skaltu hafa í huga að X þemað notar ekki aðeins eina hausskrá - það notar mismunandi hausskrár fyrir hvern stafla, svo þú verður að breyta þínum.
engin þjónusta á nýja iphone
Þar sem Nick notar Ethos stafla af X þema, varð hann að bæta við kóðalínu sem ég nefndi áður við hausskrána sem var staðsett í x /frameworks/views/ethos/wp-header.php . Ef þú notar annan stafla skaltu skipta um nafn stafla þíns (Heiðarleiki, Endurnýja osfrv.) Fyrir „ethos“ til að finna rétta hausskrá. Settu inn þessa einu línu og voila! Þú ert góður að fara.
Svo að þetta lagar CSS fjölmiðlafyrirspurnir mínar líka?
Þegar þú setur þessa línu inn í hausinn á HTML skjalinu þínu munu móttækilegar @media fyrirspurnir þínar skyndilega byrja að virka aftur og farsímaútgáfa vefsíðunnar þinnar mun lifna aftur. Takk fyrir lesturinn og ég vona að það hjálpi!
Mundu að framsenda Payette,
David P.