The Advanced Video Block in Frontis lets you add videos to your page with more design and playback options. You can customize things like size, borders, autoplay, and even add overlays like text or images.

Adding Frontis Feature List Block 

To insert the advanced video block, navigate to the post or page where you wish to include it. Next, tap the (+) plus icon located at the upper left corner of the display

The Frontis menu bar interface will appear for you. Search for Advanced Video Block in the search box or select it from the menu bar.

After inserting the Advanced Video  blocks, follow the steps below;

• Click on the Document Overview button, and you will be able to see the blocks list view on the right side.
• Click on the block; all the control tabs will show here (Basic, Style, Extra).

Basic section

1. URL: The URL feature in the Advanced video block allows you to set a specific link for the video. 
2. Video option: This section gives you some toggles to enable or disable the video features.
3. Autoplay: Autoplay in the video block means the video will start playing automatically as soon as the page loads
4. Mute: ​The Mute option in the Frontis Advanced Video block lets you start your video with the sound turned off. This is especially helpful when using autoplay.
5. Loop: The Loop option makes your video play again and again without stopping. Once it ends, it starts over automatically. 
6. Show controls: The Show Controls option lets you show or hide video buttons like play, pause, and volume. Turn it on to let viewers control the video.
7. Image Overlay: To add an image overlay to your video, simply enable the image overlay option. This feature allows you to upload an image and optionally include a play icon.

Style Section

Width: This feature lets you customize the video width according to your work’s needs.

Border: This option lets you add a border around the video area and customize border color, border style (solid, dashed, dotted, double, groove, outset, and ridge), and border radius. To remove the border, simply choose the ‘None’ option.

Play Icon: You can customize the icon size, icon color, and background color of the play icon. You can also add a border around the play icon area and customize border color, border style, and border radius. 

Extra Section

Z-Index: Consider the z-index as layers of sheets on a table. The greater the z-index, the more “above” the element appears. Therefore, if two elements intersect, the one with the greater z-index will be displayed in front.

However, it functions only when the element is positioned (relative, absolute, fixed, or sticky). Without it, z-index has no effect. 

Overflow section: The Overflow feature in the Advanced section of Frontis Blocks controls how extra content behaves when it goes beyond the block’s size. The overflow property determines the action to take in this scenario.

Values of overflow:

• Visible:- The visible overflow value shows all content, even if it goes outside the box. It won’t be hidden or cut off, and no scrollbars will appear. 
• Hidden: The hidden overflow value hides any content that goes outside the box. It gets cut off, and no scrollbars appear, so users can’t see the extra content.
• Scroll: The scroll overflow value always shows scrollbars. If the content is too big, you can scroll to see it. Even if there’s no extra content, scrollbars still appear.
• Auto: The auto overflow value adds scrollbars only when needed. If the content fits inside the box, no scrollbars show. If it overflows, scrollbars appear automatically.
• Clip: The clip overflow value hides any content that overflows the box without showing scrollbars. The extra content is simply cut off and cannot be seen or scrolled.

Padding: Padding allows you to add spaces around an object to increase the inner area. You can also add space on a single side with this feature. Click on the Link icon and add or reduce the padding on any side you want.

Margin: Margin enables the adjustment of an object’s placement on the canvas. With this feature, you can add a margin around an object or a single side. Click on the Link icon and add or reduce the Margin on any side you want.

Border and Shadow: You can place a border around the entire area and adjust the border color and border radius. This option allows you to apply a box shadow to the advanced video.

Responsive Control: In this section, you will get 3 switches (Hide on Desktop, Hide on Tablet, Hide on Mobile). These switches allow you to show or hide the section on various devices.

Custom CSS: If you are an expert or have coding knowledge, you can add custom CSS in this section to make it responsive.