How do I use the HTML Code Widget?

Modified on Tue, 2 Jul, 2024 at 2:08 PM

The HTML Code Widget allows you to run and display custom HTML, JavaScript, and CSS within a Widget on a custom page. Flexible permissions allow you to specify which User Groups will see the Widget. Since Channeltivity's Article, Rich Text, and Welcome Message Widgets restrict the types of content that can be displayed, the HTML Code Widget provides Web-savvy Admins a workaround to display any content.

This article shows you how to create an HTML Code Widget and populate it with your code (make sure to have it ready).

Step 1: Go to the Layout Editor

Go to any custom page and click the Actions button in the top right > Layout Editor.

Step 2: Select a Widget from the Menu

Scroll through the Widgets to find the HTML Code Widget or type "HTML" into the search box, then click and drag the HTML Code Widget onto the page.

Step 3: Configure the HTML Widget

Give the Widget a Title and paste your HTML code into the Content box. You can use any combination of HTML, CSS, and JavaScript and can use Placeholders to dynamically insert User and Organization fields to personalize the experience. Your code will be displayed within an iFrame, so any links should either use target="_blank" or "_top" to avoid opening the link within the frame. You'll then set the appropriate Permissions and click "Save."

NOTE: Customers with the Multi-Language Translation functionality enabled can choose to translate the Widget's content by selecting the "Translate this content" checkbox. To ensure proper translation, follow the instructions outlined in red below:

Step 4: You're Done!

That's it! Since Channeltivity can be accessed from different device types, including mobile phones, make sure your code works well across all types of devices.