Marcus Kazmierczak

To develop the core Gutenberg does require using Nodejs, which is based off the V8 JavaScript engine. However, you can extend the Block Editor (Gutenberg) without being required to use Nodejs.

See the Getting Started with JavaScript tutorial for more information.

You can also find other tutorials there on how to extend the Block Editor including creating your own blocks.

I hope that helps you get started.

Another user came across this same issue with a live example that I was able to troubleshoot and fix the issue.

See Github PR: https://github.com/mkaz/code-syntax-block/issues/54

I released version 1.0.1 with the update that should resolve the indentation for you.

You do not need to install any additional plugins. There are options in this plugin to override the default colors using your own scheme or one you download from Prism. I was asking to see if you had any new CSS that might be conflicting.

The HTML tag I was referring to was with regards to what CSS class to target to override the padding. What would help is if I knew the theme you are using, or just the CSS file from the child theme could help.

I tried duplicating by adding the same block you have above using the Twenty Nineteen theme and I don’t see the same result. Do you have a customized color scheme from Prism, or the default one shipped with the plugin?

The padding: 0 15px; error sounds like it might be related, but I’m not quite sure where you are seeing that in editing. Without seeing the site live, it will be difficult to troubleshoot.

If you can narrow down the conflicting rule, you can target an override for just this block using the CSS class pre.wp-block-code and it won’t effect anything else.

@fredomack, I think the spacing might be due to a conflict with a theme CSS adding a margin, or padding to one of the elements.

If you can share with me the theme you are using, or even better an example link which shows this result I can help troubleshoot.

@apetreimihaidaniel – may I ask what the conflict was? I was involved in the implementation on the core side, so wondering if there is something we can do or test to prevent a similar conflict in the future.

@kaicho are you also using Safari?

If either of you could share a screen shot of what you are seeing. Also if you can a screen shot of the console log if you see any errors there.

Info on Console Tab for Safari here: https://support.apple.com/guide/safari-developer/console-tab-dev170bfef99/11.0/mac/10.13

• This reply was modified 6 years, 2 months ago by Marcus Kazmierczak.