How to Add a Horizontal Line to a WordPress Post or Page – Make A Website Hub

When you create a publication or page in WordPress, it can be very easy to overlook the visual aspects of the final product. It is important to consider readability and organization. You can have the best copy of the world, but people will not want to read your page if it looks like a large block of text.

One of the best ways to make your page more visually attractive is to include horizontal lines. Simple lines can keep several sections of your page separate and organized. It facilitates the reading of the content and helps the reader to find the section he is looking for.

Adding horizontal line lines is quite easy. You can do it in the Visual Editor or in the Text Editor.

Add horizontal lines in the HTML text editor

If you’re comfortable working with HTML in the text editor, this is a very easy to do the job. When you create your page on the edit screen, you must change to the HTML Text Editor. To do this, simply click on the “TEXT” tab in the upper right corner of the editor window. It is shown below (highlighted in the red box)


You are now in the HTML Editor. You should still be able to see the text you have written. The only difference is that all the text is in one style. You can also view the HTML code for all your style guidelines, such as bold or italic text.

To insert a horizontal line, move the text cursor to the place where you want the line. Then, press the “Enter” key to create a new HTML line. In this blank HTML line, write the following code:

It’s as simple as that! You can add multiple horizontal lines along the page. You can even use double lines by creating another HTML line with the same code.

It is important that you do not alternate between the Visual Editor and the HTML Editor. If it does, it can lead to format discrepancies. Once you have added the horizontal line, click “Update file” to save the changes.

Add horizontal lines in the Visual Editor

You can also create horizontal lines within the Visual Editor. While previous versions of the WordPress editor required you to do some code modification to do this, the modern platform has this built-in functionality.

On the Visual Editor screen, you will see a row of buttons. These buttons allow you to create automatic style changes without having to enter the code manually. The default row of buttons contains only a limited selection of functions. However, if you look to the right of these buttons, you will notice three small dots. When you hover your mouse over these points, the “Alternate Advanced” label will appear.


Click here to see the second row of style buttons. The third button on the left is the horizontal line button. Simply place the text cursor where you want to insert the line. Press the horizontal line button and it will appear automatically. You can press this button as many times as you wish to create multiple lines.

Quick creation of horizontal lines

In addition to using the designated editor button, you can create horizontal lines with some keystrokes. WordPress has a convenient shortcut command so you can continue writing. To create a line, simply type “-” in an empty line of text. Then, press “Enter” on your keyboard. When you press “Enter”, the three dashes will be transformed into a horizontal line.

You can find more information about this keyboard shortcut, as well as several others, by pressing the question mark button on the far right of the second. row of buttons of the Visual Editor.

The following two tabs change the content below.

My name is Jamie Spencer and I have spent the last 5 years creating blogs to make money. After getting tired of 9-5, traveling and not seeing my family, I decided that I wanted to make some changes and I launched my first blog. Since then, I’ve launched many successful niche blogs and, after selling my survival blog, I decided to teach other people how to do the same.

Add a Comment

Your email address will not be published. Required fields are marked *

Translate »