dflamholc
dflamholc

Reputation: 23

wordpress: creating a conditional statement to load featured image if it exists else a default image

I've searched for similar questions to mine here, but haven't found a thread that helps me.. although I did find help here to get to the point where I am now ;)

I've created a jquery slideshow that pulls images from the featured images in a certain post category. I found the code below here at SO and got it to work to my needs so far, but I'd need to add a conditional statement to it:

if(has_post_thumbnail()) {
$showImg = wp_get_attachment_image_src( get_post_thumbnail_id ( $post->ID ), 'xiao-show-img' );
} ?>

<a href="<?php the_permalink() ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>">
    <img src="<?php echo $showImg[0]; ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>" />
</a>

that works ok, but.. i'd like to use something like below to be able to load a default image into the slideshow, if there is no featured image attached to the post:

<?php
if(has_post_thumbnail()) { ?>
    <a href="<?php the_permalink() ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>">
        <img src="<?php the_post_thumbnail() ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>" />
    </a> 
 <?php
    } else { 
 ?>
    <a href="<?php the_permalink() ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>">
        <img src="<?php get_bloginfo("template_url"); ?>/images/xiao-default-image.png" />;
            </a>
    <?php }
 ?>

I realise that the below example doesn't work.

Upvotes: 2

Views: 5587

Answers (2)

Adam Pointer
Adam Pointer

Reputation: 1492

I think the main culprit in your code is src="<?php the_post_thumbnail() ?>"

as the_post_thumbnail() will echo out the html needed for the entire image tag so try this instead...

<?php if(has_post_thumbnail()): ?>
    <a href="<?php the_permalink() ?>" title="<?php the_title() ?>">
        <?php the_post_thumbnail() ?>
    </a> 
<?php else: ?>
    <a href="<?php the_permalink() ?>" title="<?php the_title() ?>">
        <img src="<?php get_bloginfo("template_url"); ?>/images/xiao-default-image.png" />;
    </a>
<?php endif ?>

Upvotes: 3

Matt H
Matt H

Reputation: 6530

Easier method - just change the style of that image to include background-image: url('images/xiao=default-image.png'); with a properly set width: and height:. Then you don't need the if/else statement, but also change your $showImg to include the src, and give your image a custom class:

if(has_post_thumbnail()) {
   $showImg = 'src="' . wp_get_attachment_image_src( get_post_thumbnail_id ( $post->ID ), 'xiao-show-img' ) . '"';
} ?>

<a href="<?php the_permalink() ?>" title="<?php the_title() ?>" rel="<?php the_excerpt() ?>">
    <img class="usedefault" <?php echo $showImg[0]; ?> title="<?php the_title() ?>" rel="<?php the_excerpt() ?>" />
</a>

Your style would be something like...

.usedefault {
    background-image: etc...
}

Upvotes: 2

Related Questions