Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Puchar WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Jak dodać poziomy separator linii w WordPress (5 metod)

Uwaga redakcyjna: Otrzymujemy prowizję z linków partnerskich na WPBeginner. Prowizje nie mają wpływu na opinie i oceny naszych redaktorów. Dowiedz się więcej o Proces redakcyjny.

Chcesz dodać poziomą linię w poprzek twojego wpisu lub strony w WordPress?

Poziome linie podziału to świetny sposób na podzielenie długich wpisów na mniejsze sekcje, wyróżnienie specjalnych ogłoszeń lub promocji i wyraźne oddzielenie różnych części strony.

W tym artykule pokażemy, jak łatwo dodać poziomą linię podziału w WordPress.

How to add a horizontal line in WordPress

Dlaczego warto dodać poziomy separator linii w WordPress?

To zajmuje tylko kilka sekund, zanim odwiedzający dowiedzą się, czy chcą opuścić twoją stronę. W zależności od urządzenia, czasami przeglądarki mogą wyświetlać twój wpis na blogu jako długą ścianę tekstu.

Wielu czytelników odejdzie, jeśli treść będzie zbyt trudna do przeczytania, nawet jeśli artykuł na blogu zawiera wiele wartości.

Dodanie poziomego separatora linii może być wszystkim, czego potrzeba, aby treść była czytelna, co poprawi czytelność i ostatecznie zwiększy zaangażowanie użytkowników w twoje wpisy i strony na blogu.

Poza tym poziome separatory linii mogą podkreślać kluczowe punkty. Na przykład, mogą one pomóc importować ważne cytaty lub przejścia w twojej treści.

Ponieważ jest to kompleksowy przewodnik na temat dodawania poziomej linii podziału w WordPress, pomocne może okazać się skorzystanie z naszego spisu treści, aby znaleźć metodę, której chcesz użyć:

Dodawanie poziomej linii w edytorze bloków WordPress

Aby dodać poziomą linię za pomocą edytora bloków WordPress, kliknij ikonkę (+), aby utworzyć nowy blok w miejscu, w którym ma znajdować się linia.

Adding a new block where you want your horizontal line

Następnie wybierz blok Separator z sekcji Elementy układu.

Można go również wyszukać za pomocą paska wyszukiwania.

Find and add the Separator block

Po dodaniu, w obszarze treści zobaczysz twój poziomy dzielnik liniowy.

Stylizacja linii poziomej w edytorze bloków WordPress

Domyślnie poziomy separator jest bladoszarą linią na środku twojego wpisu lub strony.

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

Click on the Separator block to select it and edit the settings

Aby zmienić styl twojej linii, kliknij małą strzałkę obok opcji Style. Następnie zobaczysz różne opcje.

Jeśli chcesz, możesz zmienić poziomą linię na jedną z nich:

  • Szeroka linia, która obejmuje całą szerokość treści twojego wpisu.
  • Trzy kropki są wyświetlane na środku twojego wpisu.
The different styles available for the Separator block

Uwaga: W niektórych motywach WordPress zarówno szeroka linia, jak i domyślna linia będą obejmować całą szerokość twojego wpisu.

Możesz również zmienić kolor twojej poziomej linii w ustawieniach koloru. Wystarczy kliknąć jedną z wyświetlonych opcji lub użyć odnośnika „Dostosuj kolor”, aby wybrać dowolny kolor.

Change the color of the horizontal line

Jeśli chcesz powró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”.

A horizontal line that's been modified to be wide and blue

Dodawanie poziomej linii w klasycznym edytorze WordPress

Jeśli nadal korzystasz z klasycznego edytora, możesz dodać podstawowe poziome linie. Aby to zrobić, wystarczy edytować istniejący wpis lub stronę lub utworzyć nowy.

Jeśli widzisz tylko jeden rząd przycisków na pasku narzędzi nad edytorem wpisów, kliknij ikonkę przełączania paska narzędzi po prawej stronie:

Click the Toolbar Toggle button to see the second row of icons

Spowoduje to otwarcie drugiego rzędu przycisków, który zawiera opcję poziomej linii.

Teraz umieść podział wiersza między akapitami w miejscu, w którym ma przebiegać pozioma linia. Następnie kliknij przycisk Linia pozioma. Jest to drugi przycisk od lewej w drugim rzędzie:

The horizontal line button in the classic WordPress editor

Twoja pozioma linia będzie jasnoszara.

Pokryje on całą szerokość twojego wpisu w ten sposób:

A horizontal rule created using the classic editor

Ręczne dodawanie poziomej linii podziału przy użyciu HTML

W niektórych rzadkich przypadkach może być konieczne ręczne dodanie poziomej linii podziału w twojej treści WordPress.

Jeśli tak, możesz to po prostu zrobić, używając tagu hr HTML w twojej treści:

<hr>

Spowoduje to dodanie separatora w postaci poziomej linii do treści twojego wpisu.

Inne separatory, których możesz użyć w swoich wpisach i na stronach

Domyślny edytor bloków WordPress umożliwia dodawanie wielu rodzajów separatorów do twoich wpisów i stron.

Oprócz separatora linii poziomej, inne opcje w zestawie bloków Elementy układu obejmują bloki Odstęp, Więcej odnośników i Podział strony.

Blok dystansowy

Spacer pozwala dodać białą przestrzeń między blokami. Na przykład, jeśli chcesz, aby na końcu twojego wpisu pojawiła się niewielka przerwa przed ofertą specjalną, możesz użyć Spaceru.

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

