Czy chcesz dodać widżet WordPress do obszaru nagłówka swojej witryny?

Widżety umożliwiają łatwe dodawanie bloków treści w wyznaczonych sekcjach motywu WordPress.

W tym samouczku pokażemy, jak łatwo dodać widżet WordPress do nagłówka witryny.

Note: To jest samouczek na poziomie średnio zaawansowanym. Będziesz musiał dodać kod do pliki twojego motywu WordPress i opanuj trochę CSS.

Ale przed każdą modyfikacją odkryj naszą 5 WordPress wtyczki do tworzenia kopii zapasowych na blogu lub Jak zainstalować WordPress et Ilu wtyczki należy zainstalować na WordPress.

Wróćmy do tego, dlaczego tu jesteśmy. 

Dlaczego i kiedy musisz dodać widżet do nagłówka?

Widżety umożliwiają łatwe dodawanie bloków treści do wyznaczonego obszaru w motywie WordPress. Te wyznaczone obszary noszą nazwę „ Paski „Lub obszary” widgety".

Obszar widżetów w nagłówku może służyć do wyświetlania reklam, najnowszych artykułów lub cokolwiek chcesz.

Ta konkretna domena jest używana na wszystkich popularnych stronach internetowych do wyświetlania naprawdę ważnych informacji.

Odkryj też Jak dodawać niestandardowe widżety po opublikowaniu w WordPressie

strefa widgetisee w głowie wordpress

Z reguły, Motywy WordPress dodaj paski boczne obok treści lub w obszarze stopki. Bardzo niewiele motywów WordPress dodaje obszary widżetów nad treścią lub w nagłówku.

Radzimy również odkryć nasze Tutorial MailChimp w języku francuskim: kompletny przewodnik do stworzenia newslettera

Dlatego w tym samouczku pokażemy, jak dodać obszar widżetów do nagłówka witryny WordPress.

Krok 1: Utwórz obszar widżetów

Przede wszystkim musimy stworzyć niestandardowy obszar widżetów. Ten krok pozwoli Ci zobaczyć niestandardowy obszar widżetów w „ Wygląd> Widżety Na pulpicie WordPress.

Musisz dodać ten kod do pliku functions.php Twojego tematu.

function bpc_widgets_init () {register_sidebar (array ('name' => 'Niestandardowy obszar widżetu nagłówka', 'id' => 'custom-header-widget', 'before_widget' => ' ',' after_widget '=>' ',' before_title '=>' ',' after_title '=>' ',)); } add_action („widgets_init”, „bpc_widgets_init”);

Ten kod zapisuje nowy pasek boczny lub obszar widżetów w motywie WordPress.

Jeśli nigdy nie instalowałeś lokalnie WordPress, dowiedz się Jak zainstalować WordPress lokalnie na komputerze PC / Windows z XAMPP

Możesz przejść do „ Wygląd> Widżety Zobaczysz nowy obszar widżetów oznaczony „ Niestandardowy widget strefy nagłówka ".

nowa strefa widżetów WordPress

Śmiało, dodaj widżet tekstowy do nowo utworzonego obszaru i zapisz go.

Spróbuj też nasz przewodnik na temat dodawania widżetów.

Krok 2: pokaż widget w nagłówku

Jeśli odwiedzisz swoją witrynę, nie zobaczysz właśnie dodanego widżetu tekstowego.

Ponieważ nie pokazaliśmy jeszcze, jak wyświetlić strefy niestandardowe widżety WordPress.

To właśnie zrobimy na tym etapie.

Tutaj jest również dla ciebie lista Krytyczne wtyczki WordPress 5, które zwiększają zarobki Twojego bloga

Będziesz musiał edytować plik header.php W motywie WordPress i dodaj ten kod w miejscu, w którym chcesz wyświetlić widżety.


 
 
 
 

Nie zapomnij zapisać zmian.

Następnie możesz odwiedzić swoją stronę internetową, aw nagłówku zobaczysz widżet tekstowy.

z myślą o witrynie demonstracyjnej

Wynik niekoniecznie będzie najbardziej atrakcyjny. Dlatego potrzebujesz CSS, aby wyświetlał się poprawnie.

Krok 3: Nadaj styl nagłówkom CSS

W zależności od motywu WordPress będziesz musiał dodać kod CSS, aby kontrolować sposób wyświetlania nagłówka i obszaru widżetów.

Jednym z najłatwiejszych sposobów jest użycie CSS Hero. Ta ostatnia umożliwia użycie intuicyjnego interfejsu użytkownika do modyfikacji CSS motywu WordPress.

Radzimy również to odkryć Co możesz zrobić z wtyczką Yellow Pencil WordPress?

Jeśli nie chcesz używać wtyczki, możesz dodać niestandardowy CSS do motywu WordPress, odwiedzając „ Wygląd »Personalizuj Aby dostosować motyw WordPress.

