Sidebar widget image and heading text alignment

Hi Rachel,

Try placing the Image and the Container Block inside a Grid Block.

Then set the Container width of the columns accordingly for all views.

That should place them in one row.

Hmm, the query loop is already set in a container/grid, and the post template is set to 100% width? I didn't want columns for each parameter, as it is in the sidebar.

The Grid Block within the Query Loop Block is for the articles/posts not the content within it.

If you prefer, we can also use custom CSS to force it to look the way you prefer. Try adding my-query to the class list of Grid Block of the Query Loop Block, then add this css.

Example:

.my-query .gb-container> .gb-inside-container {
    display: flex;
}

.my-query .gb-container > .gb-inside-container > figure {
    width: 20%;
}

.my-query .gb-container> .gb-inside-container > h4 {
    width: 70%
}

You can alter the values to your preference.

Hope this helps!

Thanks, the css works. I tried to work out how to place the query loop content into another grid, but couldn't work it out - as all the query content seems to need to stay together? Is there something I am missing?

I see.

Here’s a sample structure for reference: https://share.getcloudapp.com/mXux4ZoQ

Hope this helps!

Yes, thanks, but when I tried to recreate it myself it broke the query loop when I tried to add those blocks to the structure. I will need to play around more to get it to work using that method - just not quick and easy.. thanks for your help.

You’re welcome Rachel! We don’t usually do this, but I tried making a short screen recording to show you how to do it. See: https://share.getcloudapp.com/6quzpRvv

Hope this helps!

Thank you so much - that is really helpful - it is the process flow which is hard to work out at first with this. Thanks again.

You’re welcome Rachel! Glad to be of assistance!