When clicking in a text element in the Module Builder users will be able to change the tag of the paragraph they are located.
When changed the setting to a heading it will also apply some default styles. These default styles allow users to know what they changed and make visible each heading.
These are the list of font-sizes and font-weight for each heading:
Element | Font Weight | Font Size |
Element | Font Weight | Font Size |
| (default) | (default) |
| Bold | 24px |
| Bold | 22px |
| Bold | 20px |
| Bold | 18px |
| Bold | 16px |
| Bold | 14px |
Users can change all the styles from a heading and change it to something different using the regular font-size, font-weight and any of the rest of the TinyMCE options.
Editor settings
Through Editor Settings Admins can enable Marketers to be able to change or add a heading to a text element. The option to enable/disable it is present in the TinyMCE settings.
When enabling the option users will start seeing the possibility to update the heading level also in the email builder.
Setting styles for headings
Regarding styling now users have two ways of setting the styles into the headings. Either by changing the styles of the text through the tinyMCE/Stensul styles or with CSS in proprietary styles.
Changing the styles of a heading that is applied to the text:
Selecting the text users can set a color for the entire text element with the styles settings.
If the user wants to add a the color only to the selection that is also possible with the text editor toolbar
Remember that text styles added through the toolbar can be removed by the end user since they can remove all the text.
Changing the styles with CSS in proprietary styles:
It is possible to change the headings styles by using CSS. We encourage users try to repeat as less CSS as necessary.
h1, h1 span {font-size:30px !important; color#333333 !important}
!important overwrittes any style set in the text editor, so adding this CSS will make font-size selector and color selector to not work on the heading elements of the text element, it will always respect the CSS.
Want more help?
Have no fear, your Stensul team is here! Please email us at [email protected].