Putting a video into a landing page

In this article, I'll explain how to place a video as a background on your landing page.

Carola avatar
Written by Carola
Updated over a week ago

Besides the fact that you can add a standard video block in your landing page, it is now also possible to put a background video in your landing page. This has the advantage that:

  • Text blocks can be placed over the video

  • Button blocks can be placed over the video

  • Your design becomes more attractive to the visitor

The big question is of course... What does this look like? Well, like this:

Step 1. Create a new landing page.

In Reloadify, go to landing pages and click on new landing page. In the example, I'm using the stroopwafel landing page. You'll get that one in front of you when you click away from the templates.

Step 2. Add a video to your row

All you have to do is drag and drop an empty row on the right under 'rows' into your newsletter, which will then look like this:

When you go to the row itself, you will see the row properties on the right. For row background video you need to move the slider to the right:

When you press 'change video', it is possible to upload a video yourself from your computer.When you use URL, you enter the URL from YouTube or Vimeo.I added a video URL, so my row now looks like this:

As you can see, the video loads in the background, while you still have a whole row before that to edit.

Step 3. Add content to your row

Now that you've added the video, it's time to add the rest. I add a title text and a button. I simply drag and drop those into the row.

Be creative. There are so many possibilities with this new video option in your landing page!

๐Ÿ’กTip: always check if your landing page scales for the mobile version. The video will scale and so will the text. Depending on how you have arranged this it is wise to always test this on different devices. This way you can be sure that all your customers see the page correctly.

Now save your landing page and you're done! Easy, right? ๐Ÿ™Œ

Did this answer your question?