--- title: Adding a video to a page or section [B12 2.0] description: Learn more about how to add a video to a section on your B12 website --- [Skip to content](https://support.b12.io/en/v2/adding-a-video-to-a-section#main-content) ![b12 logo](https://support.b12.io/hubfs/b12%20logo.svg) - [Help Center](https://support.b12.io/) - [B12 Website](https://www.b12.io/) - [AI Website Prompts](https://www.b12.io/ai-website-prompt-gallery) - [Resources](https://www.b12.io/resource-center/) - [Pricing](https://www.b12.io/pricing/) - [Log in](https://b12.io/dashboard/) Open main navigation Close main navigation - [Help Center](https://support.b12.io/) - [B12 Website](https://www.b12.io/) - [AI Website Prompts](https://www.b12.io/ai-website-prompt-gallery) - [Resources](https://www.b12.io/resource-center/) - [Pricing](https://www.b12.io/pricing/) - [Log in](https://b12.io/dashboard/) - [Start for free](https://b12.io/signup/) [Start for free](https://b12.io/signup/) How can we help? - There are no suggestions because the search field is empty. 1. [B12 Help Center](https://support.b12.io/en?hsLang=en) 2. [B12 2.0](https://support.b12.io/en/b12-2-0?hsLang=en) 3. [Website Structure and Content](https://support.b12.io/en/b12-2-0?hsLang=en#website-structure-and-content) # Adding a video to a page or section \[B12 2.0\] ## Learn more about how to add a video to a section on your B12 website. | ![](https://support.b12.io/hs-fs/hubfs/me-webp-3-webp-Apr-16-2025-02-04-51-8144-AM.webp?width=60&height=60&name=me-webp-3-webp-Apr-16-2025-02-04-51-8144-AM.webp) Written by: Madeline B. Last updated: 20 Sep., 2025 | | --- | There are a few ways to add a video to your B12 website, including an embed, creating a gallery section, or adding as a background image. Below, we outline the steps for each: ### Creating an HTML section 1\. On the left sidebar menu, select `Website` **\>** **`Pages`**. 2\. Select the page you'd like to add a video to, then select `Add Section`.  3\. From the list of sections, click `Integration` **\>** `HTML`. ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXeyMato3GwIj2wNg854pHQdGpI7VuQsEa8UXLfDtRsASCgXzu_f7VHjh2X4hBogYw3bDgDgn5vOxo03uTzLAUoaLomM2gkCLqJsW8oDcoRYgQL25-NTGgQVfpFE6iwi07tyhcD2Iw?key=jYO-AcQA-XtMf-NNZjiWfNzW) 4\. Copy and paste the video embed code into the B12 code box. **Need help getting an embed code for your video?** You can refer to [this article.](https://support.b12.io/en/adding-a-youtube-playlist-to-your-b12-website?hsLang=en) **![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXesac3zBq5bdO3IJge2Woy_zofrgQ1f15PuS6GyxXBtaKyC-GS8yqxMciyWmPI2d5euiU4c3cVmENUWa9KyIKjkU4nFK21vGPHIofnZlYluTL4M6QSTUIEN18bWdT2ruHh01ppT?key=jYO-AcQA-XtMf-NNZjiWfNzW)** 5\. Select `Add integration`. 6\. To preview how your video shows on your website, select **`Preview`** in the upper right-hand corner of your editor. 7\. To ensure these edits are live, publish your page by clicking `Publish` in the upper right-hand corner of your editor. ### Creating a video gallery section 1\. On the left sidebar menu, select `Website` **\>** **`Pages`**. 2\. Select the page you'd like to add a video to, then click `Add Section`.  3\. Select **`Gallery`**. ![](https://support.b12.io/hs-fs/hubfs/Screenshot%202025-09-20%20at%2012-46-11%E2%80%AFAM-png.png?width=250&height=495&name=Screenshot%202025-09-20%20at%2012-46-11%E2%80%AFAM-png.png) 4\. Browse through the different section layouts that will appear. Once you've selected the style of your choice, click **`Continue`**. ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-04-48-52-3959-PM.png?width=250&height=508&name=image-png-Sep-19-2025-04-48-52-3959-PM.png) **Note:** While most sections will display multiple videos, you can opt to upload only one video in the same section style if you'd like to display just one video. 5\. Add your video(s) in the left sidebar. - In the new section, scroll to **Images**. - Click `Add new gallery item`. ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-04-50-30-0066-PM.png?width=250&height=274&name=image-png-Sep-19-2025-04-50-30-0066-PM.png) - Upload your **video(s)** or select the video you would like to add from the **Library** tab, and click `Continue`once done. ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-04-52-00-4244-PM.png?width=250&height=329&name=image-png-Sep-19-2025-04-52-00-4244-PM.png) 6\. Be sure to click **`Publish`** in the upper right-hand corner of your editor to ensure your edits are live. ### Adding a video as a section background 1\. Select the section in which you'd like to change the background image or video. You can do this by selecting either the section itself or the section name on the left sidebar: ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-04-56-29-9696-PM.png?width=513&height=300&name=image-png-Sep-19-2025-04-56-29-9696-PM.png) 2\. Scroll down to the field labeled *Background media* and click `Replace`. ![](https://support.b12.io/hs-fs/hubfs/Screenshot%202024-09-25%20at%203-18-43%E2%80%AFPM-png.png?width=250&height=159&name=Screenshot%202024-09-25%20at%203-18-43%E2%80%AFPM-png.png) **Note:** To remove your current background, click the ⓧ button in the top right corner. 3\. Select an existing image or video from your library or upload your own. - **Use a video that already exists on your website**, scroll through your library, click the image you'd like to use, and then click **Continue**. ​**Note:** Videos have a small camera icon in the lower right corner. ![](https://support.b12.io/hs-fs/hubfs/Screenshot%202024-09-25%20at%203-20-50%E2%80%AFPM-png.png?width=250&height=318&name=Screenshot%202024-09-25%20at%203-20-50%E2%80%AFPM-png.png) - **To upload an image or video you own**, click `Upload media`, then select the image file from your computer, and click `Continue`**.** The maximum file upload size is 75MB. [See this article for recommended image and video formats.](https://support.b12.io/en/articles/1732956-what-image-and-video-resolution-should-i-use-for-my-website?hsLang=en) ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-05-00-40-1018-PM.png?width=250&height=333&name=image-png-Sep-19-2025-05-00-40-1018-PM.png) - **To use a stock image from B12's built-in link to Pexels**, click `Search`, search for an image by keyword, select an image, then click `Continue`. ![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-05-00-10-8662-PM.png?width=250&height=364&name=image-png-Sep-19-2025-05-00-10-8662-PM.png) - **To generate a new image using AI,** click `AI Assist`, type a short image description, then choose your preferred type and style. Click `Generate`. **![](https://support.b12.io/hs-fs/hubfs/image-png-Sep-19-2025-04-58-51-1405-PM.png?width=250&height=314&name=image-png-Sep-19-2025-04-58-51-1405-PM.png)**   - [Getting started](https://support.b12.io/en/getting-started?hsLang=en#main-content) - [Introduction](https://support.b12.io/en/getting-started?hsLang=en#introduction) - [Detailed guides](https://support.b12.io/en/getting-started?hsLang=en#detailed-guides) - [Working with B12's AI Agent](https://support.b12.io/en/working-with-b12s-ai-agent?hsLang=en#main-content) - [Agent Skills](https://support.b12.io/en/working-with-b12s-ai-agent?hsLang=en#agent-skills) - [Built-in features](https://support.b12.io/en/built-in-features?hsLang=en#main-content) - [Visual edit](https://support.b12.io/en/built-in-features?hsLang=en#visual-edit) - [Code editor](https://support.b12.io/en/built-in-features?hsLang=en#code-editor) - [Data & users (Backends)](https://support.b12.io/en/built-in-features?hsLang=en#data-users-backends) - [Forms & submissions](https://support.b12.io/en/built-in-features?hsLang=en#forms-submissions) - [Commerce](https://support.b12.io/en/built-in-features?hsLang=en#commerce) - [Contact manager](https://support.b12.io/en/built-in-features?hsLang=en#contact-manager) - [eSignatures](https://support.b12.io/en/built-in-features?hsLang=en#esignatures) - [Email Marketing](https://support.b12.io/en/built-in-features?hsLang=en#email-marketing) - [Team](https://support.b12.io/en/built-in-features?hsLang=en#team) - [Analytics](https://support.b12.io/en/built-in-features?hsLang=en#analytics) - [Website settings](https://support.b12.io/en/built-in-features?hsLang=en#website-settings) - [Adding functionality](https://support.b12.io/en/adding-functionality?hsLang=en#main-content) - [Third-party integrations](https://support.b12.io/en/adding-functionality?hsLang=en#third-party-integrations) - [Publishing & growing](https://support.b12.io/en/publishing-growing?hsLang=en#main-content) - [Domains](https://support.b12.io/en/publishing-growing?hsLang=en#domains) - [Connecting your Domain](https://support.b12.io/en/publishing-growing?hsLang=en#connecting-your-domain) - [Managing Your Domain](https://support.b12.io/en/publishing-growing?hsLang=en#managing-your-domain) - [Email Forwarding & Sending](https://support.b12.io/en/publishing-growing?hsLang=en#email-forwarding-sending) - [Growth & Marketing](https://support.b12.io/en/publishing-growing?hsLang=en#growth-marketing) - [Troubleshooting](https://support.b12.io/en/troubleshooting?hsLang=en#main-content) - [FAQs](https://support.b12.io/en/troubleshooting?hsLang=en#faqs) - [Account & billing](https://support.b12.io/en/account-billing?hsLang=en#main-content) - [Account Login & Password](https://support.b12.io/en/account-billing?hsLang=en#account-login-password) - [Subscription & Payment Information](https://support.b12.io/en/account-billing?hsLang=en#subscription-payment-information) - [Your Account](https://support.b12.io/en/account-billing?hsLang=en#your-account) - [Managing Multiple Websites](https://support.b12.io/en/account-billing?hsLang=en#managing-multiple-websites) - [Multi-user](https://support.b12.io/en/account-billing?hsLang=en#multi-user) - [Getting support](https://support.b12.io/en/getting-support?hsLang=en#main-content) - [Professional & Advanced Plan Support (B12 2.0)](https://support.b12.io/en/getting-support?hsLang=en#professional-advanced-plan-support-b12-2-0) - [B12 2.0](https://support.b12.io/en/b12-2-0?hsLang=en#main-content) - [Website Structure and Content](https://support.b12.io/en/b12-2-0?hsLang=en#website-structure-and-content) - [Website Style & Design](https://support.b12.io/en/b12-2-0?hsLang=en#website-style-design) - [Sitewide Settings](https://support.b12.io/en/b12-2-0?hsLang=en#sitewide-settings) - [Using the B12 Editor](https://support.b12.io/en/b12-2-0?hsLang=en#using-the-b12-editor) - [Analytics & SEO](https://support.b12.io/en/b12-2-0?hsLang=en#analytics-seo) - [Integrations - General](https://support.b12.io/en/b12-2-0?hsLang=en#integrations-general) - [Integrations - Communication](https://support.b12.io/en/b12-2-0?hsLang=en#integrations-communication) - [Integrations - Language](https://support.b12.io/en/b12-2-0?hsLang=en#integrations-language) - [Integrations - Ecommerce](https://support.b12.io/en/b12-2-0?hsLang=en#integrations-ecommerce) - [Professional & Advanced Plan Features](https://support.b12.io/en/b12-2-0?hsLang=en#professional-advanced-plan-features) - [Troubleshooting & Resources](https://support.b12.io/en/b12-2-0?hsLang=en#troubleshooting-resources) - [Contact Forms](https://support.b12.io/en/b12-2-0?hsLang=en#contact-forms) - [Online Scheduling](https://support.b12.io/en/b12-2-0?hsLang=en#online-scheduling) - [Advanced Editing (Experts Only)](https://support.b12.io/en/b12-2-0?hsLang=en#advanced-editing-experts-only) [![B12\_logo\_2025](https://support.b12.io/hs-fs/hubfs/B12_logo_2025.png?width=53&height=24&name=B12_logo_2025.png "B12_logo_2025")](https://www.b12.io) © 2025 B12. All rights reserved. ×