CODEWITHSUNDEEP
wordpresstinymce
chris
chris

Reputation: 2243

Add class to h1-tag (into formatselect) - TinyMCE / Wordpress

I would like to add a class to my "formatselect" options of the tinyMCE in Wordpress. So when selecting a h1 from the dopdown it should generate a <h1 class="blue">.

I found this Post, but can't get it to work.

Any ideas?

Thanks in advance!

Upvotes: 3

Views: 4675

Answers (1)

Thariama
Thariama

Reputation: 50840

What is described there is working even though not suitable for everyone. I'll give you a short list of what you need to do:

1. use the content_css tinmce init setting

content_css: "http://www.mydomain.com/css/content.css",

2. Create a content.css file containing your class

h1.foo {
    background-color: #F067A0;
}

3. use the styleformatting tinmce init setting

style_formats: [{
  title: 'My Foo styles'
  }, {
 title: 'Foo',
  block: 'h1',
  classes: 'foo',
  exact: true
,

4. Make sure you have the style button included (tinymce init)

theme_advanced_buttons1: "styleselect",

You should be able to select text from the h1-tag in the editor and select foo from the dropdown menu of styles. The class should be applied to your selected text.

Upvotes: 3

Related Questions