<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:taxo="http://purl.org/rss/1.0/modules/taxonomy/" version="2.0">
  <channel>
    <title>topic Re: Add a video as background in Blog, Website &amp; Page Publishing</title>
    <link>https://community.hubspot.com/t5/Blog-Website-Page-Publishing/Add-a-video-as-background/m-p/544627#M5670</link>
    <description>&lt;P&gt;Hi&amp;nbsp;&lt;a href="https://community.hubspot.com/t5/user/viewprofilepage/user-id/111531"&gt;@ialonso&lt;/a&gt;&amp;nbsp;,&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P data-unlink="true"&gt;There are some background video modules available (see these video modules in the marketplace).&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P data-unlink="true"&gt;However, personally I'd make my own custom Module for this. Basically, it can just be a kind of VideoContainer - you can expose a couple of fields (like embed codes, for different sizes) and display the videos either with a &amp;lt;video&amp;gt; tag, or an &amp;lt;iframe&amp;gt; if you want to use a third-party embed from YouTube. Note that you can't use video sources like you can for images, so if you want a different video for mobile devices, you may have to use a little JavaScript to handle dynamically determining the video file to use&amp;nbsp;.&amp;nbsp;&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;The code is fairly simple all-told - here's an example of the kind of thing from the HubSpot blog on &lt;A href="https://blog.hubspot.com/website/video-background-css" target="_blank" rel="noopener"&gt;How to Create a Video Background with CSS&lt;/A&gt;.&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;Cheers,&lt;/P&gt;
&lt;P&gt;Mike&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;---&lt;BR /&gt;&lt;BR /&gt;&lt;EM&gt;Did I answer your question? If your question is answered, please mark it as a solution. If you need more help, hit that big orange 'Reply' button!&lt;/EM&gt;&lt;/P&gt;</description>
    <pubDate>Thu, 09 Apr 2026 19:02:55 GMT</pubDate>
    <dc:creator>mike-ward</dc:creator>
    <dc:date>2026-04-09T19:02:55Z</dc:date>
    <item>
      <title>Add a video as background</title>
      <link>https://community.hubspot.com/t5/Blog-Website-Page-Publishing/Add-a-video-as-background/m-p/544262#M5665</link>
      <description>&lt;P&gt;Hello,&lt;/P&gt;&lt;P&gt;I want to show a 2-3 seconds video and later cover it with 2 cards that will set the action.&lt;/P&gt;&lt;P&gt;These cards have an animation triggered after the video has shown everything it needs to show.&lt;/P&gt;&lt;P&gt;Currently, I am using a GIF, as it's the only I can put it in the background, does anybody know how I could put a video instead?&lt;/P&gt;&lt;P&gt;Here is the &lt;A href="https://www.shakersworks.com/home-0?hs_preview=EsVptJxO-62150780810" target="_blank" rel="noopener"&gt;example of what I've built so far with the GIF&lt;/A&gt;&lt;/P&gt;&lt;P&gt;Also, would it be possible to change the video for mobile with a smart rule or something? So it shows a vertical video on a mobile device?&lt;/P&gt;&lt;P&gt;Thanks a lot!&amp;nbsp;&lt;/P&gt;</description>
      <pubDate>Fri, 17 Dec 2021 18:02:56 GMT</pubDate>
      <guid>https://community.hubspot.com/t5/Blog-Website-Page-Publishing/Add-a-video-as-background/m-p/544262#M5665</guid>
      <dc:creator>ialonso</dc:creator>
      <dc:date>2021-12-17T18:02:56Z</dc:date>
    </item>
    <item>
      <title>Re: Add a video as background</title>
      <link>https://community.hubspot.com/t5/Blog-Website-Page-Publishing/Add-a-video-as-background/m-p/544627#M5670</link>
      <description>&lt;P&gt;Hi&amp;nbsp;&lt;a href="https://community.hubspot.com/t5/user/viewprofilepage/user-id/111531"&gt;@ialonso&lt;/a&gt;&amp;nbsp;,&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P data-unlink="true"&gt;There are some background video modules available (see these video modules in the marketplace).&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P data-unlink="true"&gt;However, personally I'd make my own custom Module for this. Basically, it can just be a kind of VideoContainer - you can expose a couple of fields (like embed codes, for different sizes) and display the videos either with a &amp;lt;video&amp;gt; tag, or an &amp;lt;iframe&amp;gt; if you want to use a third-party embed from YouTube. Note that you can't use video sources like you can for images, so if you want a different video for mobile devices, you may have to use a little JavaScript to handle dynamically determining the video file to use&amp;nbsp;.&amp;nbsp;&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;The code is fairly simple all-told - here's an example of the kind of thing from the HubSpot blog on &lt;A href="https://blog.hubspot.com/website/video-background-css" target="_blank" rel="noopener"&gt;How to Create a Video Background with CSS&lt;/A&gt;.&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;Cheers,&lt;/P&gt;
&lt;P&gt;Mike&lt;/P&gt;
&lt;P&gt;&amp;nbsp;&lt;/P&gt;
&lt;P&gt;---&lt;BR /&gt;&lt;BR /&gt;&lt;EM&gt;Did I answer your question? If your question is answered, please mark it as a solution. If you need more help, hit that big orange 'Reply' button!&lt;/EM&gt;&lt;/P&gt;</description>
      <pubDate>Thu, 09 Apr 2026 19:02:55 GMT</pubDate>
      <guid>https://community.hubspot.com/t5/Blog-Website-Page-Publishing/Add-a-video-as-background/m-p/544627#M5670</guid>
      <dc:creator>mike-ward</dc:creator>
      <dc:date>2026-04-09T19:02:55Z</dc:date>
    </item>
  </channel>
</rss>

