Share This

Gantry 5 rozwija się ale ciągle w szablonach brak niektórych rozwiązań - np liczyłem że tworzenie w layout pozycji typu Full Width będzie bardzo proste, bez zabawy z kodem. W tej chwili sądząc po podpowiedziach moderatorów na forum RT takiej możliwości nie ma. Ale jest to i tak proste.

Tak dla wyjaśnienia w Gantry 4 w ostatnim roku przed Gantry 5 zaczęły pojawiać się sekcje które miały szerokość całego ekranu. Nie można było ich dzielić na części.

 

W Gantry 5 jest już lepiej, możliwe jest poszerzenie sekcji szablonu do pełnego ekranu nawet jeśli jest ona podzielona na kilka pozycji modułów.

Na przykładzie nowego szablonu RocketTheme - Requiem pokaże jak zmienić sekcję szablonu o standardowej szerokości na pełnoekranową - Full Width (takie nazewnictwo pojawiło się w szablonach Gantry 4)

1. Zajmiemy się sekcją która zaznaczyłem na czerwono - najpierw wypada sprawdzić jak się ona nazywa. Można to zrobić na kilka sposobów
- w zakładce moduły zaplecza joomla szukamy modułu który zaznaczyłem i sprawdzamy jaką ma pozycję - w Gantry 4 pozycję modułów miały nazwy od nazwy sekcji czyli np utility-a, utility-b, utility-c ....  W Gantry 5 możemy zmieniać z zakładce Layout nazwy pozycji jak chcemy więc jeśli są niestandardowe pomysł nie jest najlepszy

- Jeśli wiemy w jakiej pozycji jest moduł możemy sprawdzić nazwę sekcji w zakładce Layout szablonu

 

responsywne strony www Lublin na joomla

 

 

2. - lub skorzystajmy z Firebuga

responsywne strony www Lublin na joomla

 

 

3. Moduł podświetla się na niebiesko

 

responsywne strony www Lublin na joomla

 

 

4. Moduł podświetla się na niebiesko kiedy najeżdżamy na niego w firebugu

Jedziemy do góry i widzimy że moduł znajduje się w sekcji g-utility część środkowa w każdej sekcji nazywa się g-constainer i to ją chcemy poszerzyć do pełnoekranowej

responsywne strony www Lublin na joomla

 

5. Tu widać podświetloną część którą chcę poszerzyć

responsywne strony www Lublin na joomla

 

 6. Zanim dokonamy zmian w kodzie trzeba zmienić ustawienia w zakładce Layout szablonu. Odnajdujemy sekcję w szablonie przypisanym do pozycji menu która nas interesuje. Klikamy ikonkę ustawień -zębatka. 

responsywne strony www Lublin na joomla

 

 

7. Wyskakuje pop-up i tu zmieniamy ustawienie na Fullwidth. Wcześniej opisując zakładkę Layout i to ustawienie pisałem że ono nie działa lub działa specyficznie. Zmienia się wygląd sekcji - rozciąga się tylko tło a nie część środkowa sekcji - constainer

responsywne strony www Lublin na joomla

 

8. Wracamy do strony i używając Firebuga odnajdujemy sekcję. Spróbujmy zmienić jej ustawienia.
#g-utility to cała sekcja która rozciąga się na całą szerokość ekranu - moduły, tekst, obrazki zajmują jej część środkową

responsywne strony www Lublin na joomla

 

 

Ponieważ interesuje nas część środkowa musimy zastosować taki zapis

#g-utility .g-container {
    width: 100%;
}

responsywne strony www Lublin na joomla

 

 

 

Wstawiamy ten kod do pliku custom.scss

plik custom.scss  umieszczamy lokalizacji  /templates/nasz_szablon/custom/scss/custom.scss

Teraz w naszym szablonie w zakładce style klikamy w button "Recompile CSS"

Działa. Dla każdej sekcji dla którą chcemy zmienić na pełnoekranową trzeba to powtórzyć zmieniając w kodzie nazwę sekcji.

 

II SPOSÓB

