Archived topic
Customizing blog display
17 replies · Started by Harshit on October 22, 2018
How to display blog posts at homepage like it's done at thrivestrive.com/library. How i can achieve the same layout?
Also, they have different pins in sidebar of each of their posts. How do I do that with GP?
Hi there,
Which specific part(s) are you trying to achieve in the example page?
For different sidebar on individual posts, you will need a plugin like this:
https://wordpress.org/plugins/content-aware-sidebars/
Let me know :)
I am trying to achieve the post layout from the blog, the blog has equal length containers where each post is displayed. I have marked that in image link below. I think blog is using Foundation framework
Oh and regarding sidebar, actually I want to display image related to post for every post like it's done in thrivestrive.com posts. Is that possible with content aware sidebars?
There are columns options in the Blog panel section of the customizer. Just set it to 4 columns.
https://docs.generatepress.com/article/using-columns-in-the-blog/
https://docs.generatepress.com/article/blog-content-layout/
For recent posts widget, try this:
https://wordpress.org/plugins/recent-posts-widget-extended/
Let me know :)
I am already using column layout with 4 columns but the length of the column is not fixed, I guess only width is fixed. I want all columns to have the same length and width. I would also like to display boundary over each like it's done in the other site.
Can you link me to the your page in question?
You can edit the original link and use the private URL field.
Thanks!
This CSS should add the border:
.blog .inside-article, .archive .inside-article {
border: 1px solid #000;
}
As for equal height columns for each row, the example site you linked is using a fixed height like this:
.blog .post, .archive .post {
height: 400px; /*adjust this number to suit your need*/
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
Let me know if this helps :)
That worked. Thanks, Leo!
One more thing how to get these line on top and below the title in post column and also the logo at the top (if possible)?
Here's the image of what I want
https://ibb.co/mn6D5q
Target layout site
Try this CSS for the border:
h2.entry-title {
border-btop: 3px double #eeeeee;
border-bottom: 3px double #eeeeee;
padding: 5px 0;
}
As for the logo, you can add it using our Hooks Elements:
https://docs.generatepress.com/article/hooks-visual-guide/#posts-page
https://docs.generatepress.com/article/hooks-element-overview/
Perfect, that worked, but I need a little space between the text and border as text is coming over the bottom border. Is that possible?
Also, comment box and footer are shown all over the posts in my site. Don't know why it's happening. It's happening on all posts. Here's my site
Thanks so much, but the comment box and footer is still all over the post, it should display at the end of the post but that's not the case.