Archived topic
GP-Marketer Custom Sidebar
7 replies · Started by Sunil on September 15, 2020
Hello Support,
I wanted to customize different sidebars for different post/pages ( eg; customized background color, content, etc).
What I did was;
[1]. Installed Lightweight Sidebar Manager
https://wordpress.org/plugins/sidebar-manager/
[2]. Created Side bar new-widget, and gave it a rule for the ‘new side-widget’ to appear on ‘specific-page & post.’
Everything up till this stage works in GP-Marketer theme. The different side-bar appears according to the ‘rules.’
The problem starts when I assign ‘custom-html’ to the ‘new widget’
For example, the background remains orange (as standard for GP-Marketer).
I also tried the Appearance > Customizer. However, nothing happens when you ‘click’ on the customizer icon appearing on the specific side-bar.
For example;
I’ve set the new widget rule to appear on ‘About page.’
However, when applying html widget back-ground-color, it changes the entire page background and leaves the side-widget as ‘default orange.’
The plugin designers ‘Brainstorm Force’ had a go after providing them with WP-Admin login.
They recommended to get in touch with my theme developers.
Help will be appreciated.
Thanks
Hi there,
Marketer adds that color using CSS.
Go to Customizer > Additional CSS and delete this block of code:
.sidebar .widget:first-child {
background-color: #e86000;
color: #fff;
}
Hello David,
Before I delete that particular block of css. I want to double check with you.
Will the theme maintain (default orange as in Marketer-GP Theme Sidebar) on selected pages or will it wipe it out all accross the theme?
I only want to change the background side-bar color on certain pages.
Removing that CSS would remove the color globally.
You would need to target the CSS to specific pages:
body.page-id-xxx .sidebar .widget:first-child,
body.page-id-xxxx .sidebar .widget:first-child {
background-color: #e86000;
color: #fff;
}
Or you can also exclude the CSS from some pages:
body:not(.page-id-xxx) .sidebar .widget:first-child,
body:not(.page-id-xxxx) .sidebar .widget:first-child {
background-color: #e86000;
color: #fff;
}
Ok,
Doing it in customizer css will make it messy. Marketer-GP Theme has stacks of preset css-scripts there.
Would it be better to do it using 'simple css plugin' on page by page basis?
Yup that's a good option as well :)
Hello Support,
The css-script works partially on the sidebar-widgets. The new sidebar-widget for a different page still maintains the default GeneratePress Marketer (side widget color.)
For example: The css successfully enables color controls on page:
Whereas its fails on the page.
Note: For experimental purpose I have given ‘two different names’ to these two widgets with rules for particular page. And have kept the respective widgets identical content.
Again, just a quick note:
[1]. Installed Lightweight Sidebar Manager
https://wordpress.org/plugins/sidebar-manager/
[2]. Created Side bar new-widget, and created rules for the ‘new side-widget’ to appear on ‘specific-page & post.’
That's because one is a post and one is a page.
This should work:
body.postid-98 .sidebar .widget:first-child {
background-color: #bbc;
color: #fff;
}