I am trying to add a video as the background for the Magento frontend. Is it possible to do it? Or would gif be a better idea, despite bigger size?

  • i think using gif file would be more convenient. If we use video then it might take time to load due to bigger in size and can impact on your site performance so i would suggest you to use gif. – Shubham Khandelwal Oct 18 '18 at 9:06
  • A .mp4 file is about 80% smaller in size than compared to a .gif of the same quality. – Vivek Ramasha Oct 18 '18 at 9:16

you can add any .gif image file in your page background and display it on frontside, so it will not take extra load time to all pages

1) copy your .gif file and paste into your custom theme at


2) copy _styles.less and styles-l.less less files from vendor/magento/theme-frontend-blank/web/css/ OR use your own if you have and paste into app/design/frontend/Custom/default/web/css/

at end of file add below css

    background: url('../images/giphy.gif');

just make sure your gif image should be here app/design/frontend/Custom/default/web/images/giphy.gif

run this command

php bin/magento setup:upgrade && php bin/magento setup:static-content:deploy -f

you will see gif image in all front pages

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.