How do you create a single and double line spacing in WordPress Blog articles? It may seem confusing when you are typing your blog articles if you will get a single spacing or double line spacing. If you copy an article that you have written in Word or Docs and paste it, it will keep the line spacing. But let’s say you want to add a new line to what you are writing and become frustrated that your single line spacing and is double spacing. In this blog article, we are going to show you how to quickly create single and double line spacing as you type your blog article within WordPress.
Double Line Spacing
To create double line spacing press the Enter or Return key on your keyboard. WordPress visual editor considers this a new paragraph. This means it will automatically create the double line spacing.
Single Line Spacing
In some cases, you may want a single line space, such as with multi-line bullet points or addresses. It all depends upon your copywriting and typography style and branding with your blog and articles. To create a single space line, press the Shift + Enter key. This means that WordPress will start a new line inside an existing paragraph. It needs single line spacing vs double line spacing.
Modify Line Height and Line Spacing with CSS
Even though you add the proper line spacing in the editor, it may not display how you want. This means that you need to add some CSS coding to your theme.
CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed. The selector points to the HTML element to style (in our example below: p, which the HTML code for paragraph). The declaration block (in curly braces) contains one or more declarations separated by semicolons. Each declaration includes a CSS property name and a value, separated by a colon.
It may seem scary at first, especially if you are a beginner. CSS is easy to understand once you start using it more often. It is like riding a bike. It is hard at first, but the more you practice and use it, the easier it becomes.
To add custom CSS to your theme, got to Dashboard and select Appearance -> Theme Settings->Custom CSS (It may be at a different location based upon your theme such as Appearance -> Customize). The existing CSS coding will be there. Add your new CSS coding to the end or in the appropriate section if your existing CSS code is labeled by section. Let’s add the following
The .post class is calling all posts to make sure it only affects posts and not paragraphs used elsewhere. The p represents the paragraph. The CSS rule will change the line spacing of paragraph content to 1.8 multiplied with the current font-size to set the line height. It will appear double spaced.
This changes the spacing between lines. If you want to change the spacing between each paragraph, then you would need to add padding. In this case, I am adding padding below the paragraphs to 25 pixels of space.
If you would like to see all the properties that you may configure with text and paragraphs, be sure to check out w3schools.com.
Try it out and let us know how it works for you!
If you liked this article, then please subscribe to our mailing list to get more great tips delivered to your email. You can also find us on Facebook, Instagram, and Pinterest.
