Jak dodać logo obrazu nagłówka dla motywu Genesis Child 2024

Ujawnienie: Niektóre linki na tej stronie są linkami partnerskimi, co oznacza, że ​​jeśli klikniesz na jeden z linków i kupisz przedmiot, mogę otrzymać prowizję. Jednak wszystkie opinie są moje.

Genesis Framework to popularny motyw WordPress, który został wykorzystany do stworzenia jednych z najpiękniejszych i najbardziej kreatywnych stron internetowych w Internecie. Jest to jeden z naszych ulubionych blogów dla przedsiębiorców, ponieważ jest tak wszechstronny, łatwy w użyciu i konfigurowalny.

Jedną z rzeczy, które wielu ludziom sprawia trudność w motywach Genesis, jest dodanie logo obrazu w nagłówku. Na szczęście za pomocą kilku kliknięć możesz mieć własne niestandardowe logo.

Jest to przydatne, jeśli chcesz, aby Twoja witryna miała określoną markę pasującą do Twojej firmy. Proces dodawania tego zajmuje mniej niż 10 minut i wymaga użycia tylko jednej wtyczki, która nazywa się Custom Logo Uploader firmy WPSquare.

Można go zainstalować w kilka sekund za pomocą jednego kliknięcia w panelu administracyjnym WordPress.  

Oto kroki:

1) Zainstaluj wtyczkę

2) Dodaj żądane obrazy

3) Skonfiguruj ustawienia

4) Zapisz zmiany 5-10 minut później, wróć do Genesis Child Theme Settings > Header Image

6) Wybierz niestandardowe logo

7) Wprowadź żądany adres URL

8) Zapisz zmiany.

Jak dodać logo obrazu nagłówka dla motywu Genesis Child-

KROK 1: Skonfiguruj logo w panelu

Ponieważ używam „Dwadzieścia dziesięć motywów potomnych„, wystarczy przejść do Pulpit >> Wygląd >> Dostosuj >> Nagłówek i dodać logo, którego chcę użyć. Możesz dodać własne niestandardowe obrazy lub wybrać spośród dostępnych w WordPress, które znajdziesz w sekcji „Dodaj nowy”.

Dwadzieścia dziesięć motywów potomnych

W moim przypadku zamierzam dodać obraz z Dashboard Media Folder, klikając plik o nazwie „header-logo.png”.

KROK 2: Dodaj niestandardowy kod do funkcji motywu potomnego Genesis.

php Otwórz plik php funkcji motywu Genesis Child, który zwykle znajduje się w głównym folderze motywu o nazwie functions.php . Możesz otworzyć ten plik za pomocą dowolnego klienta FTP lub SFTP, takiego jak Filezilla .

Jak dodać logo obrazu nagłówka do motywu potomnego Genesis - FileZilla

A jeśli nie możesz znaleźć tego pliku, możesz go utworzyć. Napisałem post, aby pokazać, jak utworzyć plik php funkcji motywu potomnego Genesis.

Oto kod, który dodałem na końcu mojego pliku functions.php, ale przed zamknięciem tagu PHP?>

// Logo nagłówka BP

add_custom_image_header( 'bp-logo' );

To mówi Genesis, aby użył obrazu o nazwie „bp-logo” jako logo nagłówka mojej witryny. Możesz zmienić tę nazwę, ale nie zapomnij zmienić jej również w następnym kroku. Teraz utwórz nowy folder o nazwie bp-logo .

Musi zostać utworzony w głównym katalogu motywu. Aby uzyskać więcej informacji, sprawdź mój post na temat tworzenia folderu w motywie potomnym Genesis.

KROK 3: Utwórz obraz logo dla motywu strony trzeciej

Problem polega na tym, że nasz obraz logo nie pojawi się w sekcji dostosowywania pulpitu WordPress, ale nadal będzie wyświetlany w interfejsie użytkownika po opublikowaniu witryny w Internecie.

Oznacza to, że musimy dodać ten obrazek do pliku header.php naszego motywu. Na szczęście możemy to zrobić, edytując nasze motyw bezpośrednio z panelu administracyjnego WordPress.

Potrzebujesz pliku zip motywu i klienta FTP lub SFTP fileZilla . Możesz użyć phpMyAdmin także jeśli wiesz, jak z niego korzystać.

Jak dodać logo obrazu nagłówka do motywu potomnego Genesis - phpMyAdmin

Otwórz archiwum zip za pomocą swojego ulubionego programu i przejdź do /wp-content/themes/TWOJA NAZWA TEMATU/header.php . Skopiuj kod, który widzisz w tym pliku, ale przed tagiem zamykającym PHP ?> .

 

