Archived topic
Center Post/Page title only if featured image set
5 replies · Started by Hans Christian Siller on December 2, 2015
Hi,
I would like to have my Post/Page title line (H1) left-aligned by default - BUT if the page/post has a featured image, I would like to switch to center-alignment.
Is it possible to achieve this with css? Or would I have to create a child theme and edit the php code?
Here's my site: http://www.philosophysalons.com
The reaon for this formatting request:
-without a featured image, the title line is right underneath the centered navigation menu. Since I am also using a sidebar, the nav menu will be truly centered, while the title will be off-center (due to the smaller content area). However, if there is a featured image, it must be center-aligned (and with it, the title underneath the featured image).
Thanks for any pointers!
Hi there,
Give this CSS a try:
.generate-page-header + .entry-header {
text-align: center;
}Adding CSS: https://generatepress.com/knowledgebase/adding-css/
Let me know :)
Hi Tom,
thanks for your quick response. But the css will center ALL H1 headlines. What I'm looking for is a way to center H1 headlines CONDITIONALLY (only if a featured image is set for the post/page in question).
Is it possible to do that with CSS - or would I need to start hacking the Php code?
Thanks!
That CSS should actually only center headlines that come right after the feature image. Have you tried it yet?
Tom,
thanks for your suggestion! You are correct - the + selector correctly centers the H1 text only if it is preceded by a featured image.
However, your code had the wrong class in it (at least for my install). It looks like I need to use .page-header-image-single instead of .generate-page-header
Here's the CSS that works (center Post/Page title only if a featured image exists):
.page-header-image-single + .entry-header {
text-align: center;
}Thanks for your help - everything is working great now!
Ah, sorry about that! Glad you found the right class :)