Linking to Custom Post type img src

1 Views

I have set up some custom post types in WordPress and have used a field for an Image.
I have added to following to functions: 

if (function_exists('add_theme_support')) {
    add_theme_support('post-thumbnails');
}
add_image_size( 'homepage-thumb', 190, 190, true);

which has given me the option in advance custom fields to choose this as the image size displayed, however I would like to link this image to the full size version as well. Can anyone help me with this as I am at a loss of what to do from here!

Read More

Here is the code for the page: 

<?php
    $args = array(
    'post_type' => 'chairs',
    );
$query = new WP_Query( $args );?>
<?php if( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>

<?php
    $args = array(
    'post_type' => 'chairs',
    );
$query = new WP_Query( $args );?>
<?php if( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>

        <div class="item">
            <div class="grid-container productmargin-right">
                <div class="grid-4 product-image">
                    <?php $attachment_id = get_field('image');
                        $size = "homepage-thumb"; // (thumbnail, medium, large, full or custom size)
                        $image = wp_get_attachment_image_src( $attachment_id, $size );
                        // url = $image[0];
                        // width = $image[1];
                        // height = $image[2];
                        ?>
                    <img src="<?php echo $image[0]; ?>" />
                </div>

                <div class="grid-8">
                    <h2><?php the_title(); ?></h2>
                    <p><?php the_content(); ?></p>
                    <h3><?php the_field('additional_information'); ?></h3>
                </div>
            </div>
        </div> <!-- end of item -->
<?php endwhile; endif?>
Post Views: 1

Related posts

Leave a Reply

1 comment

  1. You’re already getting the URL for the custom image size. Use the same function to get the full image URL and then wrap your image in an anchor tag.

    Change this:

    <?php $attachment_id = get_field('image');
$size = "homepage-thumb"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
// url = $image[0];
// width = $image[1];
// height = $image[2];
?>
<img src="<?php echo $image[0]; ?>" />

    To:

    <?php $attachment_id = get_field('image');

// we don't need a size variable. pass size directly as a parameter.
$thumb_image = wp_get_attachment_image_src( $attachment_id, 'homepage-thumb' );

// get the full size image.
$full_image = wp_get_attachment_image_src( $attachment_id, 'full' ); ?>

<a href="<?php echo $full_image[0]; ?>">
   <img src="<?php echo $thumb_image[0]; ?>" />
</a>

    It would also be a good idea to add some validation. Make sure the image has been set before attempting to run wp_get_attachment_image_src().