Elements used for inline embedded are known as widgets within the Embedery platform.

This section is more intended for anyone who has worked with HTML before, you will need this knowledge to embed these types of elements

To embed a widget into your website, you can add the following code to your webpages.

<embedery-widget widget-id="your-widget-id"></embedery-widget>

For this to work, please ensure you also have Embedery installed into your website.

Finding the widget id

To find your widget id, you can copy the id from the URL as shown in the image above. In the above case, the widget id is SzjWkZdPCPYb9iQ0FfwA

So if we wanted to embed this widget into our website, the HTML code would look like:

<embedery-widget widget-id="SzjWkZdPCPYb9iQ0FfwA"></embedery-widget>

How they work with goals

Widgets are quite advanced elements that we provide, they can be conditionally shown depending on your goal. For your widget to work inside a goal, you'll need to use a widget region, this will be explained more in the future.

Widget regions

Widget regions are a simple way to show your widgets in your website.

In case you dont know, a widget is a special element we have that will appear inline with your content in your website. The widget region is how you embed these widgets into your website.

A region is best suited in your website sidebar or in a shared area throughout your pages.

How it works with goals?

Goals are used to help encourage your visitors to help your achieve your business goals, with a widget region, depending on the stage action of the goal, the widget region can change the shown widget.

So if you want to drive more visitors to your Twitter account for example, the stage action may decide to display a button to your Twitter account inside your widget region. Once the widget in the region has been interacted with, the region may change back to its default widget.

How do I install a widget region?

So to install a widget region you may need some basic techincal skills on how HTML works.

But its quite straight forward.

Simply add the following HTML code to your webpage:

<embedery-region region-id="region-uuid"></embedery-region>

And thats it. Just ensure the region-uuid is replaced with the actual region identifier shown in the Embedery admin.