Connect your tools
      Back to home
      2. Connect your tools

      Onsite Shopify setup

      If your webshop is build on the Shopify platform, then this is how you set up your page to show Live shows directly on your webshop.

      Last updated: March 2025
      Applies to: Sprii Onsite users
      Category: Onsite

      💡 Top takeaways

      This guide provides a step-by-step walkthrough on setting up onsite streaming with Sprii, including how to customize your Live Show Player, enable the floating widget to promote your Live shows, and set up your landing page using Shopify Blocks for a seamless Live shopping experience.

       

       

      💡 Note

      If you would like to customize your landing page with HTML then check out this guide:

      How to set up Onsite live shopping

      Table of contents

      Step 1 - Customize the Live Show Player

      Step 2 - Enable the Floating Widget for Promotion

      Step 3 - Setting up your Landing Page for Live Shopping

      Step 4 - How to Build a Landing Page with Shopify Blocks

       

      Other relevant reads

      How to set up Onsite Live Shopping

      Step 1 - Customize the Live Show Player

      Personalize your Live shopping experience by customizing the player with your brand’s logo and colors.

      1. Navigate to the Onsite Plugin. 
      2. Click Live Show Player.
      3. Upload your logo, choose brand colors, and adjust additional settings as needed.

      Step 2 - Enable the Floating Widget for Promotion

      To enhance visibility and engagement, you can add a floating widget that appears before and during a Live show.

      1. Enable the Display Floating Widget option in the Onsite Plugin.
      2. Customize the widget’s appearance to align with your branding.
      3. Set how long before a Live show the widget should be displayed on your website.

      You can choose how long before a Live starts, the widget should show on your website.

      Step 3 - Setting up your Landing Page for Live Shopping.

      In the Shopify page editor, add a new block and pick apps. Here you should choose the Sprii Gallery.

       

       

      On the right-hand side, you can fine-tune your Shows Gallery block to match your needs. Here’s what you can customize:

      • Presentation – Choose between a grid or swiper layout.
      • Video Status – Filter which videos should appear in this block.
      • Tags – Display videos with specific tags from Sprii.
      • Include Expired – Option to show expired shows.
      • Sort Shows – Define the order in which shows appear.
      • Language – Select your preferred language.
      • Shows Per Page – Set how many shows should be displayed before a “Show More” button appears.
      • Some Shows Text – A dynamic message that appears when shows are visible.
      • No Shows Content – A dynamic message that appears when no shows are available.

      These options give you full control over how your Live Shopping gallery is displayed, ensuring a seamless experience for your audience!

      Step 4 - How to Build a Landing Page with Shopify Blocks

      To create an engaging and structured Live shopping page, we recommend setting up three Sprii Gallery blocks, each filtered by a different status:

      • Planned – Show upcoming Live events.
      • Live – Highlight ongoing Live sessions.
      • VOD (Video on Demand) – Feature past Live sessions for rewatching.

      By organizing your page this way, you can add custom headings for each block using Shopify’s Heading block, giving you complete flexibility to design the Live shopping experience you've envisioned.