Wordpress Illdy Jumbotron Video Background

Having an animated background for your homepage is something that a lot of people would like to do. For Content Management Systems (CMSs) like WordPress, it gets a tad more complicated as you're working within a preset frame.

Luckily, I like the idea of an animated background too.

And I like to do it easily.

But before you attempt this, you need to get the prerequisites set.

1) Get WordPress installed on your webhost.
2) Install the theme 'Illdy'
3) Upload your video that you'd like to play onto your YouTube channel.

Once you do these things, you're ready.




First, you'll need to edit the actual file.

1. Go to Editor.
2. Find Header.php (for header of the template).
3. Find the line: <header id="header"
4. Delete the 'Style' (as this sets the background Jumotron image). If will start with a <?php 
5. Copy paste this:
   <div style="position: fixed; z-index: -99; width: 100%; height: 100%">
   <iframe frameborder="0" height="100%" width="100%" src="https://www.youtube.com/embed/<strong>VID_ID</strong>=1&loop=1&controls=0&showinfo=0&autohide=1&modestbranding=1&playlist=<strong>VID_ID</strong>"></iframe
   </div>
   
   Replace 'VID_ID' with yours. You can use this as a guide for Vimeo (which works just as well).

That's it.

Just note that it squishes itself on mobile.