Archived topic
Getting a new page to mimic the home page
13 replies · Started by James on December 5, 2021
Hello, I am trying to set up a "Current Page" (which will have the four latest posts) to look identical to the Home page, particularly as regards the size and centring of the post's title and text.
I want:
To look like this:
I have gone through all the setting on the "Show Posts" shortcode I have set up, but I still cannot find out how to center the post title.
Perhaps I need some CSS?
The page is: https://www.MiramichiFlash.ca
Hi James,
Can you link us to this "Current Issue" page? To inspect what it currently has to have a better idea on which way to point you to.
You can use the private information to provide the site details. :)
The Current Issue page is in Pending status, do you want me to publish it, or just give you log-in credentials?
Hi James,
You can just publish the site and link us to it.
Let me know :)
I published the page: Current Issue page
Thanks for your assistance!
Try this CSS:
#wpsp-3831 header.wp-show-posts-entry-header {
text-align: center;
}Let me know :)
The text is centred, which is great (thank you!), but the image width is smaller. I am trying to make it the same size as the home (or Archive) page.
You have this CSS which makes the container to 800px:
https://www.screencast.com/t/kEXO2pCfb
Would you like the CSS to exclude this page? If so, try change it to this:
body:not(.page-id-3829) .entry-content, .entry-summary, #comments, .page-id-3829 .wp-show-posts-entry-summary,.page-id-3829 .wpsp-read-more {
max-width: 800px;
margin-left: auto;
margin-right: auto;
}Then add this CSS:
.page-id-3829 .wpsp-read-more {
display: block;
text-align: center;
}
.page-id-3829 .wp-show-posts-image.wpsp-image-center img {
max-width: 1080px;
}Thanks, I will try this and get back to you!
No problem :)
Let me know how it works!
Ying, the first bit of code appears where? I can't just add it as Custom CSS?
The CSS I mentioned in the screenshot: https://www.screencast.com/t/kEXO2pCfb
It should be in customizer > additional CSS.
Find it, and replace it with the one I provided :)
Yes, found it just after I posted. Sorry about that. It looks great now, Ying. Thanks!
No problem James :)
