How to loop a background video in Webflow?

How can I loop a background video ?

Don’t tell me there is another topic about it it is not, one hour I try to find an answer.

I uploaded an mp4 video with the “background video element”. It runs once and stops. Of course, everywhere people ask to stop playing the video, my problem is that I WANT A LOOP and it doesn’t work.

Thx


Here is my public share link: LINK
(how to access public share link)

The reason you’re not finding any other topics is because the background video component in Webflow always loops by itself.
Are you sure you’re using the background video component? If yes, add a read-only share link and I’m sure somebody will be able to help. How to Enable a Webflow Share Link - #18

I can’t share because of confidentiality, sure, it is just not working. I am not a beginner on Webflow - 100% I am using the BG video element, with an mp4 video. The element is inside a div block. Published or preview is the same result. : /

I just started the project so there is no special manipulation I did before. It runs once and then stops. I am just testing video and assets before continue.

Can it be the video itself?

And the video plays normal if you play it locally on your pc? Haven’t seen the video but 184kB is quite small, it could perfectly be such size but it’s hard to tell. I’d suggest trying to export it again or with different codec/settings and see what happens. This is definitely not normal behaviour.

I’ll try and come back fast. The size is because it is a 1-second video I compressed. Yes it works well on my PC.

Same and now it is an infinite encoding for 8Mb…

Does it happen with other video files or is it just that one?

Hello thx you for your answers. So it was the encoding I think. So it was something in the video. So if someone has the same issue even if everything is working but not the looping effect on the background video it is surely because of the video itself.

And I finally found the perfect export for low size video and HD with after effect.

Glad you found a solution! Feel free to share what encoding does not work, so people can find this advice in the future.

Hello,

To encode with After Effect and have HD for low size files in Webflow:

  • H264 - Framerate 24 - no audio and be sure it is mp4 (+/- 1mb/s of video) + Match source highbitrate (no custom)

For every upload on Webflow you have to change the name of the file.