Łatwo jest dodać logo swojej witryny do dowolnej stopki wykonanej za pomocą Divi Buildera. Jeśli jednak wyświetlasz go tylko jako obraz, musisz edytować stopkę za każdym razem, gdy zmieniasz logo. Rozwiązaniem jest użycie dynamicznego logo. Dynamiczne logo zmienia się automatycznie, aby dopasować logo witryny. W tym artykule zobaczymy, jak dodać dynamiczne logo do stopki Divi.

Zaczynajmy.

1. Utwórz Nowy Szablon Stopki

Przejdź do Divi Theme Builder i Dodaj nową globalną lub niestandardową stopkę

Nie ma żadnej różnicy, jeśli zbudujesz stopkę od podstaw lub pobierzesz jeden z darmowych szablonów dla tego samouczka. Musisz tylko upewnić się, że dołączono moduł obrazu. Użyjemy tego modułu obrazu, aby połączyć się z dynamicznym logo.

Pobierz szablon stopki

Dla moich przykładów używam Darmowa stopka dla Divi ‘ S Immigration Lawyer Layout Pack. Elegant Themes Blog zawiera wiele darmowych szablonów stopki. Znajdź je na blogu, wpisując “darmowy nagłówek i stopka” w polu wyszukiwania bloga. Pobierz szablon na swój komputer i rozpakuj plik. Musisz przesłać plik JSON, a nie spakowany plik.

Prześlij szablon stopki

Upload the Footer Template

W tym samouczku użyjemy Kreatora motywów Divi, aby zastosować stopkę do każdej strony i posta. Możesz przesłać szablon do Kreatora motywów lub użyć szablonu z biblioteki Divi. Aby przesłać do Kreatora motywów, przejdź do Kreatora motywów Divi w menu Divi i wybierz opcję przenośności w prawym górnym rogu. Jest to ikona ze strzałkami w górę iw dół.

Upload the Footer Template

Następnie zobaczysz modal z kilkoma opcjami. Wybierz kartę Import w Modale. Przejdź do pliku JSON i wybierz go z komputera. Wybierz jedną z opcji, które chcesz. Zostawiam to w domyślnych opcjach. Następnie wybierz przycisk Importuj. Poczekaj na zakończenie importu.

Upload the Footer Template

Następnie usuń plik nagłówka, jeśli nie chcesz go używać, i kliknij, aby zapisać zmiany. Masz teraz globalną stopkę. Jeśli użyłeś szablonu, którego użyłem, będziesz miał już statyczne logo. Musimy nadać mu dynamikę. Jeśli szablon nie zawiera logo, po prostu dodaj moduł obrazu.

Upload the Footer Template

Następnie kliknij ikonę Edytuj w stopce, aby otworzyć szablon.

Alternatywna metoda: ładowanie z biblioteki Divi

Alternate Method: Loading from the Divi Library

Alternately, you can upload the layout to your Divi Library. Następnie w Kreatorze motywów Divi możesz kliknąć, aby dodać globalną stopkę i wybrać ją z biblioteki.

Alternate Method: Loading from the Divi Library

Gdy klikniesz, aby dodać globalną stopkę, możesz utworzyć globalną stopkę od zera lub wybrać ją z biblioteki.

Add a Logo

Jeśli używany szablon nie zawiera logo, Dodaj moduł obrazu, w którym ma się pojawić logo. Pozostaw otwarte w Lightbox wyłączonym (jest to ustawienie domyślne). W przypadku adresu URL możesz zostawić go pustego lub dodać adres URL strony głównej, aby można go było kliknąć.

  • Otwórz w Lightbox = No
  • Image Link URL = pozostaw pusty lub dodaj adres URL strony głównej

Add a Logo

Otwórz kartę Projekt. W obszarze odstępy pozostaw włączoną opcję Pokaż spację pod obrazem (jest to ustawienie domyślne). Pod marginesem dodaj 50px do dolnego marginesu.

  • Pokaż miejsce pod obrazkiem = tak
  • Margin-Bottom = 50px

