background repeated on every single page and z-index

Resolved moisea
(@moisea)

4 years, 11 months ago
Hi, I am trying to add a background image outside of the boxed area of Bloksy.
1- the svg image is showing on every single page of the site – is there a way to add different images on each page?
2- when added the image is placed behind the boxed area and cannot anywhere to change its z-index.
Thanks very much for your help.
- This topic was modified 4 years, 10 months ago by Jan Dembowski.
The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

Theme Author Creative Themes
(@creativethemeshq)

4 years, 11 months ago

Hi @moisea,
Could you please share your website url so I could take a look and understand better what did you do?
Thread Starter moisea
(@moisea)

4 years, 11 months ago
Hi @creativethemeshq –
It seems to repeat on every single page. Here it is [ redundant link removed ]. Also when I box the page the background image shows behind.
Thanks!
- This reply was modified 4 years, 11 months ago by moisea.
- This reply was modified 4 years, 10 months ago by Jan Dembowski.
Theme Author Creative Themes
(@creativethemeshq)

4 years, 11 months ago

Hey @moisea,
The link you provided is not working, please double check this.
Thread Starter moisea
(@moisea)

4 years, 11 months ago
Hi,
Sorry! [ redundant link removed ] is the link. Thanks!
- This reply was modified 4 years, 11 months ago by moisea.
- This reply was modified 4 years, 11 months ago by moisea.
- This reply was modified 4 years, 10 months ago by Jan Dembowski.
anonymized-15227681
(@anonymized-15227681)

4 years, 11 months ago
Hi @moisea

I’ve got a tip for you regarding this. I think the easiest way to manage these custom backgrounds would be with a bit of Custom CSS. This way, you’ll have peace of mind that no Gutenberg Blocks will interact badly with the background.

You can find the page ID class of every page by looking in the web inspector of your browser. It is declared in the <body> tag.

For example, for your homepage the class is .page-id-9. For About it is .page-id-11

After you’ve noted down your page ID classes, you can go into the Customizer -> Additional CSS and set the background of the page that way.
```
.page-id-9 {
background-image: url('url-to-img');
background-repeat: option;
background-position: option;
background-size: option;
}
```
You can find more about the background-image CSS attribute here — https://www.w3schools.com/cssref/pr_background-image.asp
https://www.w3schools.com/cssref/pr_background-position.asp
https://www.w3schools.com/cssref/pr_background-repeat.asp
https://www.w3schools.com/cssref/css3_pr_background-size.asp

Hope this clears it up a bit 🙂

Thanks
Thread Starter moisea
(@moisea)

4 years, 10 months ago

Thanks Eduard, Great tip! Haven’t fully tried it but seems to work. Thanks ever so much again! So grateful!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘background repeated on every single page and z-index’ is closed to new replies.