Skip to main content

The edit CSS button has been removed from the WYSIWYG. How do I edit styles?

The edit CSS button has been removed from the WYSIWYG, how do I edit styles? Before I could just click on the button with the "edit CSS" description and edit my font.

Official response from

Update: 3/11/18

If you're interested in learning how to update text size, please feel free to check out my colleague Jane's FAQ at "How do I adjust text sizes in the new WYSIWYG editor".


Correct, the edit CSS styles button has been removed from the upgraded WYSIWYG editor. The button was removed because our team observed that HTML markup in particular, like edits to spacing, font, and custom styles often contributed to formatting issues.

The new editor uses semantic markup, which allows you to edit content in similar formats. This translates into fewer errors and fewer inconsistencies in your content so that you can truly achieve a "what you see is what you get" experience.

Regardless, if you must edit the styles of your content, there are still several tools you can leverage on the editor.

new_tinymce.png

1 Formatting: allows you to change the size of your content; also includes options for block quote and code styling.
2 Typographical emphasis: limited to bold, italics, underline and text color.
3 Alignment: left-align, center-align, and right-align attributes.
4 Bulleted or numbered lists
5 Left indent or right indent
6 Hyperlinking
7 Image editing, table editing, horizontal line
8 Undo or redo
9 Clear formatting: allows you to clear the markup or HTML inherited by other websites or content editors
10 Source code: access and edit the HTML markup of the entire content

If you must apply styles to your content beyond what's listed in the editor, we encourage you to access your content's source code (item 10) and apply your styles using inline-HTML. If you need assistance applying particular inline-HTML styles, we encourage you to explore resources like W3 Schools, which offer tutorials and examples of inline-HTML styling.

Further, while NationBuilder Support offers limited coding support, you can always reach out to help@nationbuilder for more assistance. 

Share this post

Showing 8 reactions

How would you tag this suggestion?
Please check your e-mail for a link to activate your account.