Archived topic
Adding padding to the columns in the blog archive?
14 replies · Started by Henry on February 17, 2022
As the title suggests, I can't see how I can add padding to the two columns?
At the moment the two columns (and therefore images) are stuck next to each other....
Thanks!
Hi there,
Can you try using separate containers instead of one container and see if that works better?
https://docs.generatepress.com/article/content-layout/
Then the content padding should apply to each post block.
Let me know :)
Thanks Leo - good suggestion and it fixes it but then it messes up the rest of the site, so I had to revert it back to "one container"
Is it possible to have separate containers but just for that blog archive page? Or would CSS be my friend in this instance?
Thanks again!
In fact - this might be a solution: https://generatepress.com/forums/topic/putting-coments-area-in-its-own-container-without-affecting-blog-archive-page/
^ I guess this approach would work but would you mind lending a hand to tweak the functions to get it to load on ONLY the "Single" WordPress Posts archive and leave the other archives alone?
Thanks again - really appreciate it!
Glad to hear :)
Hi - unfortunately it didn't work...
This is what I tried:
add_filter( 'option_generate_settings','lh_single_posts_settings' );
function lh_single_posts_settings( $options ) {
if ( is_archive() ) {
$options['content_layout_setting'] = 'separate-containers';
}
return $options;
}
What I am trying to do is add padding between the x2 columns in the blog archive page (i.e. the blog "home page")
Make sure you are using the correct conditional tag:
https://codex.wordpress.org/Conditional_Tags#The_Blog_Page
Thanks for the tip...still no joy, this is what I used as per the codex:
add_filter( 'option_generate_settings','lh_single_posts_settings' );
function lh_single_posts_settings( $options ) {
if ( is_front_page() && is_home() ) {
$options['content_layout_setting'] = 'separate-containers';
}
return $options;
}
I am thinking maybe add padding to the column using CSS for that specific page but I can't see that it has a Page ID...
Hi there,
did you find a working solution ? As the topic has been marked as resolved.
Hi David - thank you for noticing that - and no, it hasn't been resolved
As per the title of this thread, I can't seem to get the seperate containers to load on my blog "home page" - any idea how this might be accomplished?
Thank you in advance!
PS - heres's the code I tried:
Thanks for the tip...still no joy, this is what I used as per the codex:
add_filter( 'option_generate_settings','lh_single_posts_settings' );
function lh_single_posts_settings( $options ) {
if ( is_front_page() && is_home() ) {
$options['content_layout_setting'] = 'separate-containers';
}
return $options;
}
I have changed the topic to unresolved.
Can you add a link to the home page in the private info so i can take a look
( Resolving a topic removes all private information fields ).
Thanks very much, David - I added the URL in the private info.
I should add that I included what I think is the correct Codex for the blog "homepage", which was this:
is_front_page() && is_home()
Thanks again!
The conditional tag: is_front_page() && is_home() is if your viewing the home page that is set to display the latest posts.
You should just use: is_home()
Thanks, David! Works well!
Just one thing - I have a right side bar (widget area) that is now flush to the top of the menu. To add padding to that specific column I guess I can add some padding to this div and class:
<div class="widget-area sidebar is-right-sidebar" id="right-sidebar">
Do you know how to add some top padding that would be applied to this widget area but ONLY on this blog-homepage?
You can use something like this:
.blog .sidebar.is-right-sidebar {
padding-top: 20px;
}