Sidebar Image

Hi Marjorie,

If you want the container to go above the sidebar, you'll need to hook the content on generate_inside_container hook. :D

Also on that same page where the blog category that says marketing is in grey color, and the read more button color, where do I go to change those colors?

You seem to be using Block Element - Content Template for this. In this case, the changes have to be done within the Block Element. :D

Hi I'm sorry, I don't understand a single word of your response to either of my queries. I still don't know what to do

Hi there,

lets deal with the sidebar image first :)

You can add this CSS to remove the padding around the widget with the image in:

.sidebar .widget:nth-child(6) {
    padding: 0;
}
.sidebar .widget:nth-child(6) img {
    width: 100%;
    vertical-align: bottom;
}

I assumed it was the last ( 6th ) widget you wanted to target.
If thats not the case, the you can change the 6 value to the number you want to change.

Awesome! David it worked, thank you. So if I want to add more sidebar widgets like that, do I always have to paste the code in repeatedly and just change the number? Or is there a way to only add the code once and separate the numbers?

Now this "Also on that same page where the blog category that says marketing is in grey color, and the read more button color, where do I go to change those colors?"

So you can string multiple CSS selectors in each CSS Rule and delimit them with a comma for example:

.sidebar .widget:nth-child(3),
.sidebar .widget:nth-child(6) {
    padding: 0;
}

.sidebar .widget:nth-child(3) img,
.sidebar .widget:nth-child(6) img {
    width: 100%;
    vertical-align: bottom;
}

This will target number 3 and 6.

Also lets say your last widget is always going to be an image you can use the last-child pseudo selector eg.

.sidebar .widget:nth-child(2),
.sidebar .widget:nth-child(4),
.sidebar .widget:last-child {
    padding: 0;
}

.sidebar .widget:nth-child(2) img,
.sidebar .widget:nth-child(4) img,
.sidebar .widget:last-child img{
    width: 100%;
    vertical-align: bottom;
}

For the next part - your site is using the Block Element - Content Template found in Dashboard > Appearance > Elements. Find and edit that - and simply select the elements you want to change the colors of and apply the color styles :)

More info on that element here:

https://docs.generatepress.com/article/block-element-content-template/

Thanks I now understand the sidebar.

The other part I was able to change the button, but when I made changes to the category, it didn't change. It reflected a change in the editor but when I went to the page it didn't change

Do you want to send me temporary Admin login to the site - so we can see whats happening ?
You can share them in the Private Information field.