Jak stworzyć niestandardowy pasek boczny WordPress bez kodu?

Czy chcesz dowiedzieć się, jak utworzyć niestandardowy pasek boczny WordPress bez kodu?

Dobrze zaprojektowany pasek boczny poprawia wrażenia użytkownika i zapewnia im lepszą nawigację. Ale dostosowywanie paska bocznego przy użyciu domyślnych ustawień WordPressa nie zawsze jest proste. A kodowanie jest jeszcze trudniejsze.

W tym poście pokażemy, jak w kilku prostych krokach dodać pasek boczny w WordPressie.

Dlaczego powinieneś dodać niestandardowy pasek boczny WordPress?

Paski boczne zapewniają prosty, ale skuteczny sposób wyświetlania ważnych informacji, które mają zobaczyć odwiedzający. W wielu witrynach WordPress często dedykuje się paski boczne, które zawierają szybkie łącza do powiązanych postów, stron w mediach społecznościowych i formularzy zgody.

Pomaga to zapewnić użytkownikom jak najlepsze wrażenia i umożliwia kierowanie odwiedzających do obszarów witryny, które mają być dla nich widoczne. W rezultacie paski boczne pozwalają zwiększyć liczbę wyświetleń strony, czas pobytu, zaangażowanie i konwersje.

Mimo że wiele motywów WordPress ma gotowe paski boczne, nie zapewniają one tak łatwej wizualnej personalizacji, jaką można uzyskać w przypadku niektórych wtyczek WordPress.

SeedProd to najlepsza wtyczka WordPress do tworzenia pasków bocznych z łatwą funkcją przeciągania i upuszczania. Dlatego użyjemy SeedProd, aby pokazać, jak dodać pasek boczny w WordPress bez żadnego kodu.

Jak stworzyć niestandardowy pasek boczny WordPress bez kodu?

Aby dowiedzieć się, jak dodać pasek boczny w WordPressie, po prostu wykonaj poniższe czynności:

1. Instalowanie SeedProd
2. Wybór szablonu motywu
3. Dostosowywanie paska bocznego WordPress
   • Dodawanie formularza kontaktowego na pasku bocznym
   • Dodawanie najnowszych postów na pasku bocznym WordPress
   • Usuwanie elementów z paska bocznego
4. Zapisywanie zmian i publikowanie paska bocznego

Zaczynajmy.

1. Instalowanie SeedProd

Na początek musisz mieć zainstalowany SeedProd na swojej stronie. Jeśli nie wiesz, jak go zainstalować, zapoznaj się z tym samouczkiem, jak zainstalować wtyczkę WordPress.

Aby uzyskać dostęp do funkcji kreatora motywów WordPress w SeedProd (która będzie potrzebna do utworzenia paska bocznego), musisz kupić licencję SeedProd Pro. Po dokonaniu zakupu i utworzeniu konta w SeedProd, zaloguj się do swojego obszaru konta i przejdź do zakładki Pobieranie . Tutaj znajdziesz swój klucz licencyjny. Skopiuj go (będziemy tego potrzebować później).

Z pulpitu WordPress przejdź do SeedProd » Ustawienia. Na tym ekranie powinieneś zobaczyć pole klucza licencyjnego . Wklej tutaj klucz licencyjny i kliknij przycisk Zweryfikuj .

Teraz, gdy SeedProd jest skonfigurowany w Twojej witrynie, skorzystajmy z niektórych szablonów, aby ułatwić nam zadanie tworzenia paska bocznego.

2. Wybór szablonu motywu

W obszarze administracyjnym WordPressa kliknij SeedProd »Konstruktor motywów.

To jest główny pulpit nawigacyjny, na którym możesz kontrolować ustawienia wszystkich elementów motywu, w tym paska bocznego.

Teraz kliknij pomarańczowy przycisk Motywy .

