How do I add a webp background image to a template section? - Forum | JoomShaper
Solved Helix Framework

How do I add a webp background image to a template section?

Asked by Dmitry Goncharov 5 years ago Last activity 5 years ago

How do I add a webp background image to a template section?

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff
5 years ago · edited

Hi,
Do you mean as Background image whole Helix template. If yes, in current version of helix - you have to use custom CSS and set background image for body tag. No WebP format support yet.
Anyway very easy, beginner level.

body { 
 background-image: url("images/background.webp"); /* The image used */
  background-color: #cccccc; /* Used before image would be loaded */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

2 more replies

Oldest first Newest first Most helpful
Dmitry Goncharov Asked this
5 years ago

Clearly. I was interested in the standard solution. I hope this will be implemented in HU2. 0

Paul Frankowski Senior Staff
5 years ago

Remember that in June 2020 the support for WebP image format was added for Safari 14+ browser, but Apple does not support webp images in older Safari versions. So use this format sensibly. Not all users have iPhone/iPad from last year even in Moscow.

Log in to reply.