Resources     Blog  

  1. Home
  2. WordPress Tutorials
  3. How To Add Single Or Double Line Spacing In WordPress

How To Add Single Or Double Line Spacing In WordPress

In many Word processors, adding additional blank line spaces is easy. You simply have to press ENTER several times. With a bit more technical skill, it is also possible to alter the formatting in order to increase line spacing, create a double-spaced line and more. A lot of this gets frustrating for those who are new to visual editor in WordPress. This is because there isn’t a button for formatting like the one that is found in MS Word. We’re going to tell you all about WordPress line spacing so that you can get the look you want without a lot of hassle.

Before we begin, however, it is important to note that line spacing is ultimately controlled by the WordPress theme that is being used. We’re going to show you how to deal with WordPress line spacing in visual editor and then we’ll show you how to alter line spacing in the theme of your choice in case the results aren’t to your liking.

Creating A Double Line Space

When you add a line break by pressing ENTER, this is considered a new paragraph by WordPress visual editor. Due to this fact, the double line space will be automatically added if your theme has the proper styling for this (and many WordPress themes do). Thus, all you have to do is press ENTER after a line and then you can start typing something new on the next line without taking any additional steps. Based upon the styling of your theme, pressing ENTER will create double line spacing and this will in turn produce a clear distinction between your paragraphs.

Creating A Single Line Space

When writing addresses or anything else that does not require a double line space, the ability to create a single space will come in handy. This can be accomplished by pressing SHIFT + ENTER. This tells WordPress that you are going to begin a new line inside of the same paragraph and it will result in single line spacing rather than a double line space.

Altering Spacing And Line Heights

There are times when using the correct line spacing in visual editor will fail to produce the results you want in your selected theme. In these instances, it will be necessary to make CSS changes. CSS is a lot like the MS Word formatting feature.

This will require you to tweak CSS code a bit, but this is not as challenging as it first seems. Simply open the CSS file for your theme. This can be found by going to the WordPress admin area and accessing the Appearance » Editor. If you prefer, you can also use FTP.

Look for .post p in your CSS file. This controls how paragraphs are displayed in the content that you post. After you have located this, you should change or add the line-height value. If the .post p tag proves impossible to find, create one on your own.

post p{line-height: 1.5em;}

As per the CSS rule above, the line spacing for the paragraph content will be changed to 1.5em. An EM is a unit of width that is used for typography. This can be done in .post class, which is added automatically to the content area of every post by WordPress so that it will only affect posts rather than affecting paragraphs that have been used in other places.

This, however, will just change the spacing for single spacing. If you need to alter double spacing or the spacing between all paragraphs, then padding will have to be added. When doing so, you can use values that are best in line with your needs.

Author: Kaumil Patel

Kaumil Patel is the Chief Operating Officer of GreenGeeks and has over 13 years of experience in the web hosting industry working for and owning web hosting companies. Kaumil’s expertise is in marketing, business development, operations, acquisitions and mergers.

Was this article helpful?

Related Articles

Comments

  1. What if you just want to use a 1.5 linespace on one page and not change it for the whole theme?

  2. Why is it that it can’t be integrated directly in wordpress core or in some plugin such as wp edit?

    That shouldn’t be that difficult?

  3. Thank you. Sadly this method didn’t work for me. Still article was very helpful. I am not really a worpress expert, so I open few other articles and just try different variesions.

    This code worked for me, just in case if it can be useful for anybody else as well. I paste this in Custom CSS of my theme.

    .post p{padding: 15px 20px 15px;}
    .post h3{padding: 20px 0px 20px;}
    .post h4{padding: 10px 0px 10px;}
    .post h5{padding: 10px 0px 10px;}

    The first line is for adding space in paragraphs, the rest or for adding space in headings. Play with numbers to see what works for you.

    I am not sure if this is the most fine solution, but in my case works great.

    Thank you again!

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.