- This topic has 20 replies, 4 voices, and was last updated 4 years, 8 months ago by Tom.
-
AuthorPosts
-
August 25, 2019 at 10:37 am #993121Liran
Hey,
What CSS should I add so that the category pages will look something like this? https://upjourney.com/category/gifts
Also, can I achieve that style with WP Show Posts? https://momcurls.com/makeup/
Thanks!
August 25, 2019 at 12:03 pm #993169LeoStaffCustomer SupportHi there,
Try this:
.blog.separate-containers .inside-article, .archive.separate-containers .inside-article { -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.15); box-shadow: 0 0 10px 0 rgba(0,0,0,.15); transition: all .25s; } .blog.separate-containers .inside-article:hover, .archive.separate-containers .inside-article:hover { -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.15); box-shadow: 0 0 30px 0 rgba(0,0,0,.15); }
Adding CSS: https://docs.generatepress.com/article/adding-css/
August 25, 2019 at 12:16 pm #993180LiranThank you, Leo. But it seems there are some padding issues.
August 25, 2019 at 12:17 pm #993183LeoStaffCustomer SupportAny chance you can link us to the site in question?
You can edit the original topic and use the private URL field.
Let me know π
August 25, 2019 at 12:19 pm #993184LiranAny chance you can link us to the site in question?
There you go.
August 25, 2019 at 12:22 pm #993188LeoStaffCustomer SupportWhat’s the padding issue you are referring to?
August 25, 2019 at 12:45 pm #993218LiranThere’s no white space anywhere.
Have you looked at the examples I linked to? That kind of structure would be ideal.
August 25, 2019 at 1:11 pm #993233LiranI’ve managed to add padding to everything inside the box. However, I want to exclude the featured image. Any ideas?
August 25, 2019 at 3:15 pm #993299LeoStaffCustomer SupportSorry still not quite sure if we are looking at the same issue.
There is no padding around the featured image as far as I can tell.
August 25, 2019 at 3:27 pm #993305LiranNo, the code you gave me has only affected the category pages. You can find them on the menu.
(BTW, please remove the image when we’re done π)
August 25, 2019 at 3:38 pm #993313LeoStaffCustomer SupportTry adding this as well:
.wp-show-posts-inner { -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.15); box-shadow: 0 0 10px 0 rgba(0,0,0,.15); transition: all .25s; } .wp-show-posts-inner:hover { -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.15); box-shadow: 0 0 30px 0 rgba(0,0,0,.15); }
August 25, 2019 at 3:46 pm #993319LiranThat looks great. But the main question is β how do I add padding to the title and the text without affecting the featured image?
August 26, 2019 at 3:23 am #993576DavidStaffCustomer SupportHi there,
make sure you have the Blog Module activated. In Customizer > Layout > Blog –> Featured Images ( Archive Tab ) you can remove the padding from images.
August 26, 2019 at 5:16 am #993650LiranI don’t want the images to have padding, only the content.
August 26, 2019 at 5:23 am #993652DavidStaffCustomer SupportYes – follow these steps:
1. Set you padding in the Customizer > Layout > Container. You can also set the layout to separate containers and adjust the separating space between containers.
2. Customizer > Layout > Blog β> Featured Images ( Archive Tab ) and UNCHECK the Display padding around images
-
AuthorPosts
- You must be logged in to reply to this topic.