Jump to content

Blog Post Separators Also Appear On Pages

Recommended Posts




I'm almost done with the new website layout, but one last detail is driving me nuts: I wanted to add an image as separator between blog posts.



That works fine when I use this little custom code:


#content .hentry {background: url(../wp-content/uploads/pagelines/trenner_sml.png) bottom no-repeat; padding: 0px 0px 20px;}

The downside of using .hentry is that the separator also appears at the bottom of each page. Is there a way to differentiate posts and pages so the separators only appear at the bottom of each blog post?
The website is located here: http://wuoau.org/blog/ (an example for a page is "Kontakt")
Greetings from Berlin,

Share this post

Link to post
Share on other sites

You can use the page-id method to apply a different background for the Kontakt page. You only need the actual page number then craft it as .page-id-XX where XX is the number of the page.

Former PageLines Moderator, Food Expert and Raconteur

Share this post

Link to post
Share on other sites

Cool, thanks!


.page-id-3276 .hentry {background: none;}

works. Now I can finally go home and sleep :)


But can't you just define the blog? That would be easier than defining several pages.

Share this post

Link to post
Share on other sites
James B

You can try using the classes .blog and .post in your css, that should cover all of it.

  • Like 1

Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post

Link to post
Share on other sites

Thank you James, that works perfectly!

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • chamois_blanc
      By chamois_blanc+
      Shouldn't the image PL5 component be using the srcset/picture css directives to pick the correct size for an image? or it does already and I don't know how to use it? Thank you for any advice or enlightenment.
    • BentleyD
      By BentleyD+
      Hey there,
      I am working on BentleyRolling.com. I used grams on MoonbodySoul.com and all the images are cropped to a square, whether they are square or 4:5 when posted on instagram, they still get cropped to a square. This looks way better than some being squares and some being 4:5. Did something change since I designed MoonBodySoul.com with Platform5? Can you help me crop all images to a square on BentleyRolling.com 
      All the best,
    • cstudio
      By cstudio
      How do I control the lightbox effect on the plugin "popthumbs"?  On mobile, it opens up much to small then when expanded it opens to large.  I would like to control the the lightbox to like 90% of the viewer window but I can't figure out how/where to control that.
      Site example

    • Queue-it
      By Queue-it+
      I am using pl-section-journey and hiding most of the images. When running the page via google speed insights, it tells to optimize all the images that are in this plugins default. (e.g. https://queue-it.com/wp-content/plugins/pl-section-journey/images/drawer-5.jpg ) Like this one that is not visible on the website, but is a part of the plugin and comes up in google insights.
      I've deleted all the images in the plugin, but they still seem to come up. Ref. this page: queue-it.com/features
    • globalnative
      By globalnative+
      Hi there!
      I'm trying to create a featured image for my new blog post. It has text in it, and when I add it as a featured image some of the text is cut off on the right.
      Could I get the ideal dimensions for featured images? Or, a way to customise the dimensions so that they are easier to fit in the way I need?
      Thank you kindly