Aliases: How to set up and best practices

In order to embed a Horizon leaflet on your website, a unique identifier is needed in the embed code.

A standard part of the embed code is the name of your account - but your account probably has more than one campaign or leaflet, so there has to be something extra in the embed code that points to a specific leaflet.

How do we make a unique identifier in the embed code?

You create an Alias.

An Alias adds an extra, unique piece of code to the embed code, which allows you to embed the right leaflet on your page, at the right time.

Here’s an example of an embed code:

<ip-embed experience="[ACCOUNT_NAME]/[ALIAS]"></ip-embed>

1. Click on ‘Aliases’ in the left side panel.

2. Click ‘+ Alias’ in the top right.

3. Give your Alias an internal name.

4. Add the slug, which will be the unique identifier.

Once filled out, a sample embed code will be displayed.

5. Choose whether the leaflet should be in single page or Side-by-side view.

Learn more about Side-by-side view here:

6. Click ‘+ Add rule´.

7. Set the time the leaflet should be active from.

8. Set the time the leaflet should be active to.

9. Select the leaflet.

Finally, click 'Update'. You will then see the rule added. When you add the Alias to the embed code, that leaflet will be displayed during the selected time frame.

Finally, click "Save" to save the Alias.

By adding more than one Rule to an Alias, you can control which leaflets are displayed when, and for how long.

You can…

All without the need to update the script on your website.

To schedule multiple leaflets on the same Alias, click "+ Add rule" to add another rule.

Then, follow the sames steps as above.

After adding the next rule, the result will look like this:

Now, there are two rules, and the transition from one leaflet to the next on the website will be instant and seamless.

This process can be repeated for as many leaflets as you have created in the Horizon admin and that should be added to a given Alias.

Add a Rule with that leaflet to the correct Alias immediately and schedule it for the time it should go live.

For example, a weekly leaflet for week 22 should go in the ‘Weekly leaflet’ Alias, or whatever corresponding nomenclature you use.

Aliases should only be created for…

If you create a new Alias for each campaign and/or leaflet, you also create extra work for…

Therefore, Aliases should not be created for every new campaign and/or leaflet you make, unless you have a very specific reason for doing so.

When you have successfully created an Alias, and hopefully scheduled more than one leaflet under that Alias, you can move on to embedding the Horizon experience on your website.

To learn how to embed a Horizon leaflet, read more in our technical documentation.

When embedding a Horizon leaflet on your website, it’ll be placed within the structure of your page and along with the elements already present on the page.

If your embedded leaflet is interfered with by other page elements or just doesn’t look right, Advanced settings for the Alias can often help you.

To access Advanced settings for Aliases, simply...

1. Click the "Advanced settings..." of the Alias.

Scroll offset is relevant when the leaflet is navigated using the arrows or clicking the section name in the leaflet navigation:

Use Scroll offset to prevent fixed elements (such as a navigation bar or header) from covering the top of your leaflet when embedded.

If your website has a sticky header, it may overlap the top of a page when the leaflet is explored via the navigation:

Adding a scroll offset ensures the page positions slightly lower in the viewport, so no content is hidden:

Reserve height ensures that the page size of the embedded leaflet are optimized to the available vertical space.

In simple terms, Reserve height is a way to control the width of the embedded leaflet, and also thereby how much is shown vertically.

For example, if products are way too big in your embedded leaflet, you can add a Reserve height.

That will decrease the width and everything will scale down, and therefore the products will become smaller.

It can also be used in case a part of a leaflet page is ‘cut off’ from the viewport:

You see? The offer at the bottom isn’t shown fully.

By setting a Reserve height, you can ensure that the entire page is shown in the viewport:

Now, the offer at the bottom is shown in the viewport.

The Reserve height calculations automatically adjust to window size, and thereby maintain a responsive and consistent viewing experience across devices.

Together, Scroll offset and Reserve height help prevent layout conflicts and ensure your embedded Horizon leaflet displays cleanly and consistently for your users.