WordPress Admin Warnings within the Block Editor

We despatched out an e mail the opposite week that finally had a <video> within the HTML markup. We ship the publication by creating it right here within the WordPress block editor, which is fetched via RSS-to-Mailchimp. Mailchimp dutifully despatched it out, however the HTML was such that it completely borked the structure. This result in some charming completely truthful emails like this:

You truly can ship <video> in HTML e mail, however our system simply isn’t arrange for it. It requires some fancy dancing CSS (e.g. hiding it for non-supporting customers with a fallback, and detecting assist is tremendous difficult, and many others.) and HTML (e.g. ensuring the width/top attributes are small-screen pleasant). We may do it, however I don’t suppose it’s value it for the handful of instances we might wish to do it.

So as an alternative, to forestall us from doing it once more, I used (drumroll)…. CSS.

I’ve some CSS that will get loaded within the admin space solely when the block editor is loaded, which is in a performance plugin:

wp_register_style(
‘css-tricks-code-block-editor-css’,
plugins_url(‘location/of/kinds.css’, dirname( __FILE__ )),
array(‘wp-edit-blocks’),
filemtime( plugin_dir_path(__DIR__) . ‘location/of/kinds.css’)
);

I can put something I need in that CSS file and it’ll impact kinds of the block editor however nothing on the general public entrance finish of the location.

I additionally needed to scope this CSS solely to the newsletters web page. Luckily, WordPress has physique courses within the editor as effectively. Now we have a Customized Submit Kind for newsletters, and that expresses itself as a category right here:

So I chuck these kinds in:

/* Warn about movies in newsletters */
.post-type-newsletters .wp-block-video {
border: 5px stable crimson;
}
.post-type-newsletters .wp-block-video::earlier than {
content material: “WARNING: NO VIDEOS IN EMAILS”;
show: block;
coloration: crimson;
}

And growth, I’ve kinds that warn about this drawback earlier than it occurs once more:

The submit WordPress Admin Warnings within the Block Editor appeared first on CSS-Methods. You may assist CSS-Methods by being an MVP Supporter.