Archived topic
3 columns on home page and 2 on other archives
3 replies · Started by Stephane Bergeron on September 2, 2018
I'm working on a new version of my own personal site and I moved it from Genesis to GeneratePress.
On the home page (showing blog posts) I removed the sidebar and I'm using a 3 columns masonry layout. But on all other blog archives, I'm keeping the sidebar but would like to display only 2 columns.
At this point I don't see an "easy" way to do it and I'm not yet very familiar with the GeneratePress hooks and filters system. So I'd appreciate any pointers on how I could approach this. If I need to make the default layout two columns and add CSS just for the home page that's fine but if there's a simpler way I'd love to know it.
Might be a good candidate for the new Elements Layouts ;)
Thanks!
Hi there,
For sidebar layout on Archive page, you can already use the Layout Element:
https://docs.generatepress.com/article/layout-element-overview/#sidebar
For the column numbers, you can use this filter for now:
https://docs.generatepress.com/article/using-columns-in-the-blog/#changing-the-number-of-columns
The conditional tag if ( ! is_front_page() && ! is_home() ) should work:
https://docs.generatepress.com/article/using-hooks-conditional-tags/#latest-posts-as-home-page
Let me know if this helps :)
Thank you so much for replying this quickly!
The code works to change the width of the columns but there's something missing. I did as I said above and set the default columns to two and masonry in the Customizer. Then I added the code you pointed to with a conditional to target the front page and it works partially in that, it does make the columns 33% but there's still only two columns. They are centered with a larger gap between them but there's two. There's a clear left that should happen at every 4th post that doesn't.
I also tried the reverse. Set the default to 3 columns and targeted all but the front page and set the code to 50 (50%). Now the home page looks OK for other archives show posts at 50% but all on a single column with a gap for the other 50% between the posts and the sidebar.
Do I need to create my own nth-child or nth-of-type CSS?
Thanks!
Hmm can you link me to the page in question?
You can edit the original topic and use the private URL field.
