Side bar for home page diaplaying posts

Hi @dja354, glad you found Sarah’s workshop useful!

The Home template is normally what controls the layout on the homepage.

To add a sidebar, you can edit the Home template to add another column, which can then be used to display other types of blocks on the homepage.

Let me know how it goes!

Hello Kathryn P,

Thanks so much for the info. I had previously tried that, but because I was only using the 30% on the right side of the column for the sidebar, it left a big white space on the left side of the page where the unused portion remained. I also worry that if I add other sidebar the same thing will happen and it pushes my posts further and further down the page with more unused whitespace on the left where the sidebar(s) are located, and then a bunch of white space to the right of the post(s) on the remainder of the page. Is there a way to eliminate the 70% potion on the left side so my posts will move up into that spot?

Thank you,
Dan

Hi @dja354 – I’m not sure I understand your end goal 100%.

If your aim is to create a two-column layout (70/30) below the image at the top, then you’d put one Columns block below the image with the 70/30 option selected, and then move your existing content into those two columns. Once your content is moved into the new Columns block, you can delete any old blocks that are no longer needed.

If this doesn’t help, free to clarify what you’re trying to do by drawing or otherwise creating a little mockup, and adding it here so I can take a peek!

Hello Kathryn,

I guess the issue is the 70/30 split. I just need the 30 on the right side so that my posts still appear (latest on top) on the left side. Kind of like the screenshot and crude drawing at the link below.

Does that make sense?

Thanks,
Dan

https://gchsharkband.com/test/

Thanks for the sketch. ??

In peeking at your front page code more closely, it looks like you have a bunch of nested blocks in that area that aren’t needed, such as a Cover block.

What I’d suggest you do is create a new two-column block with a 70/30 split, just below the paragraph that’s beneath the image at the top.

Then, move only the blocks you need into the left-hand column, and delete the ones you don’t need. A tip: Once you put an empty paragraph tag inside each column, you can actually open up List view and drag and drop the blocks that are currently on the page inside the left-hand column.

I made a little screencast to show you what I mean:

After you’ve cleaned up your existing content and moved only what you need in the left-hand column, you can then add new blocks into the right-hand column to fill in your sidebar.

Thanks again for the very swift response. Before I try that, I just want to be certain that you understand that the latest posts on the left side are my default homepage setting. Those will change and be updated, and so they will fall down on the page each time a new post is created. If the post is linked to the sidebar in the 70/30 split, will the sidebar then drop down the page with the former post each time a new one auto populates the space above? The sidebars I want to add are just generic plugins that I can use to show a countdown clock or upcoming events, etc, and not necessarily related to the post topic. So perhaps my use of the term sidebar is not correct in that regard?? If so, is there some way to create something static on the right side that will not drop?

Thanks,
Dan

Hi @dja354, I do 100% understand that you want static items in the right-hand column that won’t change, and not blog posts. ??

If the post is linked to the sidebar in the 70/30 split

In the steps I described above, your main column and the right-hand column are two separate content areas, in which you will put different blocks. They are not linked together, they just happen to live side-by-side.

Your Query Loop block with your latest posts will remain in the main column on the left, while you can put other types of blocks in the right-hand column.

Does this help visualize things better?

If you’re worried about how experimenting on your live site, you could always create a brand-new template for testing, and play around with the layout to your heart’s content until you get it working how you want.

Hi Kathryn,

I think I managed to follow part of your suggestions (with a little help from my son) and it looks like it is working now. Thank you so much for your patience and support!

Dan

One more question if you do not mind? Now that I can add the sidebars, I see where several of the ones that were in use on our former theme do not seem to be loaded in the widgets list that come up as available even though I have them activated in my installed plugins. Any idea how I can get them to import?

@dja354 That’s great, and you’re very welcome!

I see your countdown displaying in the right column now, so I’ll go ahead and mark this thread as resolved. Feel free to start a new one if you need help with something else!

Oops, I just noticed your other reply.

One more question if you do not mind? Now that I can add the sidebars, I see where several of the ones that were in use on our former theme do not seem to be loaded in the widgets list that come up as available even though I have them activated in my installed plugins. Any idea how I can get them to import?

Twenty Twenty-Two is a block theme, so it does not have widget areas. The idea behind Full Site Editing, which is what Twenty Twenty-Two supports, is that you add content blocks directly to areas like the footer or sidebar, instead of widgets.

You might want to check whether your plugins provide a way to add their content via a shortcode, instead of a widget. That way you could still add them by pasting the shortcode into a Shortcode block.

If you’d like to learn more about block themes and Full Site Editing with Twenty Twenty-Two, there are some good resources here:
https://www.ads-software.com/support/topic/support-resource-for-twenty-twenty-two/

Thank you so much. You are awesome!!

You’re very welcome!