Raw HTML Widget | Communifire Documentation

The Raw HTML widget is a flexible widget that allows you to add custom code to display any type of content that you desire. This content can be static with just 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 that you can use to provide hyperlinks to launch into your other systems. The Launchpad is built using a Raw HTML widget.

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 Communifire 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 on mobile pages go to your Page Builder  page, select Mobile Layout, drag Raw HTML widget to in the section, 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 sets the external sites your site can load resources from. If a resource comes from a site that isn't in the CSP whitelist, that resource is blocked. You can request to set CSP for your intranet.