Video Group Widget | Page Builder (New)

_____35.png

When editing an advanced page, you can add the "Video Group Widget" to insert a Youtube or Vimeo video and adjust the video's position. 

⚠️ Before you begin:

  • The new page builder currently only supports Ultra Chic, Kingsman and Varm theme templates.
  • After creating a page using the new page builder, the page can still be displayed even if you switch to other theme templates, but it cannot be edited and the layout may be messed up. Please take note of this before publishing the page.

 

1. Add Video Group Widget

Step 1

Proceed to SHOPLINE Admin > [Online Store Design] > [Pages] and click Advanced Page/Edit to open up the Advanced Page settings page.

11.png

 

Step 2

Click the Widget button.

Screen_Shot_2022-08-01_at_4.47.14_PM.png

Step 3

Click the Video Group widget.

Screen_Shot_2022-12-16_at_6.26.34_PM.png

 

Step 4

Enter the Youtube or Vimeo video URL. You can enter a general URL or a shortened URL. You can also click on + Video to add more videos. It supports displaying up to 3 videos in a row for the desktop version.

Screen_Shot_2022-12-16_at_6.27.51_PM.png

*Note:

  • Currently does not support timestamped URLs.
  • Due to the screen size limitation on the mobile version, it only supports displaying one video in a row.

 

Step 5

Enter the video title and set the text alignment. (Left/ Middle/ Right).

Screen_Shot_2022-12-16_at_6.49.44_PM.png

 

Step 6

Then scroll down to adjust the video-related settings, you can adjust the following options (the first 3 are set disabled by default):

  • Full Screen: Adjust the video width, you can set the video as fullscreen. 
  • Auto play: After you switch on this setting, the video will autoplay when customers scroll to the location of the video.
  • Auto mute: You can set the video on mute, and it will be muted by default when playing. 
  • Video Proportions: Select the video proportions, you can select 16:9 or 4:3.
  • Padding: You can adjust the padding between the video and the page.

Screen_Shot_2022-08-01_at_5.01.09_PM.png

*Note:

  • It is recommended to use the same video proportions as when it was filmed to prevent black frames on the side.
  • According to common browser guideline (applicable to Chrome, Safari, and other browsers), the video will only autoplay with sound under the following circumstances:
      1. The viewer has previously interacted with the website (i.e., clicked on the button and switched pages).
      2. The viewer is viewing the desktop version, has previously visited the website, and played the video with the sound on.

 

Step 7

When setting up, you can click the Save button on the bottom, and a preview screen of the added video group widget will display on the right. 

Screen_Shot_2022-12-16_at_6.34.16_PM.png

 

Or click the Preview Page button on the top right to view the complete storefront preview.

Screen_Shot_2022-12-16_at_6.36.55_PM.png

 

*Note: The video group widget supports "watch on YouTube" and "full screen" buttons.

Screen_Shot_2022-12-16_at_6.40.00_PM.png

 

Step 8

Once the above is completed, click the Publish button, and customers will be able to see the added content of this page in the storefront.

Screen_Shot_2022-12-16_at_6.42.19_PM.png

 

Read more

 

 

 

 

 

Have more questions? Submit a request

Comments