Focus items allow you to engage users on your site through bars, modals, notifications and full page takeovers. These can be initiated at different times and with different actions such as exit intent.
Focus Items are listed under the Channels menu.
When creating a focus item, you'll see that there is a place to enter a website. The snapshot feature is currently non-functional.
This is currently integrated into a service offered by mautic.com to generate a snapshot of the given website to use a preview when building the focus item. If the website is a very complex website - the snapshot may not work. Note that this feature may change in the future.
After entering the website, click the builder button top right. This is where the magic happens.
Notice that you should have a snapshot of the website. If not, you'll have the option to fetch it. Again note that some complex websites may not be snapshot-able.
On the left, you'll see a button to switch between mobile and desktop views. A mobile snapshot is also attempted - it may not match your website exactly due to the snapshot process but it should at least give you the general look. On the right is the builder toolbar.
The first step to building the focus item is to choose what the focus or goal is. There are three options:
Each focus/goal will have slightly different settings but all have a few in common:
Visitor intends to leaveis chosen, an option appears that allows configuration if links within the site should trigger the engagement or not.
There are four styles supported -
Each style has its own settings such as position, size, sticky, etc.
By default, Mautic will determine the top colors extracted from the snapshot. Four colors are currently supported for primary color, text color, button color, and button text color.
Again this will vary based on the selected focus/goal and style is chosen. Some support a headline and a tagline while some support only a headline due to space constraints. If the goal is to collect data, a list of forms will be available to choose from. Remember that the form should be simple.
A new section called ‘content’ has been added to the builder for focus items that enables you to format content in basic, editor or html mode. This opens the door for even more creativity when engaging visitors to your site.
Inserting a focus item into a website is as simple as copying one line of code and inserting it into your page's source. After creating the focus item, view its details page where you can see engagement graphs and other detailed information. On the right, you'll see a "Focus Installation" box that includes the line of code needed. Click on it, copy, then paste it into your website's source before the closing body tag if possible.
Focus Items action depends on page visits. That means, you have add it just after Visits a page decision.
Found errors? Think you can improve this documentation? Prefer code to UI? edit this page on Github