From the course: WordPress Content Blocks: Working with Themes

Unlock the full course today

Join today to access over 22,500 courses taught by industry experts or purchase this course individually.

Add styles to style variations

Add styles to style variations - WordPress Tutorial

From the course: WordPress Content Blocks: Working with Themes

Start my 1-month free trial

Add styles to style variations

- [Instructor] The new lede style variation we just added into the theme works exactly the same way all the other style variations we've talked about previously worked. If we apply the lede style variation to this paragraph up here, then publish to post, and jump to the front end, you'll see, well, right now everything looks exactly the same. But if we inspect the code, this paragraph now has the class is-style-lede applied to it. Looking back at the code we created, you'll see that this is-style-lede actually takes this name property from the registerBlockStyle method and applies it to the end of the class. So is-style, dash, and then whatever the name you apply here. That means if we want to style this particular new block, all we have to do is target is-style-lede in our CSS, and we can create a whole new style for that particular style variation, which is what I've done here. Normally, you just target is-style-lede or whatever name you apply to your style variation, but because of…

Contents