Archived topic
WP Show Posts - Align date at the bottom, Add additional meta data
7 replies · Started by Reed on June 16, 2020
Couple things..
1. I am looking to do something similar to https://wordpress.org/support/topic/align-date-at-the-bottom/, however, that solution doesn’t seem to work for my site: https://frugalflyer.ca.
2. I would like to add an estimated reading time to the blog cards on the home page, aligned right, vertically in line with the date. If I had a plugin to estimate the times (eg. Reading Time WP), could I use the shortcode to add to WP Show Posts meta?
Thanks,
Reed
Hi there,
1. Try this CSS:
.wpsp-content-wrap {
display: flex;
flex-direction: column;
height: 100%;
}
2. You could hook the shortcode into wpsp_after_content
If you want to filter the post date - you would use this hook wpsp_date_output
Perfect. I've got everything now except how would I align and float:right the reading time with the date?
Does this work?
.rt-reading-time {
text-align: right;
}
No, the RT is still below the date. (the site is public so you can see it).
Let me know if there is a way to align with CSS, or I should just remove the native WP Show Posts date and make my own shortcode to add to the hook that shows the RT.
Edit: I've now done the latter - hopefully this is an appropriate solution.
Try this as your combined CSS - this will put space between date and reading time and force them to align to the bottom:
.wpsp-content-wrap {
display: flex;
flex-direction: column;
height: 100%;
}
.custom-post-meta {
display: flex;
justify-content: space-between;
margin-top: auto;
}
Thank you!
Glad we could be of help