Spotlight
Overview
Learn when to use the Spotlight Layout – a single-focus, immersive experience for shoppable videos on your Shopify storefront.
Spotlight Layout
The spotlight layout is great for a single focus, immersive experience with customized background and larger video frames. Novel customers tend to find the spotlight layout most effective when highlighting specific content, features, or special promotions with high visual impact.
Single-Focus Immersion
The Spotlight Layout in Novel is designed to focus on a single video at a time. This approach reduces distractions and draws attention to the featured content.
This immersive experience allows brands to present their products more effectively, capturing the audience's attention and encouraging them to take action.
Spotlight User Experience
Viewport | Appearance | Visibility | Interaction |
|---|---|---|---|
Desktop | Single rectangular video covering most of the viewport with headline text overlay and customizable button. | Full viewport when viewed. | Clickable button for further action. |
Mobile | Single rectangular video in full screen with headline text overlay and customizable button. | Full viewport when viewed. | Swipe up/down for navigation; tappable button for further action. |
Customize Sidebar: Spotlight
Please note that in an effort to ensure that your Novel embeds are optimized for performance across all devices, mobile and desktop, the ability to modify sizing is restricted. There is often flexibility to modify sizing of your Novel embeds within your page layouts within Shopify. Please view our video sizing issues guide for more information.
Attribute | Values/Options | Description |
|---|---|---|
Headline | Text Field | Customizable headline text overlay on the video. |
Typography | Match Shopify Theme, Google Fonts | Option to use Shopify theme's font or select a Google Font. |
Font Weight | Thin, Extra Light, Light, Normal, Medium, Semi Bold, Bold, Extra Bold, Black | The weight of the font used for the headline. |
Text Align | Left align, Right align, Center align | Text alignment (left, right, centered) |
Text Position | Top align, Bottom Align, Center align | Text alignment (top, bottom, centered) |
Headline Color | Hex value e.g., #000000 | Color used for the headline text. |
Background Color | Hex value e.g., #1a440a | Sets background color behind the video. |
Brand Color | Hex value e.g., #304c34 | Sets the primary brand color for highlight elements. |
Border Radius | Numeric value | Sets the corner radius of the video edges. |
Button Shape | Round, Square, Play | Shape of the action button overlay on the video. |
Button Text | Text Field | Customizable call-to-action text on the button. |
Background Image | Upload Field | Option to upload a background image (supports .gif, .jpg, .png). |
Advanced Customization | Text Field | Input any CSS for advanced customization. |
Other Layouts
If you are interested in trying other layouts, view our dedicated guides:
Frequently Asked Questions
You can achieve the equivalent functionality of changing appearance of changing your journey by duplicating and changing layout. To do so, click the three dots next to the specific journey under Journeys, click Duplicate, and then select the specific layout you want within the Duplicate as modal.
Learn more about this process via our change layout guide.
Yes, you have the ability to do so, though that requires you embedding asset and then populating content around it within the Shopify admin interface.
No, unfortunately this is not possible at this time.
Yes, you have the ability to upload an image, after clicking Preview within the Customize Theme sidebar when editing a spotlight video in the studio.
By design, the spotlight layout's button placement is only available to be placed in the center, based on user testing to optimize click-through rates and conversion.