Marcus Kazmierczak

I’m not sure why identation would be stripped out. There was a bug previously with pasting of text, it might be related. The paste issue was fixed in v2.0.4 of the plugin, if you can upgrade and try again.

Let me know if the problem persists. Note: it will not auto format code for you, it should display it as you enter in.

The paste errors were fixed in version 2.0.4 of the plugin, this including formating HTML improperly.

Can you please upgrade the plugin and try again, it should be resolved now.

Additional details here: https://github.com/mkaz/code-syntax-block/releases/tag/v2.0.4

Thanks

The paste errors were fixed in 2.0.4 version of the plugin.
Details here: https://github.com/mkaz/code-syntax-block/releases/tag/v2.0.4

Code syntax block is meant only for WordPress. Assuming you mean the Prismjs code that is used to colorize the code, you should see their site for how to add: https://prismjs.com/

It is basically including the proper JS and CSS file, and using the correct tags and attributes to specify code that should be highlighted.

Did you get this resolved?

add_action is a base WordPress function, if you have an error with that missing you’ll likely have a lot more issues.

Hi @nic727,

Thanks for the suggestion, there is some overlap with the Social Links block and as you stated the share features are available in Jetpack and other plugins, which shows the feature is somewhat popular.

There is some complexity to develop and use the block, since it would need to work for both cases on the same page. For example, a user may want to link in the header or footer to their social site, but also include a share button next to all the articles. This is possible using a toggle or based on how it is used in templates.

Could you open a ticket on GitHub https://github.com/WordPress/gutenberg/issues and suggest the feature. Thanks again!

If you want to type in HTML mode, the markup would be:

<!-- wp:code -->
<pre class="wp-block-code"><code lang="csharp" class="language-csharp">
    // Your C# code here
</code></pre>
<!-- /wp:code -->

• This reply was modified 4 years, 7 months ago by Marcus Kazmierczak.

Thanks for the suggestion, I’ve added it to the back log here: https://github.com/mkaz/code-syntax-block/issues/79

For the interim, you can use the Title field to display whatever text you wish, so you could type in the language there, and also target the CSS to change as you wish.

I dislike font ligatures greatly, but it should have nothing to do with this plugin. If you set the code/monospace font to be one that supports ligatures it should work the same.

You will want to set the CSS to target the following, you’ll need to load the proper font properly.

code[class*="language-"],
pre[class*="language-"] {
  font-family: YOUR-FONT;
}

Great, glad it helped you out! ??

1. If you are using a local file for the new theme, you should use the mkaz_prism_theme_css filter, the filter with the _url is intended for use an external resource.

2. Line Numbers is a plugin to Prism, and not all themes necessarily support it. You can try adding this additional CSS to your file and see if it helps. The CSS was taken from the default theme file here:
https://github.com/mkaz/code-syntax-block/blob/master/assets/prism/prism.css#L145

pre.line-numbers {
	position: relative;
	padding-left: 3.8em;
	counter-reset: linenumber;
}

pre.line-numbers > code {
	position: relative;
}

.line-numbers .line-numbers-rows {
	position: absolute;
	pointer-events: none;
	top: 0;
	font-size: 100%;
	left: -3.8em;
	width: 3em; /* works for line-numbers below 1000 lines */
	letter-spacing: -1px;
	border-right: 0;

	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

}

.line-numbers-rows > span {
	pointer-events: none;
	display: block;
	counter-increment: linenumber;
}

.line-numbers-rows > span:before {
	content: counter(linenumber);
	color: #5C6370;
	display: block;
	padding-right: 0.8em;
	text-align: right;
}

Please feel free to replace the plugin with a different one, I do not plan to support IE. I would recommend using a more secure and standards compliant browser.

The code you have looks right, though I’m assuming the extra <code> tags included in the style portion were due to pasting in the forum.

Simplified down setting the className would look like:

const edit = ( props ) => {
    const { className } = props;

    return (
        <section className={ className }>
        </section>
    );
}

@bobbingwide The Github repository is at: https://github.com/automattic/block-experiments

The Gutenberg plugin continues development in-between core releases.

The last WordPress release (5.2) included the features of Gutenberg plugin version 5.3, this is a little confusing because the numbers happened to be so close to each other.

The next version of WordPress 5.3, releasing in a couple weeks will include the features of the Gutenberg plugin version 6.5.

The version of Gutenberg plugin included in the main WordPress release is frozen at the time of the WordPress beta starting. This gives time to make sure everything is stable and ready for a full production release.

You can continue using the Gutenberg plugin, development continues and will be the leading features for the next release.

I hope that explains the difference and answers your question.