Il-Websajt Responsiva Tiegħi Mhix Qiegħda Taħdem. The Fix: Viewport.

My Responsive Website Isn T Working







Ipprova L-Istrument Tagħna Biex Telimina L-Problemi

falkun vs ajkla vs falk

Ħabib tiegħi reċentement ikkuntattjani biex jitlob l-għajnuna b’sit ta ’WordPress li kien bena bl-użu tat-tema X. Il-klijent tiegħu kien ċempillu dakinhar filgħodu wara li nduna li l-websajt tiegħu ma kinitx qed tidher sewwa fuq l-iPhone tiegħu. Nick ivverifikah hu stess, u żgur, id-disinn sabiħ li jirrispondi li ddisinja ma kienx qed jaħdem aktar.





Huwa baqa 'mistħajjel mill-fatt li meta bidel id-daqs tat-tieqa tal-browser tiegħu fuq id-desktop tiegħu, is-sit kien jirrispondi, iżda fuq l-iPhone tiegħu, intweriet biss il-verżjoni tad-desktop. Għaliex sit ikun jirrispondu fuq kompjuter desktop u mhux reattiv fuq apparat mobbli?



Għaliex Id-Disinn Responsiv Ma Jaħdimx

Id-disinn reattiv ma jibqax jaħdem meta linja waħda ta 'kodiċi tkun nieqsa mill-intestatura ta' fajl HTML. Jekk din il-linja unika ta ’kodiċi hija nieqsa, l-iPhone, l-Android, u apparat mobbli ieħor tiegħek ser jassumu li l-websajt li qed tara hija sit tad-desktop ta’ daqs sħiħ u taġġusta d-daqs tal- viewport biex tinkludi l-iskrin kollu.

X'tifhem bi Viewport u Viewport Size?

Fuq il-mezzi kollha, id-daqs tal-viewport jirreferi għad-daqs taż-żona ta 'paġna tal-web li bħalissa hija viżibbli għall-utent. Immaġina li qed iżżomm iPhone 5 b'wisa 'ta' 320 pixels. Sakemm ma jingħadx b'mod espliċitu mod ieħor, l-iPhones jassumu li kull websajt li żżur hija sit tad-desktop b'wisa 'ta' 980px.

Issa, billi tuża l-iPhone 5 immaġinarju tiegħek,iżżur websajt iddisinjata għad-desktop li hija wiesgħa 800px. M'għandux arranġament li jirrispondi, allura l-iPhone tiegħek juri l-verżjoni tad-desktop b'wisa 'sħiħa.





rota tal-iskrin iswed iffriżat tal-iphone

Iżda iPhone 5 huwa biss 320 pixel wiesa '. Mhuwiex dak dejjem id-daqs tal-viewport?

Le, mhux. Bid-daqs tal-viewport, skalar jista 'jkun involut . L-iPhone irid iċċekken biex jara l-verżjoni tal-wisa 'sħiħa tal-paġna tal-web. Ftakar li l-viewport jirreferi għaż-żona ta 'paġna li bħalissa hija viżibbli għall-utent. L-utent tal-iPhone bħalissa qed jara biss 320 pixel tal-paġna, jew qed jara l-verżjoni b'wisa 'sħiħa?

Hekk hu: Qegħdin jaraw il-paġna tal-web b'wisa 'sħiħa fuq il-wirja tagħhom minħabba li l-iPhone assuma li hija mġieba default: Huwa mċekken sabiex l-utent ikun jista' jara paġna tal-web sa wisa 'ta' 980 pixels. Għalhekk, il-viewport tal-iPhone huwa 980px.

Hekk kif tagħmel zoom in jew 'il barra, id-daqs tal-viewport jinbidel. Qabel konna ngħidu li l-websajt immaġinarja tagħna għandha wisa 'ta' 800px, allura jekk kieku tagħmel zoom fuq l-iPhone tiegħek sabiex it-truf tal-websajt ikunu jmissu t-truf tal-wiri tal-iPhone tiegħek, il-viewport ikun 800px. L-iPhone jista ' ikollok viewport ta ’320px fuq sit tad-desktop, imma kieku kien hekk, tkun qed tara biss porzjon żgħir minnu.

l-iphone 6 ma jibqax konness mal-wifi

Il-Websajt Responsiva Tiegħi Tkissret. Kif Nirranġaha?

It-tweġiba hija linja waħda ta ’HTML li meta tiddaħħal fl-intestatura ta’ paġna tal-web tgħid lill-apparat biex jistabbilixxi l-viewport għall-wisa ’tiegħu stess (320px fil-każ ta’ iPhone 5) u biex ma jżidx (jew iżomm) il-paġna.

Għal diskussjoni aktar teknika ta 'l-għażliet kollha relatati ma' din il-meta tag, iċċekkja dan l-artikolu fuq tutsplus.com .

Kif Tirranġa Tema WordPress X Meta Ma Tweġibx

Lura għand ħabib tiegħi minn qabel: Din il-linja waħda ta 'kodiċi sparixxiet meta aġġorna t-tema X. Meta tiffissa tiegħek, żomm f'moħħok li t-tema X ma tużax header file wieħed biss - tuża header files differenti għal kull munzell, allura jkollok teditja tiegħek.

batterija iphone jispiċċa malajr

Peress li Nick juża l-munzell Ethos ta 'tema X, huwa kellu jżid linja ta' kodiċi li semmejt qabel mal-header file li kien jinsab f'x /frameworks/views/ethos/wp-header.php . Jekk tuża munzell differenti, ibdel l-isem tal-munzell tiegħek (Integrità, Ġedded, eċċ.) Għal 'ethos' biex issib il-fajl header korrett. Daħħal dik il-linja waħda, u voila! Int tajjeb li tmur.

Allura Dan Jirranġa l-Mistoqsijiet tal-Midja CSS Tiegħi, Wisq?

Meta ddaħħal dik il-linja fl-intestatura tal-fajl HTML tiegħek, il-mistoqsijiet li jirrispondu @media f'daqqa waħda jerġgħu jibdew jaħdmu u l-verżjoni mobbli tal-websajt tiegħek terġa 'tibda għall-ħajja. Grazzi tal-qari u nispera li jgħin!

Ftakar li Payette Quddiem,
David P.