Mobilmenü kódos menü mellett + 3 előnye

Már egy ideje gondolkoztam ennek a bejegyzésnek a megírásán, ugyanis az utóbbi időben én is elkezdtem telefonon olvasgatni blogokat, és ilyenkor nagyon nem tudok örülni a HTML kódos menüknek, mert ugye azok mobilnézetben nem látszódnak, ezért ha meg szeretném nézni az oldalakat, internetes verzióba kell tennem a blogot. Ez elég sokszor megnehezíti a dolgomat, mert vagy nem jelenik meg jól, vagy valami hipi-szupi forgós, ugrálós kód van rajta, amire egyszerűen telefonról nem tudok rámenni. Ilyenkor általában feladom és nem nézem meg, amit akartam és talán rengeteget veszítek vele - de amiről nem tudok, az nem fáj. Persze, tudom, mennyire nehéz lemondani ezekről a HTML kódos menükről, nem véletlenül kezdtem el szórakozni vele, hogy megoldhassam a problémát. Nem sok kísérletezés után sikerült megtalálnom egy megoldást, amit most meg is osztanék veled, hogy te is segíthesd a mobilról böngésző látogatóidat az eligazodásban. Kicsit ugyan sok odafigyelést igényel a dolog, de igyekszem elég részletesen leírni a meneteket, hogy senki ne tudja elrontani. Akkor vágjunk is bele!

(Ne ijedj meg, ha valahol két oldalak modult látsz. Nekem már egyszer meg lettek csinálva ezek a lépések, most csak újracsinálom őket.)

1. Hozzunk létre egy oldalak modult.

(Én mindig az alsó modulsorba teszem, de igazából ez lényegtelen.)

2. Fontos, hogy ne legyen neve a modulnak, ugyanis ha van, akkor a lépések megcsinálása után a nevét ugyanúgy kiírná.

3. Nyissuk meg a blog HTML kódját.

4. Nézzük meg előnézetben az oldalak modult, hogy ott van-e, ahol lennie kell.

(Ez annyira nem fontos lépés, enélkül is meg lehet csinálni, de a látvány kedvéért.)

5. Menjünk vissza a sablon szerkesztéséhez, aztán ugorjunk az oldalak modulhoz.

(Nektek valószínűleg PageList1 lesz a neve.)

6. Nyitogassuk le a fekete nyilacskákat a nekünk lényeges sorok mellett.

(Kettő ilyen nyilacska van, a második az első lenyitása után jelenik meg.)

7. Jelöljük ki az ábrán látható módon a bekeretezett területet, aztán nyomjunk egy egyszerű Backspace (törlés) billentyűt.

8. Ezek után menjünk megint a sablon előnézetére és nézzük meg, mindent jól csináltunk-e. Ha így van, akkor a képen látható módon eltűnik az oldalak modul és nem lesz a helyén semmi. Ebben az esetben egyszerűen mentsük el a sablont és már készen is vagyunk.

9. Aki tényleg nagyon biztos akar lenni benne, hogy nem törölt ki semmi fontosat, az írja a blogjának URL címe végére a bekeretezett részt és már meg is csodálhatja a blogját mobilverzióban, amin látható lesz az internetes verzióból eltüntetett menü.

Na, készen is vagyunk. Ugye hogy nem volt nehéz? Ezzel viszont rengeteg időt spóroltál meg az olvasóidnak, és vonzóbbá tetted a mobilosok számára a blogod. Illetve elérhetővé tettél számukra olyan oldalakat, amikről eddig talán még nem is tudtak.

Ha esetleg valamit elrontottál, nem úgy működik, ahogy kellene, ne félj írni nekem, szívesen segítek, ha tudok.

+ 3 indok, miért tedd meg ezt a mobilos olvasóidért:

1. A bloggerek többsége a design mellett a karakterek menüpontot nézi meg először. Viszont a mobilon olvasóknak annyira nincs lehetőségük a teljes kinézetet megcsodálni, ezért nagy valószínűséggel fognak a karakterek után kutatni, amit sajnos abban az esetben nem találnak meg, ha kódos a menüd és nem jelenik meg mobilnézetben. Az is lehet, hogy már több potenciális olvasódat is elveszítetted emiatt.

2. Előfordul, hogy egy mobilos olvasónak szüksége lehet bizonyos oldalakra kényelem szempontjából, ami viszont a gépen olvasóknak nem kell, éppen ezért furán nézne ki egy olyan menüpont is. De! mi abban a szerencsés helyzetben vagyunk, hogy ennek a néhány lépésnek a végrehajtásával, lesz egy olyan menünk, aminek egyáltalán nincsen kapcsolata a gépen megjelenővel, ezért bátran tehetünk bele olyan menüpontokat is, amiket normás esetben nem tennék. Ilyen lehet például egy oldal, ahova be lett téve a chat kódja, így az is tud írni, aki telefonról nézi a blogot. Vagy például egy feliratkozós linket, amire rákattintva csak be kell jelentkeznie a gmail fiókjába és már követi is a blogot. És még számos ötlettel elő lehet rukkolni.

3. Ez a pont az előző kettő ötvözése, mégis igényel külön említést. Ugyanis, míg az első pontban ugyanazokat a menüpontokat jelenítetted meg, amiket a gépen is látni, a másodikban pedig kényelmessé tetted a mobilosok hozzáférését bizonyos dolgokhoz, addig itt olyan információkat oszthatsz meg velük, amiket az internetes verzióban egy szöveges modulba rejtettél. Gondolok itt az Információs modulra, a szavazásokra, esetleg egy külön oldalra, amin elnavigálod őket, ha annyira összetett a blogod felépítése. Ez leginkább az enyémhez hasonló mindenes blogokra vonatkozik, vagy éppen a design-kritika blogokra, habár természetesen egy történetes oldalon is - általában a sok menüpontnak köszönhetően - el lehet siklani olyanok felett, amik amúgy érdekesek lehettek volna számunkra. Ennek elkerülése végett érdemes létrehozni ezt az oldalt is, ha szeretnénk még kényelmesebbé tenni mobilos olvasóink számára a böngészést.

MIRacIe M.