WYSIWYG Editor
Adding classes to tables
To apply a class to different areas of a table:
- Click the table, row, or cell where you wish to apply a class.
- Click the Format menu option, then select Formats -> Custom.
- Select the appropriate class name to apply it to your selection.
Notes:
- Not seeing any classes under the Formats -> Custom menu? This would indicate that your developers have not configured any classes for you to apply to the content in the underlying WYSIWYG Editor Configuration and you need to reach out to them to request that they configure Custom Formatting options for you.
- If you're seeing class name under the Formats -> Custom menu but they appear greyed-out/disabled, that indicates that no classes are available for the element you've selected. See the tip below for verifying that you've targeted the correct tag in the editor when attempting to apply a Custom Format.
Tip:
When making selections in the WYSIWYG editor, the status bar at the bottom of the editor will display the element path for the selected element (and its parent elements). These elements are clickable and allow for you to easily target a specific element within a table.
For example, if you need to apply a class to a table row, you must first click into a row which will select a table cell by default. In the status bar, this will appear as table » tbody » tr » td. Clicking the tr in the element path will select the table row (
When making selections in the WYSIWYG editor, the status bar at the bottom of the editor will display the element path for the selected element (and its parent elements). These elements are clickable and allow for you to easily target a specific element within a table.
For example, if you need to apply a class to a table row, you must first click into a row which will select a table cell by default. In the status bar, this will appear as table » tbody » tr » td. Clicking the tr in the element path will select the table row (
<tr>
) and allow for you to apply a class to it as opposed to the table cell (<td>
). Similarly, you can select the table element in the element path in order to target it so that you can apply a class directly to the <table>
element.