The Stories feature enables you to enhance your product detail pages by adding immersive, short-form video content. These stories engage customers through an Instagram-like, shoppable experience that builds product trust, educates shoppers, and increases conversion rates.
What are the Best Ways to Use Product Page Stories?
PDP Stories can feature a variety of video types that help customers make confident buying decisions. These short, mobile-friendly clips enhance the visual appeal of your PDP and help replace the need for long descriptions or extra clicks.
Recommended Content Types:
Reviews: Customer testimonials and UGC clips build trust.
Unboxing: Reveal packaging and first impressions.
How it looks: Show different angles or people using/wearing the product.
How to use: Quick usage demos or tutorials.
Product specification: Highlight key details or features visually.
Best Practices
Add Stories Above the Fold: Place them high on the page so users see them instantly.
Use 3 or More Videos: Keep users engaged by offering more than one story.
Avoid Small Sizes: Ensure your story widget is large enough to be easily tappable.
Use the Expanded Widget: This improves engagement and makes the stories more prominent.
Add Titles and Story Names: Providing context helps guide users and improves clarity.
Example: Title: “Real Customer Reviews” | Story name: “First Impressions”
Steps on how to create
Click the Publish tab.
2. Click New Project.
3. Select the PDP Stories card.
4. Click start creating.
How to Design/Customize Stories
Media tab - This is where you can control which videos you want to use in your stories, and where the settings are also located.
Under the Media tab, you will see two subsections
Don’t have tagged videos yet? Here’s a help article to help you get started Tagging videos in Tolstoy library: How to Tag Products in Tolstoy
1. Playlists
When you click the "+ Add Playlist" button, you can choose from the different playlists in your Tolstoy account, including any custom playlists you’ve created.
On this page, you’ll see a list of products. Click a product to view the images and videos tagged to it.
Hover over the media and you will see two options:
Eye icon - Lets you hide or unhide the image or videos
Pin icon - Lets you pin the videos to retain the order, sequence or arrangement of the videos
📝 Note: Need to rearrange your videos? Simply drag and drop the media and pin to retain the order.
Add Media - Lets you add more images and videos from your library
2. Settings - This is where you control how your gallery or videos behave.
Mode
PDP Mode - Only related the tagged videos will display
Non PDP Mode - All tagged videos are displayed, including those that are not related to the product.
Video Recency - Show only videos uploaded within a certain time period. This helps keep your gallery fresh with recent content.
Blacklist Playlists - Exclude videos from specific playlists. Use this if there are certain playlists you don’t want to appear in the gallery.
Design Tab - Where you can customize the appearance of your stories
Widget
Appearance & Layout
Border Radius – Adjust how rounded the corners of your videos are.
Alignment – Choose the alignment of your gallery: left, center, or right.
Motion – Select whether your gallery is static or dynamic.
Item Size – Choose between responsive (adjusts automatically) or fixed size.
Item Shape – Select rectangle or circle for your video.
Size – Adjust the overall size of your stories.
Spacing – Control the space between videos.
Borders
Border – Add a border around your videos.
Border Thickness – Adjust how thick the border is.
Border Color – Change the color of the border.
Border Type – Choose the style of the border (solid, dashed, etc.).
Opacity – Set how transparent the border is.
Video Count
Minimum Number of Videos – Set how many videos should display in your stories.
Note: If the set number can’t be reached (e.g., not enough videos available), no videos will show.
Titles & Text
Title – Add a title to your stories.
Text – Choose what text to display as the title.
Text Size – Adjust the title size.
Mobile Text Size – Adjust the title size for mobile devices.
Text Weight – Make the title text bold, light, or normal.
Text Color – Change the color of the title text.
Play Button
Play Button – Add a play button to your videos.
Size – Resize the play button.
Color – Change the color of the play button.
Background – Add a background behind the play button.
Background Color – Change the color of the background.
Border – Add a border around the play button background.
Border Color – Change the border color.
Opacity – Adjust the transparency of the border.
Story Name
Story Name – Display the name of each video in your stories.
Position – Choose to show the name below the video or as an overlay.
Text Weight – Adjust how bold the story name is.
Text Size – Change the size of the story name text.
Text Color – Change the color of the story name text.
Video Feed
Make videos shoppable - Lets viewers tap products inside the video to see details or buy.
Auto play - Starts the first video automatically when the widget loads.
View feed in fullscreen - Allows viewers to open the video feed in a full screen mode.
Auto scroll to next video - Moves to the next video automatically after one finishes.
Auto Display Video Description - Shows the video description by default.
Display creator handle - Shows the creator’s username on the video from Instagram or TikTok.
Open link to creator's profile - Makes the creator’s username clickable so viewers can visit their profile.
Always start on mute - Videos begin muted until the viewer unmutes them.
Enable video captions - Shows captions if available.
Disable multi-product view Limits the video to showing only one product card at a time.
Hide wishlist - Removes the wishlist icon from product cards.
Player position - Choose if the product card appears on the left or right of the video.
Only show sale products - Filters the feed to show only products that are on sale.
Title - Adds a title to your multi-product feed.
Divider - Adds a line to separate content sections.
Divider Title - Adds a label inside the divider.
CTA text - Lets you customize the button text, for example Shop now or View product.
Settings Tab - where you can further configure language and additional tracking
Font facing language - ability to choose or change the language of this project
Google Analytics tracking – Allows you to add a Google Tag ID so you can track this specific project in your Google Analytics and monitor its performance.
Facebook Pixel tracking – Lets you add your Facebook Pixel ID to track and measure user actions related to this specific project on your website.
Step on How to Publish your Stories
Click the Publish button
2. Enable the Tolstoy app in your App Embed inside your Shopify theme editor by clicking Open my theme
Click the Next button once you're done.
📝Note: You can skip these if you already enabled the Tolstoy app in your App embeds
3. Copy your publish ID, then click Add block
The stories block will be automatically added to your theme.
Click the stories block, then paste the publish ID. Click Save.
That's it. 🥂
