A Quick Custom CSS Hack for WordPress Posts

Say you create a post in WordPress and want to add a little something special to it that isn’t handled by a block or your stylesheet. It might be using a different custom font on the entire post. It might even be that you need to nudge something a little bit to the right because it isn’t lined up just right. Hey, some of the default blocks in WordPress need a little CSS massaging to look good in certain contexts.

Whatever the case, you need a quick one-off style on this certain post and don’t want to bother updating your stylesheet, using the Customizer, or installing a plugin for custom CSS.

Blocks to the rescue! Just drop an HTML block at the top of the post and write your styles inside <style> tags.

Drop an HTML block in there, add <style> tags, then CSS-away!

That’s all. Now those styles can do their thing.

There we go!

Is this a great solution? Heck no. It’s total hackery. But these sorts of situations come up every now and then and this is one possible way to go about it that might just do the trick.

Handwritten by Geoff Graham on December 9, 2020

Comments

  1. # December 9, 2020

    Ooooo that’s smart I like that. There is something really clean and simple about it. We’ve had that “art direction” plugin forever on CSS-Tricks, and all it does is inject a style tag into the post. I almost wish all the posts that used it just had a block like this on them so it’s one-less-plugin to need to remember about.

    Reply
  2. # January 15, 2021

    I use to do this all the time, specially when I didn’t have proper project access :)

    Reply

Leave a Reply

Markdown supported