Grow your CSS skills. Land your dream job.

Featured Images / Image Slider

  • # November 24, 2012 at 4:08 pm

    Hello

    I’ve been struggling to figure out the complicated dynamics (well, to me) of the WordPress featured images function.

    I’m trying to get my home page to show the latest featured image from a custom “portfolio” post type where an image slider might go.
    I also want to have smaller featured images from the same post type underneath the main image.

    Please see the linked image for a better explanation.

    [FEATURED IMAGE EXAMPLE](http://s12.postimage.org/nh1qpgmj1/Latest_Post.jpg “FEATURED IMAGE EXAMPLE”)

    Any help would be hugely appreciated.

    Thanks
    :)

    # November 24, 2012 at 7:25 pm

    @inlmbrt Depending on how you want the slider to function, my site is somewhat similar. I use a custom fade slider which is only 25 lines of code.

    I assume you want the thumbnails to navigate the slider?

    # November 25, 2012 at 3:25 am

    I was hoping to show the latest post from the “portfolio” custom post type as a large static featured image at the top of the page.

    I was then going to have the rest of the latest posts from the “portfolio” custom post type as smaller, squared featured images excluding the latest post (which is already at the top of the page).

    Hope I’m making sense! :]

    # November 25, 2012 at 3:29 am

    @inlmbrt Well, that can all be done via PHP. I’m not understanding where the slider comes into play. Can you explain?

    # November 25, 2012 at 3:35 am

    It was a bad example, but I meant the latest featured image from the “portfolio” post type going in the same place a slider might be.

    # November 25, 2012 at 11:43 am

    I’m not wanting the main image to be a slider (no sliders at all in fact), rather a static featured image with a link to the that post.

    Does this make better sense?

    # November 25, 2012 at 2:27 pm

    @inlmbrt All right. Try the code below. The first loop gets the latest post from portfolio for your main image. The second loop gets the rest and sets them in a thumbnail.

    < ?php $loop = new WP_Query( array( 'post_type' => array(‘portfolio’),’post_status=publish’,’posts_per_page’ => 1));
    while ( $loop->have_posts() ) : $loop->the_post(); ?>
    “>< ?php echo the_post_thumbnail('full'); ?>
    < ?php endwhile; ?>

    < ?php $loop = new WP_Query( array( 'post_type' => array(‘portfolio’),’post_status=publish’,’offset’ => 1));
    while ( $loop->have_posts() ) : $loop->the_post(); ?>
    “>< ?php echo the_post_thumbnail('thumbnail'); ?>
    < ?php endwhile; ?>

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".