[Resolved] featured image for category pages

Home Forums Support [Resolved] featured image for category pages

Home Forums Support featured image for category pages

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #2375407
    Torsten

    Hi,
    is it possible to set a featured image, like for pages, for categories?
    Thanks ahead,
    Torsten

    #2375454
    David
    Staff
    Customer Support

    Hi there,

    first thing you would need is something like ACF to create the custom field for your Images in the Category term admin page.
    Once thats setup we can look at how to get that custom field value and output it your category archives

    Let me know

    #2376139
    Torsten

    Hi David,
    I installed ACF and tried my best to set up the custom field for hours now, not showing up anywhere where I would have expected.
    I’ve added login details for you in “Private information” below, just in case.
    best,
    Torsten

    #2376145
    David
    Staff
    Customer Support

    I made some changes to your ACF field.
    You should now see it in the Post > Categories at the end of the form.

    #2376150
    Torsten

    I tried for both categorie pages (Links in Private information) to set an image, but they aren’t displaying…
    tried deactivating autoptimize too, no effect.

    #2376167
    David
    Staff
    Customer Support

    yeah we need to now hook the image in.

    1. Create a new Hook Element
    2. Add this code to the Hook:

    <?php
    $queried_object = get_queried_object();
    $term_id = $queried_object->term_id;
    $image = get_field('category_image', 'category_'.$term_id);
    if ($image) {
        echo wp_get_attachment_image( $image, 'large' ); 
    }
    ?>

    See here: get_field('category_image', you need to change the category_image to your ACF Field name,

    3. Set the Hook to where you want it displayed eg. generate_after_header
    4. Check Execute PHP
    5. Set the Display Rules > Location to: Post Category Archives > All Categories.

    #2376175
    Torsten

    Hi David,
    got it, and managed to put the images below the menu/header.
    if I could have the images centered and contained, like the header image on the startpage, for the moment they are left-aligned with a few pixel padding below, no padding please.

    #2376191
    David
    Staff
    Customer Support

    Great to see that working.

    Change this line:

    echo wp_get_attachment_image( $image, 'large' );

    to:

    echo '<div class="grid-container">' . wp_get_attachment_image( $image, 'large', "", array( "class" => "category-featured-image" ) ) . '</div>';

    This will keep the image within the content container width.
    And it adds a handy class that we can use to style the image, like this CSS to remove the gap below the image and ( optionally ) force it to 100% width.

    
    .category-featured-image {
        vertical-align: bottom;
        width: 100%;
    }
    #2376192
    Torsten

    you’re soooo cool!
    ๐Ÿ˜‰
    thanks a lot!

    #2376194
    David
    Staff
    Customer Support

    ๐Ÿ™‚ haha – glad to be of help!

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.