Raw HTML Widget | Communifire Documentation

The Raw HTML widget is a flexible widget that allows you to add custom code to display any content that you desire. This content can be static with HTML and CSS or dynamic using JavaScript. You can create your own widgets using HTML, CSS, and JavaScript; embed external feeds and entire pages; pull data from external data sources and display the data in the widget; and much more.

The widget Properties tab contains a code editor where you can add any HTML, CSS, and scripts.

To add a system resource, start typing under Insert resource, then click the resource. Tokens and resources are added where your blinking cursor is.

In the Roles tab, you can choose the roles that can view this widget.

Raw HTML Widget Examples

Launchpad Widget - Large 

The Launchpad is a custom widget built using a raw HTML widget. It allows you to provide hyperlinks to launch into your other systems.

Show Password Checkbox 

The Show password checkbox toggles password visibility on the login page. The checkbox uses HTML and JavaScript.

Social Media Feeds

The Raw HTML widget is also great for displaying Twitter, Facebook, and other social media feeds. These services provide you with an embed code. Copy and paste the embed code into a Raw HTML widget.

Facebook Feed 

Instagram Post 

Twitter Feed 

Axero Widget Style

You can wrap your Raw HTML content in the Axero basic widget to match the style of other widgets. Use the code below.

<div class="axero-widget">
    <div class="axero-widget-header">
        <h3>Header name</h3>
    </div>
    <div class="axero-widget-content axero-widget-content-padded">
        <p>Your content goes here</p>
    </div>
    <div class="axero-widget-footer">
        <!-- optional -->
    </div>
</div>

Result:

Mobile Raw HTML Widget

Raw HTML Widget on Mobile is available.

1. To add Raw HTML to mobile pages, go to your Page Builderpage, select Mobile Layout, drag the Raw HTML widget to the section, and then Edit Properties.

2. Enter the HTML content in the widget. Click Save.

3. The widget is now displayed in the mobile layout.

Related

Content Security Policy (CSP) 

Content Security Policy (CSP) is a security setting that controls which external sites your site can load resources from. If a resource comes from a site that isn't in the CSP whitelist, it is blocked. You can request to set CSP for your intranet.