Squiz Matrix DXP 5.5 & 6 Component
Introduction
This guide shows you how to install and use the Airgentic Widget (v1.2) on a Squiz Matrix website.
​
The Airgentic widget has two modes:
-
A hover widget that appears on every page across the site
-
An optional Service Hub UI that appears on selected pages only
​
You’ll use a reusable Component Template to inject the necessary script and configuration. One instance is added to your global layout to activate the hover widget site-wide. Editors can then place the Service Hub wherever needed by inserting the component on specific pages and ticking a checkbox. No metadata fields or head edits are required.
​
1. Prerequisites
​​
-
Matrix DXP version – Component Templates arrived in Matrix 6 and back-ported to late 5.5. You must be running Squiz Matrix DXP in the cloud to use this component. If you can see “Component Templates” in the asset tree you’re good.
-
Permissions – You need System Administrator or a backend user who can:
-
create assets under Design & Layout → Component Templates
-
edit the site’s Design or Paint Layout
-
edit page contents
-
-
Airgentic IDs – have your Account ID and Service ID handy.
​
2. Install the component template
Option A – Import from URL
-
Go to /_admin (Admin Mode).
-
In the asset tree, right-click Design & Layout → Component Templates → New Child → Component Template.
-
In the Details screen, choose Import manifest from URL, and copy/paste this URL:
-
Unlock & Commit; the template appears with a green “Notice” status.
-
Under Allowed Root Nodes, pick the site root so editors can see it, then change status to Live.
​
Option B – Upload the JSON file
Use the same steps as above, but click this button to download the Airgentic component:
​​
And then choose Upload manifest file and browse to airgentic_component.json. The asset now behaves like any other template — you can rename, move, or clone it.
​
3. Add the hover widget globally
We need exactly one script tag site-wide, so we’ll nest a single instance of the component into your design.
​
-
Create a hidden Standard Page called “Airgentic Global Widget” anywhere outside navigation.
-
Edit Contents → + to Add Component → choose Code (or any type).
-
Click the gear icon, find Template, pick Airgentic Widget (v1.2), fill in Account ID & Service ID, leave the checkbox unticked, Save.
-
Make the page Live.
-
Open your site Design or a global Paint Layout. At the bottom of the <body> (just before </body> is safest) add a Nest Content Design Area that points to the component asset ID of the code block you just made.
Example parse-file snippet:​
<MySource_AREA id_name="airgentic_global" design_area="nest_content"> <MySource_SET name="assetid" value="12345" /> </MySource_AREA>
-
Save & commit the design. Publish a page and view source—you should see:
​
<script id="airgentic-script" … async></script>
on every page.
​
4. Add the Service Hub to selected pages
​​​
-
Open any page in Edit Contents.
-
Press + (Add Component), pick Code (or a suitable component type).
-
In Properties, select Airgentic Widget (v1.2), fill (or paste) the same Account/Service IDs, tick “Insert <div id='airgentic'>”, Save.
-
Drag the component up or down in the components list to control where the div lands. Matrix writes components to the DOM in that order.
-
Publish. The full chat window now appears exactly where you placed the div.
​
5. Choosing the display position
​​
-
Inline: the simplest: put the component where you want the chat to render; Airgentic reads the div’s coordinates.
-
CSS override: leave the component near the end of the page and use a style rule like
​
#airgentic {position:fixed; bottom:2rem; right:2rem;}
if you want a floating launcher.
6. If you can’t see things…
​​
-
No “Component Templates” folder – you’re on an older Matrix or lack admin rights; ask a System Administrator.
-
Template doesn’t appear in the dropdown – check the template is Live and that the current page sits under an Allowed Root Node.
-
“+” button missing on Edit Contents – you likely don’t have Write permission for the asset or locks aren’t acquired.
-
Design parse file locked – need global design permission or a dev ops user to commit.
​