How to Indent in WordPress

Trying to indent text in WordPress and not seeing an obvious “Indent” button can be frustrating. Depending on whether you’re using the Block Editor (Gutenberg), the Classic Editor, or custom layouts from your theme or page builder, the way you create indents is a little different.

In this guide, you’ll learn how to indent paragraphs and lists in both the Block Editor and Classic Editor, plus how to create consistent custom indents with CSS when you need more control. We’ll also walk through common problems, like indent buttons not appearing or indents looking different on mobile devices.

If you’re still getting comfortable with the WordPress interface, you may also want to bookmark the main WordPress guides and tutorials overview so you can explore related topics as you go.

Prerequisites

You don’t need to be a developer to indent text in WordPress, but you should have a few basics in place.

• Administrator or Editor access to your WordPress site.
• Ability to log in to the WordPress dashboard and open Posts or Pages.
• Know which editor you’re using: Block Editor (Gutenberg) or Classic Editor.
• Optional: Comfort switching between “Visual” and “Text/Code” views.

If you’ve never created or edited a post before, start with a quick walkthrough of the interface in this beginner’s guide to using WordPress.

Step 1: Understand How Indent in WordPress Work

In WordPress, “indent” can mean different things depending on the context. Before you start clicking buttons, it helps to know what you’re trying to achieve.

• Text indent: The first line of a paragraph starts a bit to the right (like in books).
• List indent: A bulleted or numbered item moves right to become a sub-item.
• Layout indent: A whole block or section is padded in from the left for visual emphasis.

The Block Editor and Classic Editor handle these slightly differently. The Block Editor focuses on blocks (paragraphs, lists, quotes) with limited built-in indent controls, especially for paragraphs. The Classic Editor looks more like a traditional word processor, with indent buttons available in the toolbar.

Step 2: Indent Text in the Block Editor (Gutenberg)

If your editor has a big “+” button for adding blocks and shows individual blocks when you click into text, you’re using the Block Editor. By default, it doesn’t have a simple “Indent” button for paragraphs, but you can still create indents with lists, block settings, and custom CSS.

Indent list items in the Block Editor

1. Open your post or page in the Block Editor.
2. Place your cursor where you want an indented item.
3. Insert a List block (type /list and press Enter, or use the “+” button and choose “List”).
4. Type your first list item.
5. To create a sub-item (indented list item), press the Tab key or click the Increase indent icon in the list toolbar.
6. To move an item back out, use Shift + Tab or the Decrease indent icon.

This method is perfect for multi-level bullet lists, nested steps, or outlining sections within a post.

Simulate paragraph indents with block settings

The Block Editor doesn’t provide a built-in first-line paragraph indent, but you can simulate it using block-level spacing:

1. Select a Paragraph block.
2. Open the Block settings panel on the right (if it’s hidden, click the gear icon).
3. Look for a Dimensions, Padding, or Layout section (exact labels vary by theme).
4. Add some left padding (for example, 20–30px) to push the entire paragraph block in from the left.

This shifts the whole block, not just the first line, but visually it reads like an indent, especially for short paragraphs or callouts.

Use special blocks for “indented” callouts

Instead of manually indenting paragraphs, you can also use blocks that are designed to stand out:

• Quote or Pullquote blocks often have built-in offset styling.
• Columns blocks let you place text in a narrower column, indirectly creating a visual indent.
• Theme-specific blocks (like “Highlight” or “Note”) can create a cleaner callout than manual spacing.

Step 3: Indent in WordPress Text in the Classic Editor

If your editor looks like a traditional word processor with “Visual” and “Text” tabs and a single toolbar, you’re probably using the Classic Editor. Here, indenting works much more like Microsoft Word or Google Docs.

Show the full toolbar

1. Open your post or page in the Classic Editor.
2. Click the Toolbar Toggle button (often the last icon on the first row) to reveal a second row of formatting options.
3. Look for the Increase indent and Decrease indent icons (they look like arrows pointing at lines of text).

Indent a paragraph in the Classic Editor

1. Select the paragraph you want to indent.
2. Click the Increase indent icon once to move it in from the left.
3. Click again to increase the indent further if needed.
4. Use the Decrease indent icon to move it back toward the left margin.

