baner

Praktyczne wykorzystanie klas o których wspominałem w części pierwszej wygląda następująco:


Ukrywanie modułów w szablonie Joomla 3

Posiadamy moduł, który chcemy ukryć na urządzeniu mobilnym lub tablecie. Jest on po prostu za duży i psuje nam wygląd strony. W tym celu otwieramy dany moduł i przechodzimy na zakładkę wzbogacone, tam szukamy pola Przyrostek klas CSS modułu w to pole wpisujemy hide_mobile, co oznacza że dany moduł będzie ukryty na urządzeniach mobilnych, jeśli dopiszemy tutaj hide_small_tablet to także na małych tabletach moduł się nie ukaże. Oczywiście możemy dopisać też  hide_large_tablet i wtedy moduł nie ukaże się także na dużych tabletach np. 10 cali.

01 hide mobile

 

Teraz wiemy jak ukrywać moduły na tabletach, ale co zrobić jeśli na tablecie chcemy aby w zastępstwie pojawił się inny moduł. Postępujemy tak, tworzymy zastępczy moduł i wpisujemy: hide_wide_screen, hide_standard_screen – to oznacza, że dany moduł ukryjemy na standardowych monitorach oraz monitorach panoramicznych, zaś moduł pokaże się na urządzeniach mobilnych jak telefon i dwa rodzaje tabletów. Można też zakombinować odwrotnie.
Wiemy już jak dany moduł ukryć na urządzeniach mobilnych i pokazać go na ekranach komputerów, oraz jak pokazać zastępczy moduł.

 


Ukrycie fragmentu testu na urządzeniach mobilnych

Podobnie możemy zrobić z fragmentem tekstu, ale to już będzie trochę trudniejsze ponieważ musimy edytować kod danego tekstu, czyli musimy przełączyć edytor tekstowy do trybu edycji kodu.

01 hide mobile 2

Ja najczęściej używam edytora Rokpad, tak on wygląda jak na obrazku powyżej. Składania jest kolorowana, dzięki czemu łatwiej jest odnaleźć potrzebny fragment.

Na obrazku poniżej pokazuję co zmienimy w tekście. Kolorem żółtym zaznaczyłem tekst, który chce ukryć na telefonie.

01 hide mobile 3Natomiast w czerwonej ramce zaznaczyłem co musimy dopisać. a więc na poczatku tego tekstu piszemy spam , rozpoczynając nawiasem ostrym, następnie wpisujemy słowo class czyli nadajemy klasę i w cudzysłowi wartość, w naszym przypadku hide_mobile zamykamy cudzysłów i nawias, na końcu zamykamy dany fragment tekstu.

Jeśli będziemy chceili ukryć dany fragment tekstu na tablecie dopisujemy w cudzysłowie kolejny klasy, np hide_small_tablet. W przypadku chęci wstawienia alternatywnego tekstu postępujemy z klasami podobnie jak w przypadku modułów, a więc tworzymy alterantywny tekst w tym samym artykule i określamy go jako ukryty na ekranie komputera.

W następnej części zajmiemy się zdjęciami.


Ebook Joomla 3

ebook 2 okladka

Tutaj jest drugie wydanie ebooka o Joomla 3, dopisane jest kilka rozdziałów, jest ponad 270 stron