SeedProd ma różne motywy dla różnych rodzajów firm i organizacji, w tym agencji marketingowych, restauracji, pośredników hipotecznych i innych. Możesz wybrać motyw, który najlepiej pasuje do Twojej firmy, a następnie dostosować pasek boczny, aż będzie wyglądał dokładnie tak, jak chcesz.

W tym przykładzie użyjemy motywu Starter, który świetnie sprawdza się w przypadku prostych witryn internetowych. Po wybraniu motywu obszar kreatora motywów zostanie automatycznie wypełniony wszystkimi niezbędnymi częściami, które składają się na motyw.

Możesz włączać i wyłączać każdą inną część w zależności od potrzeb. Ponieważ w naszym przykładzie użyjemy tylko paska bocznego dla strony bloga, pozostawimy włączone tylko części Pasek boczny i Indeks bloga, Archiwa, Wyszukiwanie .

Za pomocą przycisków przełączania pod nagłówkiem Opublikowane wyłączyliśmy inne części motywu i ustawiliśmy pasek boczny na TAK .

Teraz jesteśmy gotowi do rozpoczęcia dostosowywania paska bocznego.

3. Dostosowywanie paska bocznego WordPress

Aby rozpocząć dostosowywanie paska bocznego WordPress, najedź kursorem na opcję Pasek boczny w panelu konstruktora motywów SeedProd i kliknij Edytuj projekt.

Spowoduje to otwarcie interfejsu kreatora motywów. Pasek boczny motywu Starter ma domyślnie włączony pasek wyszukiwania, kategorie i ikony mediów społecznościowych.

Możesz jednak dodać więcej elementów do paska bocznego lub zastąpić istniejące czymś innym. W lewym panelu znajdziesz mnóstwo bloków, które możesz przeciągać i upuszczać w obszarze po prawej stronie, który jest podglądem na żywo paska bocznego.

Poniżej pokażemy, jak wykonać niektóre typowe dostosowania paska bocznego, ale są to wszystkie czynności opcjonalne.

Dodawanie formularza kontaktowego na pasku bocznym

W tym przykładzie pokażemy, jak dodać prosty formularz kontaktowy do paska bocznego. Ale najpierw upewnij się, że masz zainstalowane WPForms. Jeśli potrzebujesz pomocy, zobacz ten dokument dotyczący instalowania WPForms.

WPForms automatycznie integruje się z SeedProd. Tak więc wszelkie formularze, które utworzyłeś za pomocą WPForms, można dodać jako blok na pasku bocznym za pomocą SeedProd.

Aby to zrobić, po prostu wpisz „formularz kontaktowy” w pasku wyszukiwania pod zakładką Bloki . Następnie przeciągnij i upuść blok Formularz kontaktowy w miejscu, w którym chcesz go umieścić na pasku bocznym.

Po umieszczeniu formularza na pasku bocznym kliknij blok WPForms, aby otworzyć opcje formularza. Stąd możesz dodać już utworzony formularz lub nawet utworzyć nowy, naciskając przycisk +Nowy formularz .

Użyjemy formularza, który już utworzyliśmy za pomocą WPForms, klikając menu rozwijane Wybierz formularz i wybierając jeden z listy.

Tak wygląda formularz.

Jeśli potrzebujesz edytować formularz, kliknij Edytuj wybrany formularz. Spowoduje to otwarcie konstruktora WPForms w tym samym oknie i możesz wprowadzić żądane zmiany bez konieczności opuszczania ekranu konstruktora motywów.

Poza tym możesz dostosować projekt formularza, przechodząc do zakładki Zaawansowane . W tym miejscu SeedProd zapewnia opcje zmiany stylu, atrybutów, odstępów i widoczności formularza na urządzeniu.

Na przykład, jeśli chcesz ukryć pasek boczny, gdy Twoja witryna jest wyświetlana na urządzeniach mobilnych, po prostu kliknij menu Widoczność urządzenia , a następnie przełącz przycisk Ukryj na urządzeniu mobilnym .

