--- url: 'https://dxpr.com/hc/documentation/learn-dxpr-builder/elements/video-local' title: 'Adding a Local Video | DXPR' author: name: docs-sync url: 'https://dxpr.com/users/docs-sync' date: '2026-10-23T14:31:17+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'Self-hosted MP4 video' tags: - 'Text and media' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-23T14:31:17+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Adding a Local Video' description: 'Self-hosted MP4 video' image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-23T14:31:17+0000' dateModified: '2026-10-23T14:31:17+0000' author: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' mainEntityOfPage: 'https://dxpr.com/hc/documentation/learn-dxpr-builder/elements/video-local' articleSection: 'Text and media' - '@type': WebPage '@id': 'https://dxpr.com/hc/documentation/learn-dxpr-builder/elements/video-local' description: 'Self-hosted MP4 video' breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: Home item: 'https://dxpr.com/' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: en --- [Help Center](/hc)/[Documentation](/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Add content](/hc/documentation/learn-dxpr-builder/elements) /[Text and media](/hc/documentation/learn-dxpr-builder/elements/text-and-media) # Adding a Local Video. Self-hosted MP4 video Learn DXPR BuilderBuild pagesAdd contentText and media ## In this guide Related guides - [Style tab](/hc/documentation/learn-dxpr-builder/element-settings/style-tab) You get a video file from your own media library, played by the browser with no YouTube or Vimeo embed. Use it for product demos, short loops or sites that block outside players. ## Add a local video Open your page while logged in: the builder controls appear when you hover the content area. [Your first page](/hc/documentation/learn-dxpr-builder/getting-started/first-page) shows the basics. 1. Hover the column and click **+** in its control bar, or click **Add Elements** on an empty page. Open the **Content** tab and click **Local video**. It lands at the top of the column and its settings dialog opens. 2. Under **Video**, click **Select video** and pick a file in the media browser. 3. Choose whether to use **Start playing automatically**. It is off by default. Here it is on, which also mutes the clip. 4. Choose whether to show **Controls**. They are off by default. Here they are on, for play, pause and volume. 5. Choose whether to **Loop** the clip. It is off by default. Here it is on, so the clip repeats. 6. Click **Save** in the dialog. Then click **Save** in the toolbar at the top of the content area to store the page. ## What you see Your clip plays in the column at full width. In the video, it starts on its own without sound, shows the browser's controls and repeats when it ends. Autoplay already runs in the editor, but check it again on the saved page. Visitors see it once you save the page and it is published. ## Set up your local video Hover the element and open **More > Settings** in its control bar. Options: - **Video:** the file to play: MP4, WEBM, OGG or OGV. The field shows the largest file your site accepts. Click Select video to pick one. On sites without a media browser, the same button uploads a file from your computer. - **Start playing automatically:** plays the video as soon as the page loads. It also mutes the sound, because browsers block autoplay with sound. - **Muted:** plays the video without sound. It appears only while Start playing automatically is off, because autoplay always mutes. - **Controls:** shows the browser's play, pause, volume and progress controls. - **Loop:** starts the video again when it ends. - **Video width:** a CSS width such as `100%` or `800px`. The default is `100%`. - **Image:** a poster image shown before the video starts. ## If you don't see it - **Local video is not in the Content tab.** Your user profile hides it. Ask an administrator to enable it in [User Profiles](/hc/documentation/learn-dxpr-builder/admin/user-profiles-admin). - **It is gone after you reload.** The page was not saved. Add it again and click **Save** in the toolbar at the top of the content area. - **The player shows a black rectangle with no content.** No video file is selected. Hover the element and open **More > Settings**, then select a file under **Video**. - **The player stays black although you selected a file.** The browser cannot play the file's codec. Re-export it as an H.264 MP4 and select it again. - **The video plays without sound.** **Start playing automatically** always mutes the video, because browsers block autoplay with sound. If visitors need the audio, leave it and **Muted** off, and keep **Controls** on so they can press play. ## What's next? [Style tab](/hc/documentation/learn-dxpr-builder/element-settings/style-tab) to add spacing or a background behind your video.