Oto przykład mojego pliku header.php z dodanym niestandardowym kodem:

” tytuł =” ” rel=”dom”> ” alt=” ” tytuł =” ”/>

KROK 4: Dodaj niestandardowy kod do nagłówka Genesis Child Theme.

php Teraz otwórz plik header.php motywu (który znajduje się w /wp-content/themes/NAZWA TWOJEGO motywu/ ) i dodaj ten kod przed zamknięciem tagu PHP (który znajduje się na końcu pliku):

KROK 2: Gotowe Teraz, jeśli odwiedzisz swoją witrynę, logo pojawi się w interfejsie użytkownika.

Ale jest problem z tym kodem. Tworzy plik obrazu na twoim serwerze i jeśli prześlesz dużo obrazów, niepotrzebnie zajmie miejsce na serwerze.

Aby rozwiązać ten problem, użyłem mojej wtyczki o nazwie „Genesis Simple Hooks”. A oto zaktualizowany niestandardowy kod, który dodałem w pliku functions.php: add_action( 'genesis_before_header', 'bp_add_header_logo' );

 

function bp_add_header_logo() { if ( !is_page() || isnull( get_post_meta( get_the_ID(), 'bp-logo', true ) ) ): ?> ” tytuł =” ” rel=”dom”> ” alt=” ” tytuł =” ”/>

 Korzystanie z wtyczki WordPress (Proste nagłówki Genesis)

WordPress to świetny CMS (system zarządzania treścią) i może być używany do tworzenia różnego rodzaju stron internetowych. Ma obszerną kolekcję dostępnych wtyczek, co czyni go jeszcze potężniejszym.

Wtyczka Genesis Simple Headers umożliwia dodawanie niestandardowych nagłówków do witryny WordPress. Możesz przesłać własny obraz nagłówka lub wybrać spośród domyślnych opcji dostępnych we wtyczce, takich jak obrazy dostarczone przez motyw WordPress.

Jeśli nagłówek Twojego bloga nie wyświetla się poprawnie w Twoim blogu, najpierw napraw ten problem, wykonując następujące czynności:

Sprawdź, czy przesłałeś obraz do odpowiedniego folderu (wybierz z /wp-content/uploads/yourimage.jpg). Jeśli nie możesz go tam znaleźć, sprawdź ponownie, czy Twój obraz ma odpowiednie wymiary. Następnie możesz przesłać go do odpowiedniego folderu za pomocą oprogramowania FTP.

Sprawdź, czy obraz nie jest uszkodzony (spróbuj otworzyć go w programie do edycji obrazów). Jeśli tak, usuń ten plik i prześlij nowy, aby sprawdzić, czy problem nadal występuje.

Możesz spróbować utworzyć kolejny obraz nagłówka, przechodząc do Wygląd – Genesis Simple Headers – Dodaj nowy obraz.

Możesz także spróbować użyć domyślnego obrazu dołączonego do motywu WordPress, przechodząc do Wygląd – Edytuj proste obrazy nagłówka Genesis, a następnie wybierz jeden z nich lub po prostu prześlij obraz z Internetu.

Jeśli to nadal nie działa, prosimy o kontakt [email chroniony] aby uzyskać dalszą pomoc.

Jeśli chcesz dowiedzieć się, jak korzystać z tej wtyczki, czytaj dalej…

Ten artykuł jest przeznaczony wyłącznie dla początkujących i pomoże im zrozumieć podstawy korzystania z tej wtyczki WordPress. Zakłada, że ​​użytkownik zainstalował już na swojej stronie wtyczkę Genesis Simple Headers i zna podstawy korzystania z WordPress Dashboard.

Podstawowe kroki dodawania niestandardowych nagłówków do bloga WordPress

1) Przejdź do pulpitu nawigacyjnego swojego bloga WordPress i najedź na Wygląd. Wybierz Menu z tego miejsca.

2) Kliknij nagłówek nr 1 w menu rozwijanym Genesis Simple Headers. Otworzy się nowa strona z wieloma opcjami. Możesz zmienić dowolną z dostępnych tam opcji.

3) Pierwsza opcja to Obraz nagłówka. Kliknij przycisk przeglądania i wybierz obraz z komputera lub użyj jednego z domyślnych obrazów dostępnych w tej sekcji.

Upewnij się, że masz pozwolenie na użycie tego obrazu, ponieważ będzie on wyświetlany jako część Twojego treść bloga i pojawi się również w wynikach wyszukiwania. Możesz użyć tego samego obrazu dla wszystkich trzech obrazów nagłówka, jeśli chcesz. Możesz także zmienić tekst wyświetlany w tej sekcji.