Następnie pokażemy, jak dodać ostatnie posty na pasku bocznym bloga.

Dodawanie najnowszych postów na pasku bocznym WordPress

Ponownie użyj pola wyszukiwania w zakładce Bloki kreatora motywów i wpisz „ostatnie posty”. Teraz przeciągnij i upuść blok Ostatnie posty do obszaru, w którym chcesz go wyświetlić.

Widżet Najnowsze wpisy jest automatycznie wypełniany w miarę publikowania w witrynie nowych postów na blogu.

Jeśli klikniesz widżet umieszczony po prawej stronie kreatora, uzyskasz dostęp do ustawień, takich jak kontrolowanie liczby postów, które chcesz wyświetlić.

Na naszej przykładowej stronie testowej są tylko 3 posty. Ale dobrą zasadą jest umieszczenie 5 ostatnich postów do wyświetlenia na pasku bocznym.

Usuwanie elementów z paska bocznego

Dzięki konstruktorowi motywów SeedProd usuwanie elementów z paska bocznego jest tak samo proste, jak dodawanie nowych elementów.

W naszym przykładzie usuniemy blokadę paska wyszukiwania z paska bocznego. Decyzja, które części chcesz usunąć z paska bocznego, zależy wyłącznie od Ciebie. Pasek wyszukiwania usuwamy tylko w celu demonstracji.

Zwykle najlepszą praktyką jest utrzymywanie prostego i skoncentrowanego paska bocznego, więc staraj się nie umieszczać na nim zbyt wielu widżetów.

Aby usunąć blok, najedź myszą, aż wokół bloku, który chcesz usunąć, pojawi się pomarańczowy kontur, a następnie naciśnij ikonę kosza.

Następnie zobaczysz monit o potwierdzenie usunięcia. Naciśnij Tak, usuń to! przycisk, aby przejść dalej.

To wystarczy, aby usunąć dowolny blok lub element z paska bocznego.

4. Zapisywanie zmian i publikowanie paska bocznego

Kiedy skończysz dostosowywać pasek boczny do swoich upodobań, kliknij przycisk Zapisz w prawym górnym rogu.

Teraz kliknij przycisk krzyżyka, aby wyjść z kreatora motywów.

Ta czynność spowoduje dodanie paska bocznego do strony Twojego bloga. Otwórz stronę bloga swojej witryny z interfejsu użytkownika, aby zobaczyć nowo utworzony pasek boczny WordPress. (W tym przykładzie mamy włączone tylko ikony mediów społecznościowych i formularz kontaktowy).

I to wszystko! Teraz wiesz, jak dodać pasek boczny w WordPressie i dostosować go, aby wyglądał dokładnie tak, jak lubisz.

Następnie skonfiguruj subdomenę e-mail

Czy chcesz utrzymać swoją reputację e-maili i utrzymać wysokie wskaźniki dostarczalności? W takim przypadku powinieneś rozważyć utworzenie subdomeny e-mail. Zapoznaj się z naszym przewodnikiem po subdomenach poczty e-mail, aby dowiedzieć się, jak lepiej zarządzać reputacją poczty e-mail i skonfigurować subdomenę poczty e-mail.

Możesz również dowiedzieć się o dostarczalności wiadomości e-mail i jej znaczeniu. Więcej informacji znajdziesz w naszym artykule na temat poprawy dostarczalności wiadomości e-mail.

Gotowy, aby naprawić swoje e-maile? Zacznij już dziś od najlepszej wtyczki WordPress SMTP. WP Mail SMTP Elite obejmuje pełną konfigurację białych rękawic i oferuje 14-dniową gwarancję zwrotu pieniędzy.

Jeśli ten artykuł Ci pomógł, śledź nas na Facebooku i Twitterze, aby uzyskać więcej wskazówek i samouczków WordPress.