Why does WordPress remove my code element's class attribute? - wordpress

I have written the following HTML into the text editor of a WordPress post:
<code class="language-javascript">jsonFile.image</code>
When I preview the page, I get this:
<code>jsonFile.image</code>
I have other blocks like this one:
<pre class="line-numbers"><code class="language-json">{
"image": "image.jpg",
"_image_comment": "This image should not be displayed"
}</code></pre>
These are left intact when the post is previewed.
Is this happening because of my theme, or is this something WordPress Core is doing?

The markdown feature of the Jetpack plugin was causing the classes to be dropped when I saved the post. Not clear why it was affecting some and not others, but it was definitely the issue.

Related

Wordpress - Something Mysteriously Adding a <br> after body tag

I have a wordpress site where there is a <br> appearing right after the first body tag that's causing the entire site to have a line space at the top of the page.
I manually looked at the header.php code and there is nothing between the body tag and the opening Google Tag Manager comment. When loading the site, however, something is inserting application/ld+json script code for SEO and I'm assuming along with the <br>, so my suspicion is it's caused by the Yoast SEO plugin. I'm trying to look at the plugin files for code where it's inserting this script code, but I can't seem to find anything.
This is what the header.php code looks like when editting it in the Wordpress editor:
This is what the header.php code looks like after loading the Wordpress site in a browser:
Does anyone have any clue why or where the is being inserted from?
Thanks!
Just as I posted this question, I found the ld+json script code above the body tag code in header.php that had a <br/> before it. I removed it and it fixed the issue.

Edit posted sourcecode on wordpress not working

I've a wordpress blog directly hosted from wordpress and I use the [code] tags to post sourcecode on wordpress, that works fine so far.
Thats the original code tag I posted
[code language="xml"]
<TypeScriptTarget>ES5</TypeScriptTarget>
[/code]
But when I try to edit my posts with contained sourcecode it looks like this
and when I update my post the same not encoded symbols are shown on my blogpost too. Id don't know what I am doing wrong here.
First, you want to make sure the Visual Mode in WordPress is disabled, and only use Text Mode.
Users > Your Profile
Then you don't need to use a WordPress shortcode for adding a preformatted code block.
Check out the WordPress Codex Writing Code in Your Posts page:
https://codex.wordpress.org/Writing_Code_in_Your_Posts
Just use the HTML <pre> and <code> HTML tags:
<pre><code>
<TypeScriptTarget>ES5</TypeScriptTarget>
</pre></code>
You will notice I am using the HTML entity for the greater and less than symbols so they render correctly on the front-end of WordPress.
< = <
> = >
Resource links to the <pre> and <code> elements:
<pre> tag: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pre
code tag: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/code

Test WordPress TinyMCE with Codeception

I am trying to add content in a WordPress post type with an acceptance test in Codeception.
I tried several things but I can not make to work.
For example. I would like to add content in a Post or Page or Product. The main content is the iframe with TinyMCE in WordPress.
The best solution I found until now is this but it is not working on WordPress :
$I->switchToIFrame('#content_ifr');
$I->executeJS('document.getElementById("tinymce").innerHTML = "<p>Test content</p>";');
Have you got any idea how to implement this?
If anyone need to add content in the tinymce editor in WordPress with Codeception the solution is this :
$I->click('#content-html');
$I->fillField('#content', 'Test Content');
With the 1st command we change the tinymce tab to html and with the 2nd one we can add the content we like inside.
Hope this helps!

WordPress Editor Image for Shortcode

Quick question about WordPress. I've been Googling all over the place and cannot find an answer.
Basically I'm looking to replicate what happens when you add a gallery: have an image displayed as a stand in for the gallery shortcode [gallery]. The shortcode's visible when you go to edit HTML.
I'd like to exactly copy this effect: When a shortcode inserted into the editor I'd like for to to be rendered as an image.
Things I've Tried:
Inserting an element (image, div, I found an input is pretty unfuckwithable, etc) that's wrapped by a shortcode (This works ok, not great. The short code's still visible and WP will auto add paragraphs to the element to create space that users could, possibly, add content that'll be eaten by the short code) -
Inerting the short code as a < !-- --> comment (This also doesn't work great, WP will occassionally eat it moving between Visual/HTML. The comments ALSO eat your content < !-- [shortcode]--> placeholder < !--[/shortcode] --> = < !-- rendered shortcode -->)
That's the extent that I've thought of things. I cannot find a guide on how to do mimic the [gallery]'s behavior and can't find it by going through wp-admin's guts.
Thanks!
Alright, found the answer thanks to Dan's hint. Here's how to do it:
First (as Dan suggested) take a look at how they add the Gallery plugin to Tiny MCE. There's actually an uncompressed js file that will give you the overview you need, find it in:
/wp-includes/js/tinymce/plugins/wpgallery/editor_plugin.dev.js
This goes over the basics on adding this type of plugin to TinyMCE (more info here). To get WP to load the .js file with your TinyMCE plugin, see this helpful guide.
Basically here's the code:
if ( get_user_option('rich_editing') == 'true') {
add_filter("mce_external_plugins", "add_jolokia_tinymce_plugin");
//Applying the filter if you're using the rich text editor
}
function add_jolokia_tinymce_plugin($plugin_array) {
$plugin_array['example'] = '/path/to/example.js';
return $plugin_array;
}
Add this to a plugin or function.php in a theme And you're good!

how can I post html content to wordpress with xmlrpc?

I've got a script to post some data to wordpress using xmlrpc.
If I use a simple string for the body like "This is a test" it works fine.
However, if it has any HTML formatting in it, it gets horribly mangled when trying to add the post.
How do I post html content to wordpress with xmlrpc?
Here's a plugin that fixes a problem with some versions of an xml library that strips html: Plugin – LibXML2 Fix | Joseph Scott

Resources