Put different color on each section on front page

grijovnici · Member · July 10, 2018 at 7:51 pm
Copy link

Add topic to favorites
Hello!
I want to put as a background an image or a specific colour on each section of the front page. For example About us being white, Prices being orange, Gallery being white. And I want to know how can i make white boxes around the text, so that its readable on the colourful background.
Here is how i envision it: http://prntscr.com/k4w2q5
My website is: http://www.grijovnici.com

The blog I need help with is: (visible only to logged in users)
tarasdashkevych · Theme Author · July 11, 2018 at 9:03 am
Copy link
Hi,

Each section on the Front Page template has its own unique class:
* Featured Page #1 — featured-page-one
* Featured Page #2 — featured-page-two
* Featured Page #3 — featured-page-three
* Recent Blog posts — front-recent-posts
* Testimonials — testimonial-block

If you want to change background of the Featured Page #2 section, then you should use this custom CSS.

Image:
```
.homepage-widgets .featured-page-two {
     background-image: url(https://puhcheta.files.wordpress.com/2018/07/33531774_1922464381098529_7383541625026248704_o-e1531238005323.jpg);
    background-size: cover;
}
```
Color:
```
.homepage-widgets .featured-page-two {
  background-color: #aaaaaa;
}
```
If you want to change a background color of the grid items, then please use this custom CSS:
```
.homepage-widgets .featured-page-two .grid-item .hentry {
    background: #ffffff;
    padding: 20px;
}
```
Let me know if you have any other questions.

Thank you,
Taras
grijovnici · Member · July 11, 2018 at 9:59 am
Copy link
Thank you so much! <3
tarasdashkevych · Theme Author · July 14, 2018 at 11:32 am
Copy link
You are very welcome! :)

No items found.