Hero lets you place a large featured video at the top of your homepage or landing page. It helps merchants grab attention right away, tell a stronger brand or product story above the fold, and drive clicks with text and CTA buttons. Hero works on Shopify and non-Shopify websites, but publishing a live standard website Hero requires a paid plan.
How to Set Up
In Tolstoy, go to Website → Shoppable videos → Select Hero
Upload a video from your library or from your computer. Adjust the settings you need, such as video size, video fit, auto play, loop, captions, header text, sub header text, buttons, spacing and alignment.
Refresh and see the preview to review how the Hero will look before it goes live.
How to Publish
Click Publish button in the top-right corner of the project.
If you are on a free plan, upgrade when prompted. Standard website Heroes must be on a paid plan before they can go live.
If you are publishing to Shopify and Tolstoy is not enabled yet, complete the prompt to enable the Tolstoy app before continuing.
Complete the setup guide based on your store connection:
Shopify
Copy the embed code
Add the Tolstoy Builder block to the page template where you want the Carousel to appear.
Paste the Widget code into the block settings.
Save the theme changes.
CSV or Manual Installation
Copy the widget code from the setup guide.
Paste the code into your homepage or any page where you want the Hero to appear.
Save and publish the page changes on your site.
After setup is complete, open your live site and confirm the Hero appears in the expected location.
Best Practices
Add both desktop and mobile videos so the Hero looks polished on every device.
Keep the headline, sub header, and CTA text short so the message is easy to read over video.
Place the Hero near the top of the page for maximum visibility.
Preview the Hero on desktop and mobile before sending traffic to it.
Test every button and link before publishing.
Troubleshooting / FAQs
Why is my Hero preview empty?
No video has been selected yet. If only one view looks empty, make sure you added media for that device.
Why can't I publish my Hero?
Standard website Heroes require a paid plan to publish.
Why isn't the Hero showing on my Shopify store after publishing?
Most often, the Hero block was not added to the homepage template, the Publish ID was not pasted correctly, Tolstoy was not enabled in Shopify, or the theme changes were not saved.
Can I use Hero without Shopify?
Yes. Hero also works on non-Shopify websites through the widget code option in the setup guide.
Do I need to tag products or replace PRODUCT_ID?
No. Hero is not product-reliant and uses its own Publish ID, so there is no PRODUCT_ID replacement step.
Can I create a Hero before upgrading?
Yes. You can create, edit, and prepare the Hero before upgrading, but it will not go live until publishing requirements are met.