4) Drugie menu rozwijane to Typ nagłówka. Wtyczka udostępnia 5 typów i możesz wybrać dowolny z nich. Jednak zmiana typu na H1 pomoże ci w dalszej stylizacji jako nagłówka H1.

5) Trzecie menu rozwijane to Pozycjonowanie i możesz go użyć do zmiany pozycji nagłówka obraz na Twoim blogu (lewy, środkowy lub prawy).

6) W czwartym menu rozwijanym możesz wybrać, która sekcja postów ma być wyświetlana w tym nagłówku. Masz 3 sekcje – Genesis Featured Image, Intro Text i Post Title. Jeśli chcesz wyświetlić coś innego, możesz wpisać ten kod HTML w odpowiedniej sekcji i tam się pojawi.

7) Kliknij Zapisz Menu po dokonaniu wszystkich zmian.

8) Nowy obraz nagłówka zostanie natychmiast wyświetlony na Twoim blogu, a za każdym razem, gdy odwiedzający otworzy którykolwiek z Twoich postów na blogu, ten obraz nagłówka pojawi się na górze. Możesz jednak zmienić jego pozycję na prawą lub lewą, przechodząc do Wygląd - Dostosuj - Nawigacja boczna, a następnie wybierając prawo lub lewo.

 Edycja pliku Style.css z Genesis Child Theme-

Natknąłem się na motyw potomny Genesis o nazwie [i]Element[/i] w oficjalnym katalogu motywów WordPress i chciałem go użyć w moim lokalnym środowisku programistycznym.

Pierwszy i drugi post na tej stronie zawierają wskazówki, jak ustawić nowy motyw potomny Genesis do celów rozwojowych. Więc sprawdź je, jeśli jeszcze tego nie zrobiłeś.

Po tym, jak próbowałem uruchomić skrypt instalacyjny znaleziony w pierwszym poście, zdałem sobie sprawę, że zainstalował arkusz stylów motywu potomnego w katalogu o nazwie „_s”, który jest poprawny dla wszystkich motywów WordPress z wyjątkiem Genesis.

Następnie edytowałem plik motywu potomnego style.css i zmieniłem ścieżki z „Element Child Theme/style.css” na „Element Child Theme/*/style.css”.

I to faktycznie działa!

Szybkie linki 

Wniosek - jak dodać logo obrazu nagłówka dla motywu Genesis Child 2024

Genesis Framework to jeden z najpopularniejszych dostępnych motywów WordPress. Jest łatwy w dostosowywaniu i zawiera mnóstwo funkcji, które pomogą Ci rozwinąć działalność.

Jednym ze sposobów personalizacji witryny jest dodanie logo z obrazem nagłówka dla motywu Genesis Child, które pojawi się w miejscu domyślnego tekstu „Genesis Framework” na górze każdej strony. 

Blogi to świetny sposób na dzielenie się wiedzą, promocję produktu lub usługi oraz budowanie grona odbiorców. Ale jak je zaprojektujesz?

Istnieje wiele różnych motywów blogów, które twierdzą, że są najlepsze do tworzenia pięknych stron internetowych, ale który z nich jest dla Ciebie odpowiedni? Wzięliśmy niektóre z najpopularniejszych dostępnych obecnie szablonów Genesis Child Theme i oceniliśmy ich jakość od 1 do 5 gwiazdek w oparciu o nasze osobiste preferencje. 

Jitendra Vaswani

Jitendra Vaswani jest założycielem SchematNinja Wtyczka WordPress, przed SchemaNinja jest założycielem dużego internetowego bloga marketingowego BlogerzyPomysły.com i agencja marketingu cyfrowego DigiExe. Podczas swojej ponad 6-letniej praktyki w marketingu cyfrowym Jitendra był konsultantem marketingowym, trenerem, mówcą i autorem książki „Inside A Hustler's Brain: In Pursuit of Financial Freedom”, która sprzedała się w ponad 20,000 3000 egzemplarzy na całym świecie. Do tej pory przeszkolił ponad 5 specjalistów marketingu cyfrowego i od ponad XNUMX lat prowadzi warsztaty z marketingu cyfrowego na całym świecie. Jego ostatecznym celem jest pomoc ludziom w budowaniu firm poprzez cyfryzację i uświadomienie im, że marzenia się spełniają, jeśli pozostaniesz napędzany. Sprawdź jego nowo nabyte strony internetowe Stacja obrazów, Nowa inteligentna fala

Zostaw komentarz