In Horizon, Side-by-side view enables you to show more products and give a more catalog-like feel.
Side-by-side view is the default for all new leaflets, but you can of course change to Single page view if you wish.
📖 This guide explains:
What is Side-by-side view?
Side-by-side view takes two pages and places them next to each other horizontally.
This allows visitors to see more content within the same viewport. It’s ideal for product-heavy or promotional leaflets.
Here’s a comparison of the look and feel of singe page view and Side-by-side:
💡 This layout mirrors the look and feeling of a classic digital catalog, while using a vertical scroll instead of flipping.
Please note that Side-by-side view always displays:
The first page as a single page
All following pages as two-page spreads (side-by-side) on desktop
Previewing Side-by-side for your leaflet
You can easily compare single page and Side-by-side views of your leaflet directly in the Horizon Preview.
In the preview, you’ll find a toggle that allows you to switch between:
Single page view
Side-by-side view
This makes it easy to see how your content looks in both formats before publishing.
How to enable Side-by-side view for your leaflet
Side-by-side view the default for any new leaflet.
However, if you or a colleague have previously made a leaflet Singe page view, you will need to change it manually back to Side-by-side.
Do so by following the instructions below.
How to change between Side-by-side and Single page
1. Go to Aliases
2. Select the Alias used for embedding your leaflet
3. Under 'View Mode' select Single page or Side-by-side, depending on which you prefer
4. Save your changes
Once enabled, the setting will apply to all leaflets using that Alias.
Learn more about Aliases:
In the case that your leaflet was in Single page view and you changed to Side-by-side view, we recommend you to check that your webpage is indeed showing the embedded leaflet in Side-by-side mode.
If your leaflet is still showing in Single page view, even though you’ve enabled Side-by-side view, there may be a challenge with the amount of space on your webpage.
Required space on your webpage for a Side-by-side leaflet
If the container on your website is too narrow, the leaflet will automatically display in single-page mode instead.
To display spreads with Side-by-side properly, the embedded leaflet needs 1000 pixels or more of available width, but in special cases even more space may be required.
Reach out to us at support@ipaper.io if you need help or guidance.
Desktop and mobile behavior
Side-by-side view is designed for larger screens. Therefore, mobile devices will automatically show single-page view to ensure readability and usability.
Desktop: Displays two-page spreads (after the first page)
Mobile: Always displays a single page
Summary
Side-by-side view is a simple way to make the leaflet experience more catalog-like and show more products at once on desktop devices.
You can preview Single page vs. Side-by-side view of your leaflet.
The default is Side-by-side view, but if you prefer Single page, you can manually change it in the Alias.
As always, if you have any questions, we’re happy to help via chat or at support@ipaper.io.