Editing the HTML code in a Rich Text / HTML content item

Source code view

In addition to using the WYSIWYG (What You See Is What You Get) functionality of the Rich Text Editor, you also have the ability to view and edit the underlying HTML code. This can be helpful for power-users who want to fine tune HTML attributes, add elements, or customize styles directly.

  1. To toggle between the WYSIWYG and HTML views, click on the Source button.

Clicking the Source button

 Be careful when adding and editing HTML code

The Source view of the Rich Text Editor is best used for modifying the layout and styles of your text. For example, you could add things like <div> elements or class attributes. As you can imagine, this is a very powerful tool.

However, editing the HTML code isn't without its risks. Before making any changes, please consider the following:

  • Proofread your code before saving. Unclosed elements (e.g. an <iframe> without a closing </iframe> tag) or attributes could prevent your guide from loading correctly. 
  • Avoid embedding widgets in Rich Text/HTML content items. We strongly recommend embedding things like YouTube videos, search boxes, or other widgets using Media/Widget assets. If something in the widget's code causes issues with your page, this will allow you to edit or remove the widget by going to Content > Assets. You do not have this luxury with Rich Text/HTML content items, since they are not added to your assets library.
  • Do not add jQuery calls. If you must embed code inside of a Rich Text/HTML content item, be on the lookout for widgets that include <script> elements loading some version of the jquery.min.js file. Because LibGuides already loads jQuery on every page, loading a duplicate version will create a conflict that causes jQuery-powered elements (like page menus and tabbed boxes) from working. Be sure to remove these from your code before saving.

If you encounter issues after saving HTML code, please contact Springy Support for help restoring your guide.

Related Articles