How to add background image on Blog Page?

To add a background image on the blog page, you can follow these

#1. First, use this tool to find the Blog Page ID. In my example, we have:

#collection-6677756d03a4f15ba27ce9d8

How To Add Background Image On Blog Page 01 Min

#2. Use this code to Custom CSS box. Replace Pixabay with your desired image URL.

#collection-6677756d03a4f15ba27ce9d8 {
& {
    background-image: url(https://cdn.pixabay.com/photo/2024/08/05/21/19/lion-8947711_1280.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.section-background, .section-border {
    background-color: transparent !important;
}}

How To Add Background Image On Blog Page 02 Min

#3. Some notes

With background-repeat you can enter: no-repeat, repeat-x or repeat-y
With background-size you can enter cover, contain or fixed size (30px, 100px,..)
With background-position you can enter: center, top, left, right or center center, top left, center left, center right,…