This works for both paragraphs and lists. It provides a quick way to visually emphasize quotes, examples, or code snippets without touching CSS.

Step 4: Indent in WordPress Bullet and Numbered Lists

Lists are the most common place where you’ll use indents in WordPress. Both editors support multi-level lists, but the controls look slightly different.

Block Editor (Gutenberg) list indents

1. Insert or select a List block.
2. Type your first-level list items.
3. To create an indented sub-item, place your cursor at the beginning of a list item and press Tab.
4. To move it back out, use Shift + Tab.
5. You can also click the Increase indent or Decrease indent icons in the block toolbar above the list.

Classic Editor list indents

1. Create a bullet or numbered list using the toolbar icons.
2. Place the cursor in the list item you want to indent.
3. Click the Increase indent icon to turn it into a nested list item.
4. Use Decrease indent to move it back to the previous level.

Keep list indent in WordPress accessible

• Use real list items instead of typing dashes (-) and spaces.
• Avoid adding multiple   characters to fake indents—screen readers won’t interpret them as lists.
• Check your post on mobile to make sure nested lists don’t get too narrow to read.

Step 5: Create Custom Indents with CSS (Advanced)

If you need a consistent first-line indent for all paragraphs, or a custom indent style for certain sections, CSS is the most reliable solution. This works best when you’re comfortable editing theme or site styles (and ideally using a child theme).

Add a simple first-line indent with CSS

First, create a CSS rule that applies a text-indent to certain paragraphs. You can do this from the WordPress Customizer or your theme’s Additional CSS panel.

1. In the WordPress dashboard, go to Appearance > Customize.
2. Click Additional CSS.
3. Paste the following code:

p.first-line-indent {
  text-indent: 2em;
}

4. Click Publish to save your changes.
5. In your post, switch to the editor and add the class to any paragraph you want indented:
   • Block Editor: open block settings > “Advanced” > Additional CSS class(es) and enter first-line-indent.
   • Classic Editor: switch to the Text tab and wrap the paragraph with <p class="first-line-indent">...</p>.

Indent whole sections (layout indent)

To indent an entire section, such as an example or a note, you can create a reusable class for a container block:

.content-indent-box {
  margin-left: 30px;
  padding-left: 15px;
  border-left: 3px solid #ddd;
}

Apply content-indent-box to a Group block (Block Editor) or a <div> wrapper (Classic Editor). Everything inside will appear visually indented, with a clean left border.

Step 6: Fix Common Indent Problems

Even when you follow the steps above, indents can sometimes behave strangely. Here are common issues and how to fix them.

Problem: Indent buttons are missing

• In the Classic Editor: Make sure you’ve clicked the Toolbar Toggle button to show the second row of icons.
• In the Block Editor: The indent icons only appear when you’re editing a List block, not a Paragraph block.
• Verify that you’re not using a heavily customized page builder (Elementor, WPBakery, etc.), which may hide WordPress’ native controls.

Problem: Indents look different on mobile

• If you used fixed pixel values (like padding-left: 60px;), try switching to relative units (like 2em or 5vw).
• Preview your post using the device preview options in the Block Editor (top toolbar “Preview” > “Mobile”).
• Check if your theme overrides indent styles with responsive CSS; sometimes a media query resets margins on small screens.

Problem: Indents in WordPress disappear after switching editors

• Switching between Classic Editor and Block Editor can reorganize your HTML and drop some classes.
• Whenever possible, stick to one editor for a given post or page.
• After converting content, re-check paragraphs or lists that had custom classes or manual indents.

Wrap Up: Clean Indents, Cleaner Content

Indenting in WordPress is less about hunting for a single magic button and more about choosing the right tool for what you’re trying to do. Lists use built-in nesting, the Classic Editor has traditional indent icons, and the Block Editor encourages you to think in terms of blocks and layout.

For everyday posts, you’ll usually get the best results by using list nesting for structure, block settings for simple layout indents, and a couple of well-chosen CSS classes for advanced control. Combined, these give you clean, readable content that looks good on every device without relying on messy workarounds like manual spaces.

Further Reading

• How to Edit a WordPress Website
• Beginner Checklist for Optimizing WordPress Blog Posts
• Step-by-Step Guide to On-Page SEO in WordPress
• Beginner Guide to WordPress Menus and Navigation

Frequently Asked Questions