Skip to content

How to add "just code" in Gutenberg? #79

Description

@paschott

When using the Gutenberg editor, putting in a shortcode for gistpress results in an HTML-formatted short-code. That results in large amounts of whitespace in the embedded Gist.

Expected Behavior

Typing or pasting in a gistpress shortcode should result in just the code block being embedded in the HTML.

Current Behavior

When we type/paste a gistpress shortcode in Gutenberg, the editor picks up that shortcode and wraps it in a Code block and in HTML formatting. Stripping that away behind the scenes in the HTML editor results in the gist code displaying properly. Not editing it and leaving it as Gutenberg formats it results in a lot of extra whitespace before/after the gist code.

Possible Solution

Right now, I have to hit the HTML code and manually edit my gistpress block to the same code I entered, removing all other tags Gutenberg surrounded it with except the

tag. That results in correctly formatted code.

Steps to Reproduce (for bugs)

  1. Use Gutenberg editor
  2. Type or paste in a GistPress shortcode.
  3. Examine the HTML behind the scenes - note the extra formatting codes Gutenberg entered
  4. Preview the blog post. Note the extra lines generated
  5. Edit the HTML to include just the GistPress shortcode without any formatting or code blocks
  6. Preview again - no extra lines for the gist. It displays as expected.

Context

Slows down adding Gist links using GistPress because I have to strip out the extra formatting.

Your Environment

  • Version used: latest release on Github
  • Wordpress v5.6, Gutenberg v9.7.3

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions