Black Friday Sale! Get up to $30 off GP Premium! Learn more ➝

[Resolved] Featured Image by Title on PAGE

Home Forums Support [Resolved] Featured Image by Title on PAGE

Home Forums Support Featured Image by Title on PAGE

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #199671
    Terry

    Hi Tom,

    I’m trying to align a featured image to the right of the title on my pages, but not having any luck. I found this post:

    https://generatepress.com/forums/topic/size-of-featured-image-in-posts/

    And added the display-none CSS described therein to my custom CSS. I then inserted the image directly into my post using the ‘Instant Featured Image’ plugin. Doing that made the images appear more in line with what I wanted on posts, but appeared to have had no effect on pages. (It’s still not quite right on the post page either, because what I really want is to have it aligned to the right, and on the same line as, the title, like this:

    Featured Image Layout

    On my pages, even though I deleted the header image and turned header image off in the page settings, I still have a big ol’ picture above my title, like this:

    Featured Image on Page

    Thanks in advance for any insight you can provide.

    Terry

    #199799
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Can you link me to the page where you’re wanting to do this?

    Typically, you would want to hide the featured image, and add your image directly into the content using the Add Media button.

    #199814
    Terry

    Hi Tom,

    Adding it to the content puts the image BELOW the title, and I want the image IN LINE with the title. You can see an example here (from a non-GP site that I’m trying to convert):

    Staging site #1

    And here’s how a page looks on the GP version, with featured image still showing above the title, and the smaller featured image inline with the first line of text, rather than the title.

    Staging site #2

    The featured image is working on the blog post, but is also displaying below the title when I’d like it inline with the title. See:

    Blog on Staging site #2

    (Once you’ve seen these, can we delete the URLs from the post please?)

    Thanks,

    Terry

    • This reply was modified 5 years, 5 months ago by Tom.
    #199833
    Tom
    Lead Developer
    Lead Developer
    #199844
    Terry

    Hi Tom,

    That doesn’t seem to work. I added this to my CSS:

    .page-header-image-single {
        float: right;
        margin: 30px 20px 0px 0px !important;
    }
    

    I have no image specified in the header (and have actually disabled the header image in the page settings), and the featured image is still showing above the title in all its glory. So then I tried adding a specified width with this code:

    .page-header-image-single {
        float: right;
        width: 270px;
        height: auto;
        margin: 30px 20px 0px 0px !important;
    }
    

    But it didn’t make any difference. I still have an uber-big header image above the title.

    Discover page

    I just found this post that maybe offers a solution. So I tried what they suggested at the bottom of that page – adding this code to functions.php:

    /**
     * ADD FEATURED IMAGES TO PAGES
     */
    
    add_theme_support( 'post-thumbnails' );
    

    No luck there either. Story of my life these days, sadly. πŸ™

    #199845
    Tom
    Lead Developer
    Lead Developer

    Try this instead:

    .page-header-image, .page-header-image-single {
        float: right;
        max-width: 400px !important;
        margin-left: 40px;
        margin-bottom: 40px;
    }
    #199846
    Terry

    Perfect! Thank you sooooooo much, Tom!

    Terry

    #199848
    Tom
    Lead Developer
    Lead Developer
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.