Amiko mia ĵus kontaktis min por peti helpon kun WordPress-retejo, kiun li konstruis per la X-temo. Lia kliento vokis lin tiun matenon post kiam li rimarkis, ke lia retejo ne montriĝas ĝuste en sia iPhone. Nick mem kontrolis ĝin, kaj certe, la bela respondema dezajno, kiun li projektis, ne plu funkciis.
Li plue miris pro la fakto, ke kiam li regrandigis sian retumilan fenestron sur sia labortablo, la retejo estis respondema, sed sur lia iPhone, nur la labortabla versio montriĝis. Kial retejo estus respondema sur surtabla komputilo kaj ĉu nerespondema sur poŝtelefono?
Kial Respondema Dezajno Ne Funkcias
Respondema projektado ĉesas funkcii kiam unu linio de kodo mankas en la kaplinio de HTML-dosiero. Se ĉi tiu sola linio de kodo mankas, via iPhone, Android kaj aliaj poŝtelefonoj supozos, ke la retejo, kiun vi vidas, estas plengranda labortabla retejo kaj ĝustigos la grandecon de la vidpunkto ampleksi la tutan ekranon.
Kion Vi Signifas Per Vidpunkto kaj Vidpunkta Grandeco?
Sur ĉiuj aparatoj, la grandeco de la vidpunkto rilatas al la grandeco de la areo de retpaĝo nuntempe videbla por la uzanto. Imagu, ke vi tenas iPhone 5 kun larĝo de 320 rastrumeroj. Krom se eksplicite dirite alie, iPhonoj supozas, ke ĉiu retejo, kiun vi vizitas, estas labortabla retejo kun larĝo de 980px.
Nun, uzante vian imagan iPhone 5,vi vizitas retejon desegnitan por labortablo larĝa 800px. Ĝi ne havas respondeman aranĝon, do via iPhone montras la plenlarĝan labortablan version.
iphone 6 konstante serĉas signalon
Sed iPhone 5 larĝas nur 320 rastrumerojn. Ĉu tio ne ĉiam estas la grandeco de la vidpunkto?
Ne, ĝi ne estas. Kun vidinda grandeco, skalo povas esti implikita . La iPhone devas malpligrandiĝi por vidi la plenlarĝan version de la retpaĝo. Memoru, ke vidpunkto rilatas al la areo de paĝo nuntempe videbla por la uzanto. Ĉu la uzanto de iPhone nuntempe vidas nur 320 rastrumerojn de la paĝo, aŭ ĉu ili vidas la plenlarĝan version?
Prave: Ili vidas la plenlarĝan retpaĝon sur sia ekrano ĉar la iPhone supozis, ke ĝi estas defaŭlta konduto: ĝi malpligrandiĝis, tiel ke la uzanto povus vidi retpaĝon ĝis larĝo de 980 rastrumeroj. Sekve, la vidpunkto de la iPhone estas 980px.
Dum vi zomas aŭ malpligrandiĝas, la vidinda grandeco ŝanĝiĝas. Ni antaŭe diris, ke nia imaga retejo havas larĝon de 800px, do se vi zomus vian iPhone tiel ke la randoj de la retejo tuŝus la randojn de la ekrano de via iPhone, la vidpunkto estus 800px. La iPhone povas havas vidpunkton de 320px sur labortabla retejo, sed se ĝi farus, vi vidus nur malgrandan parton de ĝi.
kial mia iphone sendas tekstojn anstataŭ mesaĝon
Mia Respondema Retejo Rompiĝas. Kiel Mi Riparas Ĝin?
La respondo estas ununura linio de HTML, kiu enmetita en la kaplinion de retpaĝo diras al la aparato agordi la vidpunkton laŭ sia propra larĝo (320px en la kazo de iPhone 5) kaj ne grimpi (aŭ zomi) la paĝon.
Por pli teknika diskuto pri ĉiuj ebloj rilataj al ĉi tiu meta-etikedo, rigardu ĉi tiu artikolo ĉe tutsplus.com .
Kiel Ripari WordPress X-Temon Kiam Ĝi Ne Respondas
Reen al mia amiko de antaŭe: Ĉi tiu linio de kodo malaperis kiam li ĝisdatigis la X-temon. Kiam vi riparas vian, memoru, ke la X-temo ne uzas nur unu titolan dosieron - ĝi uzas malsamajn titolajn dosierojn por ĉiu stako, do vi devos redakti la vian.
iphone 8 nigra ekrano sed tamen plu
Ĉar Nick uzas la etosan stakon de X-temo, li devis aldoni linion de kodo, kiun mi menciis antaŭe, al la kapdosiero, kiu troviĝis en x /frameworks/views/ethos/wp-header.php . Se vi uzas alian stakon, anstataŭigu la nomon de via stako (Integreco, Renovigi, ktp.) Per 'ethos' por trovi la ĝustan kapdosieron. Enmetu tiun unu linion, kaj voila! Vi bonas iri.
Do Ĉi tio Riparas Miajn CSS-Amaskomunikilajn Demandojn, Ĉu Ankaŭ?
Kiam vi enmetas tiun linion en la kaplinion de via HTML-dosiero, viaj respondemaj @mediaj demandoj subite ekfunkcios kaj la poŝtelefona versio de via retejo reviviĝos. Dankon pro legado kaj mi esperas, ke ĝi helpos!
Memoru Payette Antaŭen,
David P.