Introduction

It is obvious that indentation is not widely used in WordPress because most of the text is aligned left. However, it doesn’t mean that Paragraph indents are not valuable in WordPress. This function will help in some special cases. For example, when you want to add a quote or add a list of bulleted lists, paragraph indents will make your website look more professional. In addition, it is a great way to enhance the reader’s experience as well as make rows shorter.

How to indent paragraphs in WordPress?

There are several ways to indent paragraphs in WordPress. It depends on the editor that you are using. In today’s tutorial, we will share with you the 3 easiest methods to tackle this matter including:

  • Using the indent text buttons
  • Add a classic block
  • Using CSS

Now, let’s dive into the following solutions.

Solutions

Method 1: Using the indent text buttons in the Classic Editor

Fortunately, the Classic Editor has the indent text button on the toolbar. If your toolbar looks like the screenshot image below, you need to click on the Toolbar Toggle option to widen your tool menu.

Image14

At here, there are two buttons that allow you to increase or decrease indent manually in the visual editor.

In addition, if you want to indent more than one paragraph, you need to choose those paragraphs first and then click on the Increase indent button. You can click on the Increase Indent multiple times until you are satisfied with the results. In contrast, if you want to decrease spacing, you can click on the Decrease indent.

Indent Paragraphs In Wordpress 1

Method 2: Using the Classic Block in Gutenberg

By default, the paragraph block of Gutenberg doesn’t include the indent functionality. However, it also offers you the Classic block that is similar to the toolbar in the Classic editor, so you easily increase or decrease indent.

First and foremost, you need to add a classic block.

Image16

Now, your screen might look like our screenshot image below. You can view the two indent buttons in the second row of the toolbar. You can optionally click on one of them to increase or decrease indent paragraphs depending on your purposes.

After you have pressed the Enter keyboard shortcut to finish, it will start a new row instead of creating a new block as in the paragraph block.

Indent Paragraphs In Wordpress 2

Method 3: Using CSS to indent a single line

Those mentioned methods above only allow you to indent the whole paragraph. In case you only need to indent the first line of all paragraphs, you should consider this method. However, the third way requires you have a few coding skills.

Firstly, you need to switch to Appearance > Customize from your dashboard. Now, simply click on the “Additional CSS” tab. This step will open a text box where you can add your CSS rule to increase indent the first line of a paragraph.

Image19

Here, you need to add your custom CSS. In our case, we are going to indent the first line of all paragraphs to 40 px. We added the following code: article p{ text-indent:40px}

At the same time, you can see the changes in the live preview area. If you are satisfied with the results, click on Publish button to finish.

Indent Paragraphs In Wordpress 3

In case you only want to indent the first line for chosen paragraphs, you need to add another code to your theme’s additional CSS. For example, we added the custom CSS below to apply for a few selected paragraphs.

p.custom-indent {
text-indent:60px;
}

Image22

Now, go to the editor to edit your posts by wrapping the selected paragraph inside the code snippet below.

<p class=”custom-indent”> Your text </p>

Image23

After that, let’s click on Update/Publish and you will see how it looks.

Image24

Wrap up

We expect that through this article you can learn some useful and simple ways to indent paragraphs in WordPress. If you have any queries during using these methods, please leave a comment below, we will reply as soon as possible.

By the way, there are hundreds of stunning, responsive, and professional themes in our free WordPress Themes. Are you planning to build your desired website? Don’t ignore our website.

5/5 - (1 vote)
Lt Digital Team (Content &Amp; Marketing)

Summer Sale Grab 50% Off for everything on today, don't miss it. Coupon code: SUMMER2024 Redeem Now
Summer Sale Grab 50% Off for everything on today, don't miss it. Coupon code: SUMMER2024 Redeem Now