Jak dodać poziomy separator w WordPress (3 metody)

Czy kiedykolwiek opublikowałeś wpis na blogu WordPress, który na pierwszy rzut oka wyglądał dobrze, ale po przewinięciu wydawał się trudny do przeczytania? Długie bloki tekstu mogą przytłoczyć czytelników i sprawić, że stracą zainteresowanie, nawet jeśli treść jest wartościowa.

Czasami wystarczy prosta pozioma linia, aby treść była bardziej płynna. Te separatory dzielą tekst, dzięki czemu jest bardziej uporządkowany i łatwiejszy do śledzenia. Pomagają również wyróżnić kluczowe ogłoszenia, promocje lub przejścia między sekcjami w sposób naturalny.

W tym samouczku przeprowadzimy Cię przez trzy proste sposoby dodawania poziomych separatorów linii w WordPressie.

W ten sposób możesz sprawić, że Twoje posty będą wyglądać na dopracowane i profesjonalne przy minimalnym wysiłku. 🙌

Dlaczego warto dodać poziomy separator linii w WordPress?

Poziomy separator linii dzieli sekcje, ułatwia skanowanie treści i utrzymuje zaangażowanie czytelników.

Oprócz czytelności, linie poziome są również przydatne do zwracania uwagi na kluczowe punkty, podkreślania cytatów lub tworzenia płynnych przejść między pomysłami.

Ogólnie rzecz biorąc, odwiedzający decydują w ciągu kilku sekund, czy zostać na Twojej stronie, czy ją opuścić. Na wielu urządzeniach Twój wpis na blogu może wyglądać jak jedna długa ściana tekstu, co może być przytłaczające do czytania.

Prosta linia pozioma może to zmienić. ✅

Ponieważ jest to kompleksowy przewodnik po dodawaniu poziomej linii dzielącej w WordPress, możesz skorzystać z naszego spisu treści, aby znaleźć metodę, której chcesz użyć:

• Method 1: Adding a Horizontal Line in the WordPress Block Editor
• Method 2: Adding a Horizontal Line in the WordPress Classic Editor
• Metoda 3: Podzielenie długiego formularza na wiele stron za pomocą WPForms
• Bonus Separators You Can Use in Your Posts and Pages
  • Blok Separator
  • Blok Więcej
  • Blok podziału strony
• Często zadawane pytania dotyczące dodawania linii poziomych w WordPressie
• Ucz się dalej: Wskazówki dotyczące zarządzania Twoimi wpisami i stronami w WordPressie

Gotowi? Zaczynajmy.

Metoda 1: Dodawanie poziomej linii w edytorze bloków WordPress

Aby dodać poziomą linię za pomocą edytora bloków WordPress, możesz kliknąć ikonę „+”, aby dodać nowy blok w dowolnym miejscu, gdzie chcesz umieścić linię.

Następnie wybierzmy blok „Separator” z sekcji „Elementy układu”.

Możesz go łatwo znaleźć za pomocą paska wyszukiwania.

Po dodaniu zobaczysz swój poziomy separator linii w obszarze treści.

Stylizacja linii poziomej w edytorze bloków WordPress

Domyślnie poziomy separator to blado szara linia pośrodku Twojego wpisu lub strony.

Możesz zmienić jego wygląd, klikając na linię, aby zaznaczyć jej blok. Następnie po prawej stronie ekranu otworzy się panel edycji „Blok”.

Aby zmienić styl linii, kliknij małą strzałkę obok „Style”. Zobaczysz wtedy różne opcje.

Możesz zmienić linię poziomą na jedną z tych, jeśli chcesz:

• Szeroka linia, która obejmuje pełną szerokość treści Twojego wpisu.
• Na środku posta wyświetlane są trzy kropki.

Możesz również zmienić kolor linii poziomej w ustawieniach „Kolor”.

Po prostu kliknij jedną z wyświetlonych opcji lub użyj linku „Niestandardowy kolor”, aby wybrać dowolny kolor.

Jeśli chcesz wrócić do domyślnego szarego koloru, po prostu kliknij przycisk „Wyczyść” pod opcjami kolorów.

Tutaj nasza pozioma linia jest niebieska i używa stylu „szeroki”.

Metoda 2: Dodawanie linii poziomej w klasycznym edytorze WordPress

Jeśli używasz Edytora Klasycznego (często włączanego za pomocą wtyczki), nadal możesz łatwo dodawać linie poziome.

