Add a style selector to the WordPress Post Editor

The toolbar (known as the kitchen sink – don’t ask me why!) is where you can style your post by assigning heading tags, creating lists, aligning text and lots more. You can also assign your own styles by adding classes to text. Add the following function to your theme’s functions.php file and add as many css selectors as you like. I’ve added “Intro” and “Link style” to this example. You need to add the title i.e. Link style and then css class i.e. linkstyle.

You can then find this new dropdown selector in your kitchen sink with the dropdown name of “Styles”. All you then need to do is select the text you wish to style and choose the selector from the dropdown. The text isn’t styled in the editor but will be on your site, assuming you’ve added a style to that class in your theme’s stylesheet.

Another useful little function to add is this:

This will then show the kitchen sync to add admin users. For some reason the second row in the kitchen sink is not shown by default, which is odd as this is where the most useful selectors are.

  • Victor Bonilla

    Thanks, it works fine!