Megfelelő megjelenés telefonon és táblagépen
Nézze meg, hogyan jelenik meg webáruháza táblagépeken és telefonokon, rejtsen el blokkokat kis képernyőn, és állítson be egy blokk helyzetét csak egyetlen képernyőmérethez.
A legtöbb vásárló telefonról nézi a webáruházat, ezért az oldalainak minden méretben működniük kell. Egyszer tervez, a Payly pedig táblagépekhez és telefonokhoz igazítja az oldalt. Ez a cikk bemutatja, mi történik magától, és hogyan módosíthatja, ha azt szeretné, hogy egy blokk kisebb képernyőn másképp viselkedjen.
Hogyan igazodik az elrendezés
A blokkok egy 12 oszlopos rács celláiban helyezkednek el, sosem fix pixelpozícióban, így kis képernyőn sem fedhetik egymást. Az oldal két ponton vált elrendezést:
- Táblagépek (1024 pixelnél keskenyebb képernyők) ugyanazt a rácsot használják. A blokk a helyén marad, hacsak nem helyezi át táblagépekhez.
- Telefonok (760 pixelnél keskenyebb képernyők) minden blokkot külön sorba, teljes szélességben tesznek. A blokkok felülről lefelé, abban a sorrendben kerülnek egymás alá, ahogyan asztali nézetben olvasná őket: felülről lefelé, majd balról jobbra.
Néhány blokk tovább alkalmazkodik. A fejléc hivatkozásai egy menügomb mögé kerülnek, a rácsok egy oszlopra csukódnak össze, a galériák és a logósávok pedig két oszlopban jelennek meg. Így a webáruház külön beállítás nélkül is működik telefonon.
Váltás a képernyőméretek között
- A szerkesztőfelület felső sávjában kattintson a Tablet vagy a Mobil gombra. Az oldal összeszűkül, hogy megmutassa, hogyan néz ki az adott méretben.
- Nézze végig az oldalt, és keresse meg, ami nem jól olvasható. Görgessen, és jelöljön ki blokkokat a megszokott módon.
- A teljes méretű elrendezéshez kattintson az Asztali gombra.
Ezek a gombok nem csak előnézetet adnak. Azt is megadják, melyik elrendezést szerkeszti. Ha a Tablet vagy a Mobil nézetre vált, egy üzenet emlékezteti Önt, hogy a módosítások csak arra a méretre vonatkoznak. Az ott végzett változtatások nem érintik az asztali elrendezést.
Blokk elrejtése kis képernyőn
Egy nagy fotó vagy egy hosszú díszítő blokk zsúfolttá teheti a telefont. Elrejtheti kis képernyőn, asztali nézetben pedig meghagyhatja.
- A felső sávban kattintson a Mobil (vagy a Tablet) gombra.
- Jelölje ki a blokkot.
- A beállítási panelen nyissa meg a Méret és helyzet csoportot.
- Kapcsolja be az Elrejtés mobilon (vagy az Elrejtés tableten) beállítást. A blokk eltűnik abból a nézetből, és nem hagy üres helyet az élő oldalon.
A táblagépen elrejtett blokk a telefonon is rejtve marad, hacsak a Mobil nézetben ki nem kapcsolja ezt a beállítást. Ha egy blokkot minden képernyőn el szeretne rejteni, az Asztali nézetben használja a Blokk elrejtése beállítást.
Blokk másképp elhelyezése egy méreten
- A felső sávban válassza a Tablet vagy a Mobil nézetet.
- Jelölje ki a blokkot, és nyissa meg a Méret és helyzet csoportot.
- Módosítsa a Kezdő oszlop, a Szélesség oszlopokban, a Kezdő sor vagy a Magasság sorokban értékét, vagy kattintson a Kitöltés a teljes szélességben gombra. A blokkot az oldalon húzással és átméretezéssel is módosíthatja.
A Méret és helyzet tetején lévő sáv megmutatja, melyik elrendezést szerkeszti. Amíg a blokk a nagyobb méretet követi, az Örökölt felirat látszik, amint pedig a blokknak saját beállításai vannak, megjelenik a Visszaállítás gomb. A Visszaállítás gombra kattintva a blokk ismét a nagyobb méretet követi. Az Ez az elrendezés legyen minden képernyőn gombbal a jelenlegi elrendezést minden méretre átmásolhatja.
A felső sáv azt is megszámolja, hány blokk tér el az asztali elrendezéstől, például 1 blokk eltér mobilon. A számra kattintva az ilyen blokkok között lépkedhet.
Blokk megtartása ugyanúgy minden képernyőn
A Méret és helyzet csoportban kapcsolja be a Minden képernyőn azonos beállítást, ha a blokknak minden méretben ugyanaz az elrendezése legyen. A táblagépre vagy telefonra vonatkozó beállításai törlődnek, a későbbi módosítások pedig egyszerre érvényesülnek minden méretre.
Megjegyzés: Ha egy blokkot másik szakaszba húz, az minden képernyőméreten megváltozik, ezért a Payly ezt csak az Asztali nézetben engedi. Ha egy blokkot telefonon másképp szeretne elhelyezni, adja hozzá mindkét szakaszhoz, és méretenként rejtse el azt, amelyre nincs szüksége.
Az eredmény ellenőrzése
Az Előnézet segítségével végigkattinthat az oldalakon telefon és táblagép szélességben, a közzétett webáruházat pedig valódi telefonon is megnézheti, mielőtt bejelentené. Lásd: Webhely előnézete közzététel előtt.