Przeczytaj także nasz artykuł na temat Wtyczki 10 WordPress w celu poprawy ruchu na blogu

Umożliwi to wyświetlenie interfejsu WordPress Customizer. Konieczne będzie kliknięcie przycisku „ Dodatkowy CSS ".

dodatkowe css WorDPress

Zakładka « Dodatkowy CSS W „ Customizer Umożliwia dodawanie niestandardowego arkusza CSS podczas przeglądania zmian w podglądzie po prawej stronie.

Z powodów związanych z tym samouczkiem zakładamy, że użyjesz tego obszaru, aby dodać pojedynczy widget do wyświetlania banerów reklamowych lub niestandardowy widget menu.

Oto przykład CSS na początek:

div # header-widget-area {width: 100%; background-color: #f7f7f7; border-bottom: 1px solid #eeeeee; text-align: center; } h2.chw-title {margin-top: 0px; text-align: left; transformacja tekstu: wielkie litery; rozmiar czcionki: mały; kolor tła: #feffce; szerokość: 130px; dopełnienie: 5px; }

Oto jak nasz niestandardowy widget pojawi się w nagłówku motywu Twenty Seventeen.

motyw demo dwadzieścia siedemnaście wordpress

Odkryj także niektóre wtyczki premium WordPress  

Możesz użyć innych WordPress wtyczki aby nadać nowoczesny wygląd i zoptymalizować obsługę Twojego bloga lub strony internetowej.

Oferujemy tutaj kilka premium wtyczek WordPress, które pomogą Ci to zrobić.

1. Smart4y Tooltip

Smart4y Tooltip to WordPress Plugin elastyczne narzędzie dedykowane do tworzenia nowoczesnych podpowiedzi bez zależności od biblioteki Javascript. Jest w pełni responsywny i oferuje możliwość wstawiania treści HTML.

Wtyczka Smart4y Tooltip Responsive WordPress

Jego edytor WYSIWYG pozwoli ci wizualnie utworzyć każdą etykietkę bez konieczności wprowadzania kodu, ale jeśli chcesz, zawsze możesz to zrobić.

Odkryj także nasze Wtyczki 10 WordPress do oceny artykułów z Twojego bloga

Jego inne cechy to: Obsługa strony programu budującego, dość responsywny układ, możliwość definiowania parametrów globalnych dla wszystkich podpowiedzi lub definiowania określonych parametrów dla każdej podpowiedzi, obsługa predefiniowanych efektów wizualnych, obliczanie pozycji podpowiedzi w oknie o zmienionym rozmiarze, szczegółowa dokumentacja itp….

Pobierz | Demo | hosting

2. uzasadnione

Le WordPress Plugin Justified to responsywna wtyczka galerii, która wyrównuje Twoje miniatury w wyjustowanej siatce za pomocą jQuery, tak jak na Flickr. 

Uzasadnione-plugin-Fotografików,

Zapewnia funkcje, które odróżnią Twoje galerie od galerii konkurencji!

Jego główne cechy to: responsywny układ, specjalne efekty estakady, automatyczne wyrównanie siatki,  edytor krótkich kodów, wygląd ecałkowicie konfigurowalny, obsługa pwidzowie i wiele innych…

Pobierz | Demo | hosting  

3. Zaplanuj e-maile

ce WordPress Plugin jak sama nazwa wskazuje, pozwala zaplanować publikację wiadomości e-mail na Twojej stronie internetowej. Jest częścią rozszerzeń wtyczki WordPress „Śledź mój post na blogu”. Zaplanuj e-maile Śledź wtyczkę Wordpress My Blog Post

Będziesz teraz mógł zaplanować publikację swoich e-maili według godzin, dni lub tygodni.

Przeczytaj także nasz artykuł na temat Wtyczki 10 WordPress do używania map w Twojej witrynie

Oferuje możliwość wysyłania połączonych e-maili dla wszystkich powiadomień zamiast każdego e-maila dla każdego powiadomienia, a także pozwala zdefiniować różne szablony e-maili dla różnych e-maili, aby ostatecznie odbiór wiadomości e-mail był bardziej strawny. .

PobierzDemo |hosting

Polecane zasoby

Dowiedz się o innych zalecanych zasobach, które pomogą Ci zbudować witrynę i zarządzać nią.

Wnioski

To jest to! To wszystko w tym samouczku, mam nadzieję, że pomoże Ci dodać obszar widżetów w nagłówku motywu WordPress. Nie wahaj się udostępnij znajomym w swoich ulubionych sieciach społecznościowych

Będziesz jednak mógł również skonsultować się z nami Zasoby, jeśli potrzebujesz więcej elementów do realizacji projektów tworzenia stron internetowych, zapoznaj się z naszym przewodnikiem na stronie Tworzenie bloga WordPress.

Jeśli masz sugestie lub uwagi, zostaw je w naszej sekcji commentaires.

...