Aby to zrobić, po prostu edytuj istniejący post lub stronę lub utwórz nowy. Jeśli widzisz tylko jeden rząd przycisków na pasku narzędzi nad edytorem postów, kliknij ikonę „Przełącznik paska narzędzi” po prawej stronie:

Otworzy to drugi wiersz przycisków, który zawiera opcję linii poziomej.

Stąd pierwszą rzeczą do zrobienia jest umieszczenie kursora w nowej linii, w miejscu, w którym chcesz wstawić poziomą linię.

Następnie możesz kliknąć ikonę „Linia pozioma”. Jest to druga od lewej w drugim rzędzie:

Po dodaniu zobaczysz jasnoszarą linię poziomą.

Pokryje to całą szerokość Twojego wpisu w ten sposób:

Ręczne dodawanie linii poziomej za pomocą HTML

W niektórych rzadkich przypadkach może być konieczne ręczne dodanie poziomej linii dzielącej w treści WordPress.

Jeśli tak, możesz to po prostu zrobić, używając znacznika HTML <hr> w swoich treściach:

<hr>

Możesz dodać ten tag w widoku „Tekst” Edytora Klasycznego lub w bloku „Niestandardowy HTML” w Edytorze Blokowym.

To szybki sposób na dodanie separatora podczas pracy z kodem.

Metoda 3: Podzielenie długiego formularza na wiele stron za pomocą WPForms

Czasami trzeba podzielić długi formularz, aby nie przytłaczał użytkowników. Zamiast wizualnej linii, możesz podzielić formularz na wiele stron. Pokażemy Ci, jak to zrobić, używając naszego ulubionego konstruktora formularzy kontaktowych WordPress, WPForms.

W rzeczywistości WPForms to narzędzie, które kochamy i sami używamy, dlatego gorąco polecamy rozważenie go. Więcej informacji o wtyczce znajdziesz w naszym pełnym przewodniku po recenzji WPForms!

Najpierw musisz pobrać, zainstalować i aktywować wtyczkę WPForms. Jeśli nie wiesz jak, zapoznaj się z naszym przewodnikiem krok po kroku jak zainstalować wtyczkę WordPress.

Następnie możesz przejść do WPForms » Dodaj nowy z panelu administratora WordPress.

Na następnym ekranie wprowadzisz nazwę dla swojego formularza, a następnie wybierzesz szablon.

W tym poradniku użyjemy szablonu „Formularz prośby o wycenę”.

Po wybraniu szablonu możesz po prostu najechać kursorem myszy na szablon i kliknąć przycisk, aby utworzyć formularz.

Następnie przewińmy w dół zakładkę „Add Fields” (Dodaj pola) po lewej stronie do sekcji „Fancy Fields” (Fikuśne pola).

Następnie możesz przeciągnąć i upuścić „Page Break” (Podział strony) w dowolne miejsce formularza. Umieszczamy go tuż przed polem „Request” (Prośba).

Zobaczysz, że formularz jest teraz podzielony na 2 części. WPForms automatycznie dodał również przycisk "Dalej".

Możesz zmienić etykietę „Next” (Dalej), jeśli chcesz, i dodać przycisk „Previous” (Wstecz), aby użytkownicy mogli przejść do drugiej strony formularza.

Po prostu kliknij pole podziału strony, aby je edytować.

Po zakończeniu możesz zapisać formularz, klikając przycisk „Zapisz” w prawym górnym rogu.

Teraz czas dodać formularz do swojej witryny.

Kliknij przycisk „Osadź” obok przycisku „Zapisz”, aby rozpocząć. Otworzy się okno dialogowe, w którym możesz utworzyć nowy post lub stronę lub edytować istniejący.

W tym samouczku wybierzemy opcję „Wybierz istniejącą stronę”.

Następnym krokiem jest wybranie z dostępnych stron i kliknięcie „Let’s Go!”

Zostaniesz następnie przekierowany do edytora treści WordPress.

Stąd po prostu kliknij ikonę „+”, aby dodać nowy blok do swojego wpisu lub strony i znajdź blok „WPForms”. Możesz użyć paska wyszukiwania lub poszukać w sekcji „Widżety”.

Gdy ją znajdziesz, kliknij ją, aby dodać blok do swojej strony.

Teraz zobaczysz opcję wyboru swojej formy.

