Archived topic
Right sidebar
9 replies · Started by Chintan on November 9, 2022
Hi
I am trying to use GenerateBlocks in Elements to set up my right sidebar. The alignment is all over the place. I am sharing a page where it's present right now.
1. The right sidebar starts before even the title of the article
2. The "Latest Posts" Block has a lot of space on the left-hand side
3. Overall the sidebar seems to have taken a lot of space from the central space itself.
Can you please guide me in fixing these issues? Thank you!
Hi there,
1. The right sidebar starts before even the title of the article
That's expected behavior. If you want the title to appear above the content container (content area + sidebar), you need to create a block element - page hero for that.
2. The “Latest Posts” Block has a lot of space on the left-hand side
Yes, ul element has 3em left margin by default.
3. Overall the sidebar seems to have taken a lot of space from the central space itself.
It's exactly taking 25% width of the entire content container, I don't see anything wrong with it.
Hi Ying,
Thanks for your response.
So I am sharing a couple of examples in the private info box. Please have a look at their right sidebars.
1. The right sidebar is normally aligned horizontally with the main body text's box at least. I don't want it to appear above the content container.
2. I don't know how that's a good default design choice. But how can I make it zero? Because that's how normally it looks like.
3. It looks weird overall. Probably without the left sidebar being there, its empty space is still there? That's again something I don't want.
I am sorry I am unable to explain how the page is looking off. The examples I shared will help. Let me know if you need me to tell you something more specific for helping me. Thanks a ton :)
Hi Chintan,
1. Go to Appearance > Customize > Layout > Container, and set the Content Layout to One Container. This should align the Sidebar and the Content vertically.
2. To set it to 0, try adding this code in Appearance > Customize > Additional CSS:
ul.wp-block-latest-posts {
margin-left: 0;
}
3. You may alter the sidebar width in Appearance > Customize > Layout > Sidebars. Reference: https://docs.generatepress.com/article/sidebar-layout-overview/
Thanks a ton, Fernando.
The content and left sidebar together still occupy the middle position of the page. There's a lot of empty space that I can't seem to get rid of in the left hand sidebar and the on the right of the right sidebar. How can I fix that? I tried to change things around based on the documentation but it hasn't helped.
I'm not seeing a right sidebar viewing the link you provided.
To assure we're seeing the same thing, can you take a screenshot of the issue from your end?
Uploading Screenshots: https://docs.generatepress.com/article/using-the-premium-support-forum/#uploading-screenshots
Hi Fernando,
I shared the link to the page and a screenshot of what I want to address! Let me know if this helps.
Chintan
Hi there,
the space around the Content and/or Sidebar is governed by the Width of the Content Container.
Currently you have a Layout Element that is setting your Single Posts to 800px wide.
To overcome that on posts with a sidebar you would need to use some CSS:
body[class*="right-sidebar"] #content {
max-width: 100%;;
}
Now pages with a sidebar will use the Width you set in the Customizer > Layout > Container.
Hi David,
Thank you. While that solves the problem for posts with the right sidebar, now I see the whole website's other pages also take the new width (which is too big).
Where should I add the above CSS? I added it going under customize under the "Additional CSS" option: https://elitecontentmarketer.com/wp-admin/customize.php. It applies the code at a global level, I guess.
I updated the code above so it only applies to the right sidebar pages.