Archived topic
Divider inbetween blog posts
5 replies · Started by Streater on July 8, 2021
I found this code to add a divider in between posts:
<!-- Right before the closing of the The Loop, insert this code: -->
<?php
if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
echo '<div class="post-item-divider">Post Divider</div>';
}
?>
I guess it needs to be added to index.php but what is the best way to do that in a child theme? Will an index.php file in the child theme negatively effect the GP index.php file?
Hi there,
You'll have to make a template for archive.php as it's the one in charge of post loops.
But I think this isn't exactly necessary though. I believe a divider of some sort can be achieved w/ just CSS unless the divider you want is very complicated.
Any chance you can provide us any mockup images of how you want it to look like? Perhaps a reference site you want to replicate?
Let us know.
Ok... I built the site previously in DIVI so you can see what I am trying to go for... 2 links below: on the homepage, the newsroom section at the bottom AND the careers page
I only want dividers in-between the posts, so I don't want an extra one at the bottom.
Hi there,
try this CSS:
.blog .inside-article,
.archive .inside-article{
border-bottom: 1px solid #000;
}and this CSS if you want to remove some the excess space:
body:not(.single) .inside-article .entry-summary,
body:not(.single) .inside-article footer.entry-meta {
margin: 0;
}Is there anyway to make it so that there isn't a divider for the final post?
I tried doing this with the php code above but nothing.
You could try incorporating this selectors:
https://www.w3schools.com/cssref/sel_not.asp
https://www.w3schools.com/cssref/sel_last-child.asp
If you need help with the specific code, please let me know which page I should be looking at.
