Video Elements How to Add Video Box in Bricks Builder Using BricksFly Estimated reading: 3 minutes 47 views Video Box Element helps you create an engaging video section by combining a thumbnail, title, subtitle, and interactive play button. It also provides flexible layout and display settings, allowing you to customize the overall appearance to match your website design. Requirement Make sure you have installed: Bricks Theme BricksFly Pro Activate Video Box in BricksFly Go to your WordPress Dashboard. Click on BricksFly. Head to the Elements tab. Under Video, toggle on Video Box. Step 1: Select the Video Box Layout Style: Selects the visual layout used for the Video Box Element. Available options include Style One and Style Two. Style One: Applies the first preset design for arranging the video thumbnail, content, and play button. Style Two: Applies the second preset design with a different content and button arrangement. You can choose either style based on your page design. Alignment: Controls the horizontal position of the Video Box content, such as left, center, or right. For this example, Center is selected. Step 2: Configure the Thumbnail Type: Selects the thumbnail type or source used as the video preview. The available settings may change depending on the selected type. Image: Allows you to upload or select the image displayed as the video thumbnail. Image Size: Selects the resolution used for the thumbnail image, such as thumbnail, medium, large, or full size. Choose an appropriate size to maintain image quality without loading an unnecessarily large file. Step 3: Configure the Content Title: Sets the main heading displayed in the Video Box based on your choice. In this example, the title Explore BricksFly is added. Title HTML Tag: Selects the HTML tag used for the title, such as H2, H3, H4, or another available tag. In this example, H2 is selected, but you can choose any suitable title HTML tag based on your page structure. Sub Title: Adds supporting text displayed with the main title. It can be used to provide a short description, category, or additional information about the video. In this example, no subtitle is added. Step 4: Configure the Play Button Show Play Button: Displays or hides the video play button. Available options include Always, On Hover, and Hide. In this example, On Hover is selected. Text: Sets the text displayed with the play button, such as “Play Video” or “Watch Now.” Icon: Selects the icon displayed inside or beside the play button. In this example, no icon is added. Icon Spacing: Controls the amount of space between the button icon and its text. In this example, the default setting is used Active Ripple: Enables or disables the animated ripple effect around the play button. This effect helps make the button more noticeable. For this example, the option is enabled. Ripple Color: Sets the color of the ripple animation displayed around the play button. For this example, the option is left at its default setting. Active Spinner: Enables or disables a loading spinner when the video is opening or loading. The spinner provides visual feedback while the video content is being prepared. In this example, the option remains disabled. Step 5: Add the Video Video Link: Adds the URL of the video that opens when visitors click the play button. You can paste a supported video link, such as a YouTube or Vimeo URL. Final Result
