WordPress editor space issue

User
WordPress admin page wp editor not creating space when press enter
Assistant
Got it—this is usually one of two things:

1) **Editor is creating new paragraphs, but there’s no visible space** (CSS reset in the editor).
2) **Editor isn’t creating “ at all** (TinyMCE/Gutenberg config changed).

Do this fast check:
– Switch to **Code editor** (Gutenberg: ⋮ > Code editor; Classic: **Text** tab).
– If you see `…` after pressing Enter → it’s **CSS**.
– If you only see “ or plain text → it’s **config**.

## Fix if it’s CSS (most common)

### A) Block Editor (Gutenberg) — block themes (e.g., Twenty Twenty-Four)
Add margins via `theme.json` (applies to editor + frontend):

{
  "version": 2,
  "styles": {
    "elements": {
      "paragraph": {
        "typography": { "lineHeight": "1.6" },
        "spacing": { "margin": { "bottom": "1.2rem" } }
      }
    }
  }
}

Or enqueue an editor-only CSS file:

**functions.php**

add_action('after_setup_theme', function () {
    add_theme_support('editor-styles');
    add_editor_style('editor-fixes.css');
});

**editor-fixes.css**

:where(.editor-styles-wrapper) p,
:where(.editor-styles-wrapper) .wp-block-paragraph {
  margin: 0 0 1.2em !important;
  line-height: 1.6;
}

### B) Classic Editor (TinyMCE)
**functions.php**

add_action('after_setup_theme', function () {
    add_editor_style('editor-fixes.css');
});

**editor-fixes.css**

#tinymce p { margin: 0 0 1.2em !important; line-height: 1.6; }
#tinymce br { display: inline; } /* in case some style hid <br> */

## Fix if it’s config (no “ inserted)

Something likely disabled paragraph creation:

**Restore TinyMCE defaults** (Classic Editor):

add_filter('tiny_mce_before_init', function ($init) {
    $init['forced_root_block'] = 'p'; // ensure paragraphs on Enter
    $init['wpautop'] = true;
    return $init;
});

**Undo autop removals** (front end rendering, optional but good to revert):

add_filter('the_content', 'wpautop', 10);
add_filter('the_excerpt', 'wpautop', 10);

## If it still misbehaves
– Look for custom code/plugins that changed editor behavior:
– Search your codebase:
– `tiny_mce_before_init`, `forced_root_block`, `wpautop`, `enqueue_block_editor_assets`
– Check any admin CSS that sets `p { margin:0 }` or `br { display:none }`.

If you tell me whether you’re on **Classic editor or Gutenberg** (and your theme), I’ll drop the exact snippet tailored to your setup.

User
When I press enter in classic editor then its not creating any space
Assistant
Got it—Classic Editor. Do this:

### 1) Force paragraphs on Enter (fixes “ issue)
Add to your theme’s `functions.php` (or a small must-use plugin):

// Make Enter create <p> (not <br>) in Classic Editor
add_filter('tiny_mce_before_init', function ($init) {
    $init['forced_root_block']  = 'p';   // default block is <p>
    $init['force_br_newlines']  = false; // don't force <br> on Enter
    $init['force_p_newlines']   = true;  // do force <p> on Enter
    $init['wpautop']            = true;  // keep auto <p> behavior
    return $init;
});

// In case something disabled wpautop on render, restore it
add_filter('the_content', 'wpautop', 10);
add_filter('the_excerpt', 'wpautop', 10);

### 2) Ensure there’s visible spacing in the editor
Add editor stylesheet:

**functions.php**

add_action('after_setup_theme', function () {
    add_editor_style('classic-editor-fixes.css');
});

**classic-editor-fixes.css**

/* Adds space between paragraphs inside TinyMCE */
#tinymce p { margin: 0 0 1.2em !important; line-height: 1.6; }
/* Safety: don’t let any admin CSS hide line breaks */
#tinymce br { display: inline; }

### 3) Quick verification
– New post → **Text** tab → type “Line 1”, press **Enter** once → type “Line 2”.
– You should see:

<p>Line 1</p>
  <p>Line 2</p>

If you still get only “, a plugin/theme is overriding settings. Search your codebase/plugins for any of:
`tiny_mce_before_init`, `forced_root_block`, `wpautop`, or plugins like “Disable Autop”. Disable that override or keep the snippet above in a must-use plugin.

User
I want to add Space when click enter in wp editor new version worpdress
User
like classic editor
Assistant
In the **new (block) editor**, Enter already creates a new **Paragraph block**—if you don’t *see* any space, your theme likely set paragraph margins or `blockGap` to `0`. Fix it like Classic Editor spacing:

### Option A — If you’re on a block/FSE theme (e.g., Twenty Twenty-Four)
Add/merge this into your child theme’s `theme.json`:

{
  "version": 2,
  "settings": {
    "spacing": {
      "blockGap": "1.2rem"   // space between blocks (applies to paragraphs too)
    }
  },
  "styles": {
    "blocks": {
      "core/paragraph": {
        "spacing": { "margin": { "bottom": "1.2rem" } },
        "typography": { "lineHeight": "1.6" }
      }
    }
  }
}

### Option B — If you’re on a classic (PHP) theme using the block editor
Add an editor stylesheet.

**functions.php**

add_action('after_setup_theme', function () {
    add_theme_support('editor-styles');
    add_editor_style('editor-fixes.css');
});

**editor-fixes.css**

/* Space between blocks inside the editor */
.editor-styles-wrapper { --wp--style--block-gap: 1.2rem; }

/* Classic-like paragraph spacing inside the editor */
.editor-styles-wrapper p,
.editor-styles-wrapper .wp-block-paragraph {
  margin: 0 0 1.2em !important;
  line-height: 1.6;
}

(If you also need it on the **front end**, add similar CSS to your theme or `theme.json`.)

### Quick checks
– Press **Enter** → should create a new paragraph with visible space.
– Press **Shift+Enter** → soft line break (no extra space), same as Classic.

If it’s still flat, some plugin/theme CSS may be zeroing margins. Search your code for `p { margin: 0 }` or `–wp–style–block-gap: 0` and override it as above.

Leave a Comment

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