Haluaisitko jonkin moduulin tms. näkyvän tai olla näkymättä, jossain laitteessa? Tai päin vastoin. Joskus on järkevää asettaa esimerkiksi moduuli piilotetuksi mobiilissa, mutta näkyväksi muissa laitteissa. Miltä kuulostaa?
Tämä on Gantryn käyttäjille helppoa, kun tietää miten se tehdään. Noudata alla olevia ohjeita, niin huomaat kuinka helppoa se on Gantryn käyttäjille. Valitse vain laite ja anna luokka sivupohjan hallinnassa ko. partikkelin kohdalla.
Visible tarkoittaa näkyy ja Hidden ei näy. Class tarkoittaa taas css-tyylitiedoston luokkaa, jotka ovat valmiina käytettäväksi ilman sen kummempaa koodausta. Jos haluat, että näkyy kaikissa laitteissa, älä lisää mitään luokkaa. That's it!
| Class | Puhelin | Tabletti | Pöytäkone | Iso pöytäkone |
|---|---|---|---|---|
visible-phone |
Visible | Hidden | Hidden | Hidden |
visible-tablet |
Hidden | Visible | Hidden | Hidden |
visible-desktop |
Hidden | Hidden | Visible | Visible |
visible-large |
Hidden | Hidden | Hidden | Visible |
hidden-phone |
Hidden | Visible | Visible | Visible |
hidden-tablet |
Visible | Hidden | Visible | Visible |
hidden-desktop |
Visible | Visible | Hidden | Hidden |
hidden-large |
Visible | Visible | Visible | Hidden |
Oman sivupohjasi laitteiden näytön mitat löydät aina sivupohjan Styles-taulun alaosasta. Esimerkiksi tällä sivustolla on käytössä eri laitteilla alla olevan kuvan mukaiset mitat rem-mittoina. Yksi rem on 16 pikseliä. Mistä tuo 16 pikseliä tulee, on taas toinen juttu. Toki varmaan tiedät sen.
Mitat isolle näytölle, näytölle, tabletille ja puhelimelle. Lisäksi on mitta, milloin valikko muuttuu mobiilivalikoksi.
Sivupohjan Layout-taulussa haluttu luokka lisätään Block-välilehdellä. Esimerkiksi tällä sivustolla etusivun vaihtuva kuva -moduuli ei näy mobiilissa. Näin hidden-phone -luokka on lisätty ko. partikkelin asetuksissa:
Moduulin (partikkelin) asetukset kun tietty partikkeli halutaan pimentoon puhelimessa.