Archived topic
Use blog layout from another layout
13 replies · Started by Tan on March 8, 2020
I used Volumn layout in GP library. But I want to build my blog layout like Marketer layout in GP library without losing everything else. What can I do?
GeneratePress 2.4.1
Hi there,
do you have a link to the site where the Volume site is being displayed ?
Hi David,
My blog: https://eladiy.com/blog/ and all archive pages.
Hi there,
Most of it can be done in the Customizer.
For example, you can set the featured image to the left in Customize > Layout > Blog.
Then are you wanting to add a border/box shadow around each post?
Yes and I want to show sidebar layout like Marketer.
I follow your guide but it doesn't work. Layout doesn't change.
Sidebar layout is also in the customizer:
https://docs.generatepress.com/article/sidebar-layout/#blog-sidebar-layout
Thank you for your support!
1. My feature image's size is 1920:1005, I want to keep this ratio (191:1) to show on my blog. How could I do?
2. I set the featured image to the left in Customize > Layout > Blog, but it doesn't work. You can see here: http://bit.ly/2VZhXUb.
3. Yes. I want to add a border/box shadow around each post. How could I do?
OK - DELETE this CSS in Customizer > Additional CSS:
.blog .post-image, .archive .post-image, .search .post-image {
margin: 0.5em 0 1em 0 !important;
float: none !important;
}
.blog .post-image img, .archive .post-image img, .search .post-image img {
width: 100%;
height: 250px;
-o-object-fit: cover;
object-fit: cover;
}
.entry-summary, .entry-meta {
font-size: 0.75em;
margin-top: 1em;
}
1 and 2 - change the Featured image size to a smaller value eg. Width = 200px, Height = Auto.
Then the image should align left.
3. For the border styling Marketer uses this CSS:
body:not(.single) .inside-article,
body:not(.single) .sidebar .widget {
border: 1px solid rgba(232, 234, 237, 1);
box-shadow: 0 0 10px rgba(232, 234, 237, 0.5);
}
It worked! Thank you so much, David!
I want to add background color to widget title (like Thrive themes blog sidebar). Could you help me?
Try this CSS:
h2.widget-title {
margin: -20px -15px 15px -15px;
padding: 15px;
background-color: #dddddd;
}
Thank you, David! You're genius!
The last thing! I want to exclude box shadow effect in my single post. Can you show me?
Edited the CSS #3 here
Thank you so much, David! For the help.
Glad to be of help