Można też zrobić inaczej tworzymy nowy styl dla .g-constainer   nazywamy go np .fullwidth i dodajemy do pliku custom.scss

taki kod:

.fullwidth .g-container {
    width: 100%;
}

plik custom.scss  umieszczamy lokalizacji  /templates/nasz_szablon/custom/scss/custom.scss

Teraz w naszym szablonie w zakładce style klikamy w button "Recompile CSS"

 

W zakładce Layout szablonu w konkretnej sekcji strony www Lublin dodajemy nasz styl w taki sposób. Klikamy na ustawienia sekcji - ikonka zębatki

responsywne strony www Lublin na joomla

 

i w pop-up'ie dodajemy styl dodany wcześniej do pliku custom.scss  Ten styl możemy stosować do wszystkich sekcji Gantry 5

responsywne strony www Lublin na joomla

 

Przydało się? - Udostępnij

Blog - popularne

Akeeba Kickstart - czyli jak przywrócić stronę internetową Joomla 3 z kopii zapasowej Akeeba Backup

Przenosimy stronę na CMS joomla na inny serwer. Mając wykonaną za pomocą Akeeba Backup kopię strony www możemy ją przenieść w krótkim czasie na dowolny serwer. Czas wysyłania na serwer rozpakowanych...
Czytaj dalej

Jak dodać firmę do Google Maps

Tworząc firmową stronę internetową prawie zawsze umieszczamy na niej mapę z lokalizacją firmy. Czasy statycznych map graficznych minęły dawno temu. Teraz najczęściej szukamy firm na google które ma...
Czytaj dalej

Jak zrobić banner slideshow w joomla 3 - dodatek Roksprocket dla strony www na joomla

Roksprocket dla Joomla czyli jak zrobić banner dla naszej strony internetowej na joomla. Roksprocket do moduł którego wersja występuje także dla wordpressa. Można za jego pomocą wykonać nie tylko...
Czytaj dalej

Jak wykonać przekierowanie DNS domeny zarejestrowanej na home.pl na serwer nazwa.pl - na którym...

Przekierowanie DNS wykonujemy kiedy domenę zarejestrowaliśmy w jednej firmie, a hosting dla naszej strony internetowej wykupiliśmy w innej. Dzisiaj pokażę jak przekierować domenę zarejestrowaną na...
Czytaj dalej

WordPress - jak wykonać kopię zapasową strony www na WordPress za pomocą Akeeba Backup

WordPress podobno nie sprawia problemów, ale dmuchając na zimne - kopię strony www należy wykonać jeśli zależy nam na bezpieczeństwie naszych danych. Akeeba Backup to narzędzie które powstało jako...
Czytaj dalej

Jak dodać film z youtube stronę www na joomla - dodatek AllVideos od Joomla Works

Niezbyt często korzystam w wykonywanych stronach www z możliwości osadzania w nich wideo. Jeśli klienci mają przygotowane materiały wideo warto je wykorzystać nie tylko z powodu lepszego zapoznania...
Czytaj dalej

Specified key was too long; max key length is 767 bytes - błąd podczas przywracania strony za...

Klient poprosił mnie o zwiększenie wersji PHP do najnowszej wersj PHP 7.2. Przy stronach firmowych najczęściej nie wykonuję takich operacji z automatu tylko staram się na początek sprawdzić czy jest...
Czytaj dalej

Akeeba Backup - jak wykonać kopię strony www na CMS Joomla 3

Akeeba Backup pozwala na tworzenie kopii na wszystkich wersjach joomla - tu w wersji dla Joomla 3 Mając stronę internetową utrzymywaną na dobrym hostingu nie musimy martwić się o wykonywanie kopii...
Czytaj dalej

Zarządzanie użytkownikami w Joomla 3. Jak zmienić nazwę użytkownika, hasło, mail w zaleczu joomla

Edycja profilu użytkownika, zmiana hasła do zaplecza joomla czy maila konkretnego użytkownika w joomla 3 są bardzo proste - oczywiście jeśli mamy dostęp do zaplecza naszej strony www Lublin na...
Czytaj dalej