W WordPress mamy widżety - w Joomla moduły. Zarządzania modułami w Joomla w standardzie jest dużo łatwiejszej i przyjemniejsze niż w WordPress. Gantry 5 pozwala trochę zniwelować te różnice, ale nie do końca. W tym tutorialu pokaże jak dodawać pozycję widżetu do layotu strony www Lublin na WordPress i Gantry 5.

1. Dodawanie widżetu standardowo w WordPress wygląda tak. Logujemy się do Kokpitu i przechodzimy do zakładki Wygląd >>> Widgety

Gantry5, WordPress, widżet

 

2. Mamy tu listę dostępnych widżetów i w tym momencie jedną pozycję "sidebar" w której możemy te widżety umieścić. Słabością tego rozwiązania jest brak możliwości przypisania widżetu do konkretnej pozycji menu. W Joomla jest to rozwiązane dużo lepiej - nawet przy bardzo złożonych projektach strony internetowe Lublin są przejrzyste.

Pozycje "Sidebar" jest jedyną do jakiej możemy przeciągnąć widżety. Dodajmy więc kolejną ...

Gantry5, WordPress, widżet

 

3. Przechodzimy do Helium Theme - i dalej do zakładki "Layouts"

Poprzednio stworzyłem na bazie "Base Outline" nowy Outline / layout - Testowy, Teraz dodam w nim nową pozycję widżetu w sekcji "Header"

UWAGA: bo zobaczyłem za późno w pozycji header w innym outline / layoucie jest banner który w tym motywie wchodzi pod menu więc jeśli planujecie pokaz slajdów to jest to dla niego właściwa pozycja. To jednak co zrobimy poniżej w niczemu nie zaszkodzi - możemy ten layout przypisać do pozycji menu w których bannera nie będzie. lub dodać banner w tej samej sekcji ale powyżej.

Gantry5, WordPress, widżet

 

4. Jak widać sekcja "Header" dziedziczy ustawienia z "Base Outline" - tak jak i cały layout "Testowy". O funkcji Inherit - dziedziczenie pisałem we wcześniejszym tutorialu.

Żeby coś zmienić w sekcji "header"musimy ją usamodzielnić - klikamy ikonkę zębatki - Section Settings

Gantry5, WordPress, widżet

 

5. Pojawia się pop-up z informacją że ta sekcja dziedziczy ustawienia z "Base Outline". Przejdźmy do zakładki Inheritance.

Gantry5, WordPress, widżet

 

6. W zakładce Inheritance możemy zmienić źródło dziedziczenia ustawień - w tej chwili dziedziczy ta sekcja z "Base Outline"  Ale po kolei

Mode - mamy 2 opcje

- Clone - pozwala sklonować ustawienia z wybranego Outline

- Inherit - dziedziczy ustawienia z wybranego Outline

Outline - tu wybieamy Outline / Layout z którego chcemy sklonować lub dziedziczyć ustawienia

Replace - tu możemy zdecydować co dziedziczmy / konujemy

Section Attributes - atrybuty - style sekcji, proporcje

Particle within Section - Particle / cząstki - widżety umieszczone w sekcji

 

Gantry5, WordPress, widżet

 

7. Ponieważ musimy usamodzielnić sekcję żeby coś w niej robić zaznaczamy opcję Clone i klikam button Apply and Save

Gantry5, WordPress, widżet

 

8. Sekcja "Header" została odblokowana i widzimy napisa "Drop particle here..." Możemy przeciągać particles do sekcji.

Gantry5, WordPress, widżet

 

9. W Gantry 5 umieszczamy Particles / Cząstki w Layout na zasadzie przeciągania

Gantry5, WordPress, widżet

 

 10. Particle - Widget Position przeciągnięta do sekcji Header - w kilku miejscach pulsują małe kółeczka przypominające że trzeba zapisać layout buttona "Save Layout" ale wcześniej musimy nadać tej particle / cząstce nazwę systemową. Klikamy w tym celu w małą zębatkę po prawej stronie cząstki - Widget Position

Gantry5, WordPress, widżet

 

 11. Pojawia się pop-up w którym musimy edytować

- nazwę pozycji

- Position Id

możemy wstawić tu co chcemy - ale ponieważ jesteśmy w sekcji header i firma która stworzyła ten framework tak sugeruje, a przede wszystkim dlatego żeby było intuicyjnie nazwy powinny zawierać nazwę sekcji w której jest ta parcticle / cząstka.

Gantry5, WordPress, widżet

 

12. Tytuł wpisu edytujemy klikając na ikonkę pisaka. Wpisując nazwę Position Id - przekonacie się że framework podpowiada nazwę systemową. Klikam button "Apply and Save" żeby zapisać zmiany i zamknąć pop-up

Gantry5, WordPress, widżet

 

13. Jak widać w sekcji Header mamy nową particle / cząstkę o nazwie Header A i Position Id - header-a

Gantry5, WordPress, widżet

 

 14. Przechodzę do Wygląd >>> Widgety - jak widać pojawiła się tu nowa pozycja dla widżetów - możemy tu dodawać - przeciągając je widżety systemowe WordPress dla strony www Lublin.

OK ale jesteśmy dopiero na początku zabawy z Layout Gantry 5 bo ma on bardzo duże możliwości a to nawet nie jest ABECadło

Gantry5, WordPress, widżet

 

Zobacz inne części tutorialu o Gantry 5 dla Wordpress 

 

 

WordPress i framework Gantry 5 dla strony internetowe Lublin cz1

Zakładka styles framework Gantry 5 - WordPress dla strony internetowe Lublin cz2

Zakładka Layout framework Gantry 5 - WordPress dla strony www Lublin cz3

Funkcja Inheriting we frameworku Gantry 5 dla WordPress cz4 - strony www Lublin

Outlines w Gantry 5 - tworzenie kopii motywu frameworku Gantry 5 - WordPress dla strony www Lublin cz5

Dodawanie pozycji widżetu do layoutu we frameworku Gantry 5 dla WordPress - strony www Lublin cz6

Dodawanie pozycji widżetu do layoutu we frameworku Gantry 5 dla WordPress - strony www Lublin cz7

Jak zmieniać szerokość pozycji widgetu w layout frameworka Gantry 5 dla WordPress - strony www Lublin cz8

Page Content - pozycja wpisów - w layout frameworka Gantry 5 dla WordPress - strony www Lublin cz9

Blog - popularne

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 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 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 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 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

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

Przezroczystość w plikach PNG - jak zapisać plik z PNG z przezroczystością w Adobe Photoshop dla...

Format .png to drugi w kolejności po .jpg format plików graficznych wykorzystywany w czasie tworzenia stron internetowych. Oczywiście większość użytkowników internetu najbardziej kojarzy .jpg bo w...
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

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