Previewing your theme in Guide

Themes can be previewed from within Guide, which allows you to preview branding changes for specific page templates and as a specific role. If you are on Guide Professional, you can preview code edits by template or role.

Previewing your theme while updating branding

You can preview branding changes for specific page templates and as a specific role.

To preview your theme while editing theme branding

1. In Guide, click the Customize design icon () in the sidebar.

2. Click the Customize link on the theme you want to edit to open it.

   

   Theme on Themes page

3. If you want, make changes to colors, fonts, brand, or images.

   The home page template automatically updates when you make changes.

4. Do the following to preview other pages or roles:
   • Click Templates, then select another template you’d like to preview.
   • Click Preview role, then select another role you’d like to preview.

   

   Role preview options

   The preview will show Community, even if you disabled Community, so that you can see what Community would look like if enabled.

Previewing your theme while editing theme code

If you are on Guide Professional and Enterprise, you can preview code edits by template or role.

To preview your theme while you are editing code

1. In Guide, click the Customize design icon () in the sidebar.

2. Click the Customize link on the theme you want to edit to open it.

   If you want to edit your live theme, it’s a good idea to duplicate the theme first and edit that version. You will need to save changes before you can preview them, so it’s safer to work on a copy, then make the duplicate theme live when you’re ready.

   

   Theme on Themes page

3. Click Edit Code.

   

4. Make a code change, then click Save to save your change. You must save your changes before you can preview them.

   If you are editing a live them, you have to click Publish and make your changes live before you can preview. If you don’t want to do that, duplicate the theme first and edit that version.

5. In the code editor, click Preview.

   

   The preview opens in a new tab.

6. Navigate in the preview as you normally would to see different pages in your Help Center.

7. Do one of the following to preview a specific page template or role:
   • Click Templates, then select another template you’d like to preview.
   • Click Preview role, then select another role you’d like to preview.

8. Continue to make and save code changes, then view them in the preview tab.

   As you save changes, the preview should refresh and show your updates.

9. Click Close Preview at the top left of the preview when you are finished.