Dynamiczne Ustawienia Obrazu

Dynamic Image Settings

Układ, którego używam, zawiera już obraz logo, więc dostosuję ten moduł obrazu. Jest skonfigurowany z tymi samymi ustawieniami, które widzieliśmy w poprzedniej sekcji.

Dynamic Image Settings

Najpierw musimy usunąć obraz, który już ma. Najedź kursorem na obraz i kliknij ikonę kosza, gdy się pojawi. Ikona resetowania po prawej stronie również będzie działać.

Dynamic Image Settings

Teraz, po najechaniu kursorem na obszar obrazu, zobaczysz ikonę, aby wybrać zawartość dynamiczną. Wybierz tę ikonę.

Dynamic Image Settings

Pojawi się modal z wieloma opcjami, które odnoszą się do treści. Wybierz trzecią opcję z góry: Logo witryny.

Dynamic Image Settings

Logo Twojej witryny zostanie następnie wyświetlone w module obrazu. To takie proste.

3. Zapisz wszystkie zmiany w Kreatorze szablonów i motywów

Po zastąpieniu logo dynamicznym logo musisz zapisać zmiany, aby mogły one obowiązywać w całej witrynie.

Save All Template and Theme Builder Changes

Kliknij przycisk Zapisz w menu Visual Builder, a następnie kliknij X w prawym górnym rogu, aby exit budowniczy. TERAZ Każde logo ustawione jako logo witryny w opcjach motywu Divi zostanie automatycznie wyświetlone w tym module obrazu.

Oto jak dynamiczne logo wygląda na ekranach komputerów stacjonarnych i mobilnych. Musiałem tylko zmienić logo na ekranie ustawień motywu Divi.

Pulpit

Desktop

Oto jak dynamiczne logo wygląda na pulpicie. Logo w stopce pasuje do logo w nagłówku.

Mobile

Mobile

Oto jak dynamiczne logo wygląda na telefonie komórkowym.

Zmiana Logo strony

Changing the Site’s Logo

Aby użyć innego logo w stopce, po prostu zmień logo witryny. Przejdź do opcji motywu Divi w menu Divi. Kliknij przycisk Prześlij, aby wybrać nowe logo i zapisać zmiany. Nowe logo witryny zmieni się, a logo stopki będzie do niego pasować.

  • Divi > opcje motywu > zakładka Ogólne > Logo
  • Prześlij nowe logo

Zakończenie Myśli

Oto nasze spojrzenie na to, jak dodać dynamiczne logo do stopki Divi. Bez dynamicznego logo musiałbyś ręcznie zmienić logo stopki, jeśli chcesz, aby pasowało do logo witryny. Dynamiczne logo automatycznie dopasowuje się do logo strony. Możemy zmienić logo w jednym miejscu i jest ono automatycznie stosowane do stopki każdej strony lub postu, który używa dynamicznego logo.

Chcemy usłyszeć od ciebie. Czy używasz dynamicznych logo w stopkach Divi? Daj nam znać o tym w komentarzach poniżej.

Źródło

You May Also Like

Włoska restauracja bez pizzy – niemożliwe? A jednak!

W artykule: La dolce vita po warszawskuProsto z WłochLokalność, sezonowość, nietuzinkowośćSlow Italia…

Jak obliczyć ratę kredytu hipotecznego?

W artykule: Rata kredytu hipotecznego – co się na nią składa?Od czego…

Motorola 5G wyświetlacz — jak wybrać nowy wyświetlacz do telefonu?

W artykule: Motorola 5G wyświetlacz – dlaczego warto kupować profesjonalne komponenty dla…

Etui na słuchawki Airpods 3 – wszystko, co warto o tym wiedzieć

W artykule: Jakie funkcje może spełniać etui na słuchawki Airpods 3?Jakie powinno…