The Spacer block in the block editor

Wysokość elementu dystansowego można dostosować do własnych potrzeb.

A oto jak przekładka pojawia się na twojej witrynie:

How the spacer block appears in a page or post

The More Block

Jeśli twój motyw wyświetla pełne wpisy (a nie zajawki) na głównej stronie bloga, to dodanie odnośnika „Więcej” spowoduje przerwanie wpisu w tym miejscu.

Odwiedzający może kliknąć, aby dowiedzieć się więcej.

The More block in the post editor

Powyższy obrazek przedstawia to, co zobaczysz w edytorze treści.

Poniżej przedstawiamy, w jaki sposób Twoja witryna jest widoczna dla odwiedzających.

The Read More block in a post on the site

Możesz dowiedzieć się więcej o zajawkach w naszym przewodniku na temat tego, jak łatwo dostosować zajawki w WordPress.

Blok podziału strony

Podział na strony pozwala podzielić długie wpisy na blogu na kilka stron. Nie można go w żaden sposób dostosować do własnych potrzeb. Oto jak wygląda podczas tworzenia twojego wpisu:

The page break block shown in the block editor

A oto jak wygląda podział strony na twojej witrynie.

Powiadomienie wykorzystuje numery stron i pozwala czytelnikom wybrać stronę, do której chcą przejść.

The page break as it appears on a site

Każda z tych opcji może być dobrą alternatywą dla dodania poziomej linii w WordPress, w zależności od tego, co chcesz zrobić.

Dodawanie podziału strony w formularzach WordPress za pomocą WPForms

Co jeśli chcesz umieścić przerwę nie we wpisie lub na stronie, ale w formularzu kontaktowym WordPress? To też można zrobić. Wykorzystamy do tego WPForms.

Najpierw należy pobrać, zainstalować i włączyć wtyczkę WPForms. Jeśli nie wiesz, jak to zrobić, zapoznaj się z naszym przewodnikiem krok po kroku, jak zainstalować wtyczkę WordPress.

Następnie przejdź do WPForms ” Utwórz nowy w twoim kokpicie WordPress.

Creating a new form using WPForms

Wpisz nazwę twojego formularza, a następnie wybierz szablon. W naszym przypadku użyjemy szablonu„Formularz zapytania ofertowego”.

Najedź kursorem myszy na szablon i kliknij przycisk, aby utworzyć twój formularz.

Creating a quote form in WPForms

Następnie przewiń kartę Add Fields po lewej stronie do sekcji Fancy Fields.

Przeciągnij i upuść podział strony w dowolnym miejscu formularza. Umieszczamy go tuż przed polem Request.

Adding a page break in WPForms

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

Jeśli chcesz, możesz zmienić etykietę „Następny” i dodać przycisk „Poprzedni”, aby przejść do drugiej strony formularza. Wystarczy kliknąć pole podziału strony, aby je edytować.

Editing the page break field in WPForms

Zapisz swój formularz po zakończeniu, klikając przycisk Zapisz w prawym górnym rogu.

Teraz możesz dodać formularz do twojej witryny internetowej.

Najpierw należy utworzyć nowy wpis lub stronę albo edytować już istniejący.

Kliknij przycisk (+), aby utworzyć nowy blok do twojego wpisu lub strony i znajdź blok WPForms. Możesz użyć paska wyszukiwania lub poszukać w sekcji Widżety. Dodaj blok do twojej strony.

Adding the WPForms block to your page or post

Teraz zobaczysz opcję wyboru twojego formularza.

Wybierz z listy rozwijanej.

Choose your form from the dropdown list

Gdy to zrobisz, możesz opublikować wpis lub stronę.

Następnie sprawdź, jak twój formularz wygląda na twojej witrynie internetowej.

The form with a page break on the website

Mamy nadzieję, że ten poradnik pomógł ci nauczyć się dodawać poziome separatory liniowe w WordPress. Jeśli chcesz dodać więcej elementów projektu i układu do swoich wpisów i stron, zapoznaj się z naszym artykułem na temat najlepszych kreatorów stron WordPress typu „przeciągnij i upuść ” lub przeczytaj nasz wpis na blogu o tym, jak utworzyć własny dzielnik kształtu w WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Ujawnienie: Nasze treści są wspierane przez czytelników. Oznacza to, że jeśli klikniesz na niektóre z naszych linków, możemy otrzymać prowizję. Zobacz jak WPBeginner jest finansowany, dlaczego to ma znaczenie i jak możesz nas wspierać. Oto nasz proces redakcyjny.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Najlepszy zestaw narzędzi WordPress

Uzyskaj BEZPŁATNY dostęp do naszego zestawu narzędzi - zbiór produktów i zasobów związanych z WordPressem, które każdy profesjonalista powinien mieć!

Reader Interactions

5 komentarzyZostaw odpowiedź

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

    • WPBeginner Support says

      For that you would want to create columns and then you would use css to add the border property to the columns.

      Administrator

    • WPBeginner Support says

      It would depend on how they are being used but for the most part they should not have a major effect.

      Administrator

Zostaw odpowiedź

Dziękujemy za pozostawienie komentarza. Pamiętaj, że wszystkie komentarze są moderowane zgodnie z naszymi polityka komentarzy, a Twój adres e-mail NIE zostanie opublikowany. NIE używaj słów kluczowych w polu nazwy. Przeprowadźmy osobistą i konstruktywną rozmowę.