Instagram Journey
Instagram Journey renders a vertical, swipeable Instagram-style story on your page: a title, an optional cover image, and a list of sub-slides the visitor taps through. Use it to break a long editorial story into short, visual steps.
The module is Pagebuilder-only. There is no backend sidebar entry; you add the widget to any page.
When to use it
- Campaign micro-story — "5 things we changed this year", one slide per item.
- Product walk-through — feature per slide with image and caption.
- Mobile-first landing page — visitors scroll-swipe instead of reading a wall of text.
For a longer, scroll-based layout use the regular Pagebuilder rows. For a full slideshow across the entire viewport use the gallery or titleBanner widget.
1. Add the widget to a page
Open the Pagebuilder for the target page. Click the widget picker (plus icon on a row) and choose Instagram Journey.
The widget drops into the row with empty content.
2. Configure the cover slide
Click the widget to open the properties panel. The cover slide has three fields:
| Field | Purpose |
|---|---|
| Title | Headline on the cover slide. |
| Image | Cover image, selected from the Media Manager. Fills the slide background. |
| Text | Short intro caption shown below the title. |
Click Save.
3. Add sub-slides
Each sub-slide has its own title and image. Scroll down in the properties panel to the items section and click Add item.
Per item:
| Field | Purpose |
|---|---|
| Title | Slide title. |
| Image | Slide background. Full-bleed on mobile. |
Reorder items by dragging the handle on each row. Remove an item with the trash icon. Save the page when you are done.
Keep captions short
Instagram Journey is a mobile-first format. Short titles (under 8 words) perform best. Long paragraphs do not fit on a single slide.
4. Preview and publish
The Pagebuilder's live preview renders the journey inline. On a desktop the journey shows as a horizontal strip; on a phone it becomes a full-screen swipe stack.
Publish the page with Publish to make the journey live.
Image sizing
For crisp rendering use 1080 x 1920 px (9:16) per slide. Smaller images are scaled up; larger images are optimized server-side. Avoid text burned into the image — overlay the caption through the widget so it stays responsive and translatable.
Common issues
The cover slide is empty on mobile. The cover image field is blank. Select an image from the Media Manager and save.
Sub-slides do not appear in the preview. Save the page after adding items — the live preview only reflects saved state. Reload the preview tab.
Swipe gestures do not work on iOS. Make sure the page does not override touch-action: none in custom CSS. The widget ships with the correct CSS; custom rules on the row or column can break the gesture.
See also
- Pages & Pagebuilder — how the widget picker works
- Media Manager — uploading slide images