Adding classes in the rich text editor

Is it possible to add a styles dropdown to the rich text editor in Shopify? I want to be able to add classes to elements and don’t see a way to do it at the moment without clicking on the Show HTML button. That’s fine for me to do, but when I hand over to the client, I don’t want them to have to edit code directly.

1 Like

There is no concept in shopify of making your own CSS styles for the rte.

A resources content , description html , has to be edited through the show-html button

https://help.shopify.com/en/manual/shopify-admin/productivity-tools/rich-text-editor#add-html-content-with-the-rich-text-editor

At this time if they really need that level of control they should be editing such content in a full fledge visual content management system Builder.io, contentful, etc. Or a page builder.

This can also indicate the theme and it’s style|brand guide is anemic and not thoroughly planned out by the business for future needs. A net affect of this can be non-designer staff end up trying to play designer to the detriment of the brand through inconsistent visual language in content.

For example if they want to add a button that should either be done using metafields, or direct settings on specific sections|blocks, or alternate template, etc.

I just want to be able to align an image left or right, which the RTE lets you do, but its implementation is poor because it does it by adding inline styles, and not by letting you attach a class that can then be made more flexible by responding to media queries.

Override the inline style attributes with the !important CSS declaration

https://stackoverflow.com/questions/16813220/how-can-i-override-inline-styles-with-external-css#:~:text=The%20only%20way%20to%20override,keyword%20beside%20the%20CSS%20rule.

A very advanced alternative is with liquid to parse out the descriptions html and strip the style attribute values from image.

Thanks for the suggestions. It’s disappointing to me though that the only solutions are to hack around sub-optimal output and that the RTE can’t be configured to output a better result in the first place.