Video
To add this section, please follow below steps:
From your Shopify admin, go to Online Store -> Themes.
Find the theme that you want to edit, and then click Customize.
Click Add section and choose "Video".
Section settings
General
Section width
Select the layout width of the whole section. The options are: Default (same as the body width) Width (1170px) Width (1770px) Full Width (the 100% of the viewport width)
Background color - Background gradient
Set color (or gradient) for the section background.
Background image
Upload/Select an image as the section background.
Title
Enter in the title for the section.
Title color
Apply a color to the title.
Title font size
Specify the font size of the title.
Title font size on mobile
Specify the font size of the title on the mobile.
Title bottom margin
Determine the spacing of the title from the video.
Description
Enter the text for the description.
Description color
Apply a color to the description.
Description font size
Specify the font size of the description.
Alignment
Select the horizontal alignment of the header text to be either to the Left, Right, or Center.
Cover image
Set Cover Image for video. Note: Only show the cover image when don't use auto-play video.
Auto-play video
Toggle auto-play video.
Video height (unit %)
Set height for video.
Video height on mobile (unit %)
Set height for video on the mobile.
Video type
Select video type. There are 2 types: YouTube or vimeo MP4
A video from youtube or vimeo on desktop
Enter the youtube or vimeo link. Note: Use a youtube or vimeo link.
A video from youtube or vimeo on mobile
Enter the youtube or vimeo link on the mobile. Note: Use a youtube or vimeo link.
An MP4 video on desktop
Enter the MP4 link. Note: Use an MP4 link.
An MP4 video on mobile
Enter the MP4 link on the mobile. Note: Use an MP4 link.
Video alt text
Set alt for video. Note: Describe the video to make it accessible for customers using screen readers.
Make section full width
Play icon position
Specifies the position where the play icon is displayed. Note: The play icon only shows when don't use auto-play video.
Content
Title
Enter the title of the content on the video.
Title font size
Set the font size of the title.
Title font size on mobile
Set the font size of the title on the mobile.
Title bottom margin
Determine the spacing of the title from the description.
Title color
Apply a color to the title.
Description
Enter the description of the content on the video.
Description font size
Set the font size of the description.
Description font size on mobile
Set the font size of the description on the mobile.
Description bottom margin
Determine the spacing of the title from the description.
Description color
Apply a color to the description.
Maximum content width
Set the maximum width of the content.
Content alignment
Align the video content including the title, description, and button to the Left, Right, or Center.
Content position
Select the position of the content to be on the left, center, and right of the video.
Button
Button label
Enter the label for the button.
Link
Enter the link for the button.
Button width
Set the width of the button.
Label color
Set the label color of the button.
Border color
Set the border color of the button.
Background color
Set the background color of the button.
Background gradient
Set the background gradient of the button.
Label hover color
Set the text color of the button for the hover state.
Border hover color
Set the border color of the button for the hover state.
Background hover color
Set the background color of the button for the hover state.
Background hover gradient
Set the background gradient of the button for the hover state.
Section top padding
Desktop
Determines the height of the top inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Tablet
Determines the height of the top inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Mobile
Determines the height of the top inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Section bottom padding
Desktop
Determines the height of the bottom inner space of the section on the desktop device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Tablet
Determines the height of the bottom inner space of the section on the tablet device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Mobile
Determines the height of the bottom inner space of the section on the mobile device. Can be from 0px to 100px, increasing arithmetically of 5px (pixel).
Last updated