Inline Code is not working but Block Code is working

[guitorioadar]

I am trying to write blog and i just love this plugin. I don't want to switch to another. But i recently the inline code in this plugin is not working. But it is showing in the editor. Let me show you.

the above is the wordpress editor. It is showing the format but in the post it is not working.

<code class="EnlighterJSRAW" data-enlighter-language="java">setStudentName()</code> and <code class="EnlighterJSRAW" data-enlighter-language="java">setStudentRoll()</code>  method.

They are not showing the way it must show. It was showing the default format of the wordpress itself. But the block code is working. Please help me with it.

My wordpress theme is: oceanwp My wordpress version is: 5.2 My Enlighter theme is: Enlighter My Enlighter Default Language is: java Website: https://androvaid.com/android-mvc-example/

[AndiDittrich]

HI @guitorioadar ,

i assume you're using the "Classic Editor" and not Gutenberg ?

The inline code on your site didn't contain any of the required Enlighter attributes (you've posted them above)

Code of your paragraph

maybe there are some other code plugins active which are filtering the attributes ? Please try to disable all other plugin and another theme (e.g. one of the WordPress standard themes) on your testing site.

best regards, Andi

Working Example

Classic Editor

Result

[guitorioadar]

Here we can see that we have created constructor of the this controller which gets two parameters. One is the model and the another one is the view. As the view we are getting MainActivity. we can get data from the database of from the view and set the data to the model with the help of <code class="EnlighterJSRAW" data-enlighter-language="java">setStudentName()</code> and <code class="EnlighterJSRAW" data-enlighter-language="java">setStudentRoll()</code> method. The other two get methods will return the values from the model. This is one of the examples of Encapsulation. 

This is the editor code of this post. But after updating, is is just like as you have shown above.

In my another post: https://androvaid.com/java-class-object/

in this post enlighter is working.

The plugins that i use are

1. Akismet
2. Contact Form 7
3. Disable Gutenberg
4. Enlighter - Customizable Syntax Highlighter
5. Google Analytics Dashboard for WP (GADWP)
6. Jetpack by WordPress.com
7. Ocean Custom Sidebar
8. ocean Extra
9. Shortcode Ultimate
10. Wp-PostViewer
11. Yoast SEO

[AndiDittrich]

that's very strange because the Enlighter TinyMCE doesn't trigger any action/filter on-save/on-update therefore i assume that some filter removes the attributes.

do you edit the post as admin ? the wordpress kses filters restrict the use of some attributes but Enlighter allows this special attributes

[guitorioadar]

i always edit the posts as admin mode...

[AndiDittrich]

please try to reproduce the issue within a clean wordpress installation without any plugins and one od the default themes

[zeon77]

Hello @AndiDittrich! I have the same issue like @guitorioadar .

After some hour of researching i could reproduce the issue.

1. deactivate all plugings, but Enlighter and TinyMCE Adv.
2. nothing happens, inline code highlighting still doesn't work
3. updating post, inline code highlighting starts to work
4. activating and set up Jetpack plugin (inline code highlighting still works)
5. updating post and inline code highlighting stop working

thanks.

[AndiDittrich]

JetPack is taking over the markdown elements (i assume that your referring to markdown inline code) You can exclude inline+block codes from being processed by jetPack (Enlighter -> Extensions -> JetPack).

[zeon77]

I enabled Enlighter -> Extensions -> JetPack -> "Markdown codeblocks" setting, but nothing changed.

I think my issue is not specific to markdown.

Here is what i'm doing:

1. In TinyMCE editor i'm inserting an inline code with the "Code Insert" toolbar icon, with Language: CSS, and Mode: Inline-Code.
2. In HTML editor i see the following: <code class="EnlighterJSRAW" data-enlighter-language="css">.hello { color: white; }</code>
3. updating the post, and in the browser i see only the following: <code>.hello { color: white; }</code>
4. if i disable Jetpack (its not enough, on its own), and updating the post (without any modification), i get two element in the browser: <div class="enlighter-default enlighter-v-inline"> ... many span element inside </div> <code class="EnlighterJSRAW enlighter-origin" data-enlighter-language="css">.hello { color: white; }</code>

am i doing something wrong?

Thank you for your patience @AndiDittrich .

[AndiDittrich]

it sounds like JetPack is doing some weird things with the Enlighter codeblocks...

update+saving posts is required in case of JetPack (internal behaviour - formattings are applied onSave and not when the content is retrieved by the page)

2- this looks as expected - inline code wrapped into the EnlighterJS container 4- also correct - the generated EnlighterJS structure