How do I use element instead of tags in WordPress post content having webP support?

I am developing my custom theme and trying to figure out how to modify the default code for WordPress image inserted into the post content, so I could add support for webP format and have it within <picture> element. I generate .webp images using cwebp library on my server and PHP exec() while image upload … Read more

HTML5 theme support for comments + form ‘novalidate’ – how to handle it properly?

INTRODUCTION My research is based on following assumptions: WordPress version supports HTML5 Go to any admin page and inspect the resulting document. It should start with <!DOCTYPE html>. Theme supports HTML5 Inspect any front end document. It should start with <!DOCTYPE html>. Theme supports HTML5 for comments To be sure, add this to theme’s functions.php: … Read more

HTML5, WordPress and Tiny MCE issue – wrapping anchor tag around div results in funky output

[*] So I’m using HTML5 on a website and am trying to wrap a div in an anchor tag, which is supposedly acceptable in HTML5 websites. But when I do this… <a href=”#mylink”><div class=”some_class”>Some content</div></a> …through the WordPress Tiny MCE editor, I get this output: <p><a href=”#mylink”>&nbsp;</a></p> <a href=”#mylink”><div class=”some_class”>Some content</div></a> <p><a href=”#mylink”></a></p> All kinds … Read more

Why does `add_theme_support( ‘html5’, array( ‘comment-form’ )` disable client side validation?

In order to use HTML5 markup for the comment forms, I add the following code snippet to functions.php: add_theme_support( ‘html5’, array( ‘comment-form’ ) ); However, it disables client side validation on form submit and I get redirected to an error page: Now, if I remove add_theme_support( ‘html5’, array( ‘comment-form’ ) ); and submit the comment … Read more

How to change the markup WordPress inserts for post images

I am developing a theme with Underscores for WordPress. When the user adds an image using the TinyMCE editor the following code is inserted: <img class=”wp-image-45 size-full aligncenter” src=”http://example.com/wp-content/uploads/2016/06/process.png” alt=”process” width=”849″ height=”91″ /> When I look at the final page generated by WordPress, the HTML appears in the DOM <img class=”wp-image-45 size-full aligncenter” src=”http://example.com/wp-content/uploads/2016/06/process.png” alt=”process” … Read more

TinyMCE editor is breaking my beautiful HTML

This is pretty much an exact duplicate of: How to make WordPress and TinyMCE accept <a> tags wrapping block-level elements as allowed in HTML5? and HTML5, WordPress and Tiny MCE issue – wrapping anchor tag around div results in funky output My problem is that the suggested solution (tiny_mce_before_init filter) doesn’t seem to solve my … Read more

wp.media.view.ImageDetails – Save settings as HTML5 data-* attributes for image

What I finally want to achieve are extra settings added to the Image Details box, that will be stored in the image <img> tag as data-* attributes Example: <img src=”https://wordpress.stackexchange.com/questions/215979/…” data-my_setting=”https://wordpress.stackexchange.com/questions/215979/…”> MY CODE I am creating a plugin, and I need to create more settings for when you edit images. So far I have the … Read more