Przejdź dalej i wybierz formularz, który właśnie utworzyłeś, z listy rozwijanej.

Po wykonaniu tej czynności możesz opublikować wpis lub stronę. I to wszystko!

Teraz, jeśli odwiedzisz wpis lub stronę, możesz zobaczyć formularz w akcji.

Dodatek Separatory, których możesz używać w swoich postach i stronach

Oprócz linii poziomej, edytor bloków WordPress oferuje inne przydatne bloki, które pomogą Ci zorganizować treść i poprawić układ. Przyjrzyjmy się kilku świetnym alternatywom.

Blok Separator

Blok „Przerwa” pozwala dodać białe tło między blokami.

Na przykład, jeśli chcesz niewielką przerwę na końcu swojego wpisu przed magnesem na leady, możesz użyć „Spacji”.

Oto jak to wygląda podczas tworzenia posta w edytorze bloków:

Możesz dostosować wysokość separatora, aby lepiej pasował do obszaru treści.

A tak może wyglądać spacja na Twojej stronie:

Blok Więcej

Jeśli Twój motyw wyświetla pełne posty na Twojej głównej stronie bloga zamiast fragmentów, dodanie linku „Więcej” przetnie Twój post w tym miejscu.

Wymusi to na odwiedzających kliknięcie, aby przeczytać więcej.

Powyższy obraz pokazuje, co zobaczysz w edytorze treści.

A poniżej znajduje się sposób, w jaki może to wyglądać dla odwiedzających Twoją witrynę:

Więcej informacji na ten temat znajdziesz w naszych poradnikach na temat prawidłowego używania bloku "więcej" oraz łatwego dostosowywania fragmentów w WordPress.

Blok podziału strony

„Podział strony” dzieli długi wpis na blogu na wiele stron (technika zwana paginacją).

Sam blok nie ma opcji stylizacji w edytorze, więc jego wygląd jest kontrolowany przez Twój motyw WordPress. Oto jak wygląda, gdy piszesz swój wpis:

Następnie „Podział strony” użyje numerów stron i pozwoli czytelnikom wybrać, na którą stronę chcą przejść.

Oto jak może to wyglądać na Twojej witrynie WordPress:

Szczegółowe informacje znajdziesz w naszym przewodniku jak podzielić posty WordPress na wiele stron.

Każda z nich może być dobrą alternatywą dla dodania poziomej linii w WordPress, w zależności od celu.

Często zadawane pytania dotyczące dodawania linii poziomych w WordPressie

Jaki jest tag HTML dla linii poziomej?

Znacznik HTML dla linii poziomej to <hr>, co oznacza „horizontal rule” (linia pozioma). Możesz dodać ten znacznik w edytorze kodu, aby ręcznie wstawić standardowy separator liniowy.

Jak mogę dostosować linię poziomą w WordPressie?

Edytor bloków WordPress ma wbudowane ustawienia, które pozwalają na zmianę stylu i koloru linii. W przypadku bardziej zaawansowanych dostosowań, takich jak regulacja grubości lub tworzenie unikalnych projektów, zazwyczaj używa się niestandardowego CSS.

Czy mogę użyć obrazu zamiast linii jako separatora?

Absolutnie. Użycie niestandardowego obrazu jako separatora może dodać unikalny, markowy akcent do Twoich treści. Aby uzyskać jeszcze większą kontrolę twórczą, wtyczka do tworzenia stron, taka jak SeedProd, pozwala projektować niestandardowe separatory sekcji bez żadnego kodu.

Ucz się dalej: Wskazówki dotyczące zarządzania Twoimi wpisami i stronami w WordPressie

Mamy nadzieję, że ten samouczek pomógł Ci dowiedzieć się, jak dodawać poziome separatory linii w WordPress.

Jeśli chcesz dodać więcej elementów projektowych i układu do swoich wpisów i stron, zapoznaj się z naszymi artykułami na temat:

• Najlepsze kreatory stron WordPress typu „przeciągnij i upuść”
• Jak utworzyć niestandardowy separator kształtów w WordPress
• Jak wyświetlić listę ostatnio aktualizowanych postów w WordPress
• Jak dodać niestandardowy status wpisu dla wpisów na blogu w WordPressie
• Jak tworzyć niestandardowe typy postów w WordPress
• Jak zabezpieczyć hasłem stronę lub wpis w WordPress

Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.