Add these codes to the Custom CSS box and Save
All Pages
/* Page Gradient - All Pages */
body {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
Desktop Only
/* Desktop Only */
@media screen and (min-width:768px) {
body {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}}
Mobile Only
/* Mobile Only */
@media screen and (max-width:767px) {
body {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Blog Page (list)
/* Blog Page (list) */
[class*="type-blog"].view-list {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Blog Post
/* Blog Post */
[class*="type-blog"].view-item {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Event List
/* Event List */
[class*="type-event"].view-list {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Event Detail
/* Event Detail */
[class*="type-events"].view-item {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Shop/Category
/* Shop/Category */
[class*="type-products"].view-list {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Individual Product
/* Individual Product */
[class*="type-products"].view-item {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Cart Page
/* Cart Page */
body#cart {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Homepage Only
/* Homepage Only */
body.homepage {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
Other Pages (exclude homepage)
/* Other pages - exclude homepage */
body:not(.homepage) {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
When the burger menu is open
/* When burger menu is open */
body.header--menu-open {
& {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
}
One Page
Add this code to Page Header Code Injection and Save
<!-- Page Gradient - One Page -->
<style>
body {
background-image: linear-gradient(to right,#c7b7a6,#f1f);
}
.section-background, .section-border, section {
background-color: transparent !important;
}
</style>