1

How i can link all different images size upload in wordpress? I've definited different size image with the plugin simple image size so i'ld like show in single post, links to all new images example here: http://topwalls.net/brink-6/

hi this is my image.php

<?php get_header(); ?>

<div id="content" class="clearfix">

    <div id="main" class="clearfix" role="main">

        <?php while ( have_posts() ) : the_post(); ?>

            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                <header class="entry-header">
                    <div class="entry-meta">
                        <?php
                            $metadata = wp_get_attachment_metadata();
                            printf( __( 'Published <span class="entry-date"><abbr class="published" title="%1$s">%2$s</abbr></span> at <a href="%3$s" title="Link to full-size image">%4$s &times; %5$s</a> in <a href="%6$s" title="Return to %7$s" rel="gallery">%7$s</a>', 'noteworthy' ),
                                esc_attr( get_the_time() ),
                                get_the_date(),
                                wp_get_attachment_url(),
                                $metadata['width'],
                                $metadata['height'],
                                get_permalink( $post->post_parent ),
                                get_the_title( $post->post_parent )
                            );
                        ?>                                                      
                        <?php edit_post_link( __( 'Edit', 'noteworthy' ), '<span class="sep">|</span> <span class="edit-link">', '</span>' ); ?>
                    </div><!-- .entry-meta -->
                    <h1 class="entry-title"><?php the_title(); ?></h1>  
                </header><!-- .entry-header -->

                <div class="entry-content post_content">

                    <div class="entry-attachment">
                        <div class="attachment">
                            <?php
                                /**
                                 * Grab the IDs of all the image attachments in a gallery so we can get the URL of the next adjacent image in a gallery,
                                 * or the first image (if we're looking at the last image in a gallery), or, in a gallery of one, just the link to that image file
                                 */
                                $attachments = array_values( get_children( array( 'post_parent' => $post->post_parent, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'ASC', 'orderby' => 'menu_order ID' ) ) );
                                foreach ( $attachments as $k => $attachment ) {
                                    if ( $attachment->ID == $post->ID )
                                        break;
                                }
                                $k++;
                                // If there is more than 1 attachment in a gallery
                                if ( count( $attachments ) > 1 ) {
                                    if ( isset( $attachments[ $k ] ) )
                                        // get the URL of the next image attachment
                                        $next_attachment_url = get_attachment_link( $attachments[ $k ]->ID );
                                    else
                                        // or get the URL of the first image attachment
                                        $next_attachment_url = get_attachment_link( $attachments[ 0 ]->ID );
                                } else {
                                    // or, if there's only 1 image, get the URL of the image
                                    $next_attachment_url = wp_get_attachment_url();
                                }
                            ?>

                            <a href="<?php echo $next_attachment_url; ?>" title="<?php echo esc_attr( get_the_title() ); ?>" rel="attachment"><?php
                            $attachment_size = apply_filters( 'noteworthy_attachment_size', 1200 );
                            echo wp_get_attachment_image( $post->ID, array( $attachment_size, $attachment_size ) ); // filterable image width with, essentially, no limit for image height.
                            ?></a>
                        </div><!-- .attachment -->

                        <?php if ( ! empty( $post->post_excerpt ) ) : ?>
                        <div class="entry-caption">
                            <?php the_excerpt(); ?>
                        </div>
                        <?php endif; ?>
                    </div><!-- .entry-attachment -->

                    <?php the_content(); ?>
                    <?php wp_link_pages( array( 'before' => '<div class="page-link">' . __( 'Pages:', 'noteworthy' ), 'after' => '</div>' ) ); ?>

                </div><!-- .entry-content -->

                <footer class="entry-meta">
                    <?php if ( comments_open() && pings_open() ) : // Comments and trackbacks open ?>
                        <?php printf( __( '<a class="comment-link" href="#respond" title="Post a comment">Post a comment</a> or leave a trackback: <a class="trackback-link" href="%s" title="Trackback URL for your post" rel="trackback">Trackback URL</a>.', 'noteworthy' ), get_trackback_url() ); ?>
                    <?php elseif ( ! comments_open() && pings_open() ) : // Only trackbacks open ?>
                        <?php printf( __( 'Comments are closed, but you can leave a trackback: <a class="trackback-link" href="%s" title="Trackback URL for your post" rel="trackback">Trackback URL</a>.', 'noteworthy' ), get_trackback_url() ); ?>
                    <?php elseif ( comments_open() && ! pings_open() ) : // Only comments open ?>
                        <?php _e( 'Trackbacks are closed, but you can <a class="comment-link" href="#respond" title="Post a comment">post a comment</a>.', 'noteworthy' ); ?>
                    <?php elseif ( ! comments_open() && ! pings_open() ) : // Comments and trackbacks closed ?>
                        <?php _e( 'Both comments and trackbacks are currently closed.', 'noteworthy' ); ?>
                    <?php endif; ?>
                    <?php edit_post_link( __( 'Edit', 'noteworthy' ), ' <span class="edit-link">', '</span>' ); ?>
                </footer><!-- .entry-meta -->
            </article><!-- #post-<?php the_ID(); ?> -->
            <nav id="image-navigation">
                        <span class="previous-image"><?php previous_image_link( false, __( 'Previous' , 'noteworthy' ) ); ?></span>
                        <span class="next-image"><?php next_image_link( false, __( 'Next' , 'noteworthy' ) ); ?></span>
                    </nav><!-- #image-navigation -->

            <?php comments_template(); ?>

        <?php endwhile; // end of the loop. ?>

        </div>
    </div>

thanks Stew

2
  • I'm sorry, but I don't understand what you want to achieve. Could you please elaborate? You uploaded several images that you now have in several different sizes (due to the mentioned plugin), right? What do you want do now?
    – tfrommen
    Commented Mar 8, 2013 at 13:08
  • Default Wordpress make different copies of upload images, i've add with the plugin "simple image size" additionals image size format. Now i'ld like show all text link to image size avalaible for each post, exmpale: topwalls.net/brink-6 in the image bottom are linked all image size, how i can do it? Thanks
    – Stew
    Commented Mar 8, 2013 at 13:18

2 Answers 2

3

You can do this by adding this function to your funcitons.php file.

function my_get_image_size_links() {

/* If not viewing an image attachment page, return. */
if ( !wp_attachment_is_image( get_the_ID() ) )
    return;

/* Set up an empty array for the links. */
$links = array();

/* Get the intermediate image sizes and add the full size to the array. */
$sizes = get_intermediate_image_sizes();
$sizes[] = 'full';

/* Loop through each of the image sizes. */
foreach ( $sizes as $size ) {

    /* Get the image source, width, height, and whether it's intermediate. */
    $image = wp_get_attachment_image_src( get_the_ID(), $size );

    /* Add the link to the array if there's an image and if $is_intermediate (4th array value) is true or full size. */
    if ( !empty( $image ) && ( true == $image[3] || 'full' == $size ) )
        $links[] = "<li><a class='image-size-link' href='{$image[0]}'>{$image[1]} &times; {$image[2]}</a></li>";
}

/* Join the links in a string and return. */
return join( $links );
}

and then use this to display links in your theme.

<?php if ( wp_attachment_is_image( get_the_ID() ) ) { ?>
<div class="image-meta">
      <ul>
        <?php printf( __( 'Sizes: %s', 'example-textdomain' ), my_get_image_size_links() ); ?>
      </ul>
</div>
<?php } ?>

This is your modified image.php file. It should work as long as you have the code above in your functions.php file

<?php get_header(); ?>

<div id="content" class="clearfix">

<div id="main" class="clearfix" role="main">

    <?php while ( have_posts() ) : the_post(); ?>

        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
            <header class="entry-header">
                <div class="entry-meta">
                    <?php
                        $metadata = wp_get_attachment_metadata();
                        printf( __( 'Published <span class="entry-date"><abbr class="published" title="%1$s">%2$s</abbr></span> at <a href="%3$s" title="Link to full-size image">%4$s &times; %5$s</a> in <a href="%6$s" title="Return to %7$s" rel="gallery">%7$s</a>', 'noteworthy' ),
                            esc_attr( get_the_time() ),
                            get_the_date(),
                            wp_get_attachment_url(),
                            $metadata['width'],
                            $metadata['height'],
                            get_permalink( $post->post_parent ),
                            get_the_title( $post->post_parent )
                        );
                    ?>                                                      
                    <?php edit_post_link( __( 'Edit', 'noteworthy' ), '<span class="sep">|</span> <span class="edit-link">', '</span>' ); ?>
                </div><!-- .entry-meta -->
                <h1 class="entry-title"><?php the_title(); ?></h1>  
            </header><!-- .entry-header -->

            <div class="entry-content post_content">

                <div class="entry-attachment">
                    <div class="attachment">
                        <?php
                            /**
                             * Grab the IDs of all the image attachments in a gallery so we can get the URL of the next adjacent image in a gallery,
                             * or the first image (if we're looking at the last image in a gallery), or, in a gallery of one, just the link to that image file
                             */
                            $attachments = array_values( get_children( array( 'post_parent' => $post->post_parent, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => 'ASC', 'orderby' => 'menu_order ID' ) ) );
                            foreach ( $attachments as $k => $attachment ) {
                                if ( $attachment->ID == $post->ID )
                                    break;
                            }
                            $k++;
                            // If there is more than 1 attachment in a gallery
                            if ( count( $attachments ) > 1 ) {
                                if ( isset( $attachments[ $k ] ) )
                                    // get the URL of the next image attachment
                                    $next_attachment_url = get_attachment_link( $attachments[ $k ]->ID );
                                else
                                    // or get the URL of the first image attachment
                                    $next_attachment_url = get_attachment_link( $attachments[ 0 ]->ID );
                            } else {
                                // or, if there's only 1 image, get the URL of the image
                                $next_attachment_url = wp_get_attachment_url();
                            }
                        ?>

                        <a href="<?php echo $next_attachment_url; ?>" title="<?php echo esc_attr( get_the_title() ); ?>" rel="attachment"><?php
                        $attachment_size = apply_filters( 'noteworthy_attachment_size', 1200 );
                        echo wp_get_attachment_image( $post->ID, array( $attachment_size, $attachment_size ) ); // filterable image width with, essentially, no limit for image height.
                        ?></a>
                    </div><!-- .attachment -->
 <!-- Attachment Image Sizes ---->
  <?php if ( wp_attachment_is_image( get_the_ID() ) ) { ?>
  <div class="image-meta">
   <ul>
    <?php printf( __( 'Sizes: %s', 'example-textdomain' ), my_get_image_size_links() ); ?>
   </ul>
  </div>
 <?php } ?>
                    <?php if ( ! empty( $post->post_excerpt ) ) : ?>
                    <div class="entry-caption">
                        <?php the_excerpt(); ?>
                    </div>
                    <?php endif; ?>
                </div><!-- .entry-attachment -->

                <?php the_content(); ?>
                <?php wp_link_pages( array( 'before' => '<div class="page-link">' . __( 'Pages:', 'noteworthy' ), 'after' => '</div>' ) ); ?>

            </div><!-- .entry-content -->

            <footer class="entry-meta">
                <?php if ( comments_open() && pings_open() ) : // Comments and trackbacks open ?>
                    <?php printf( __( '<a class="comment-link" href="#respond" title="Post a comment">Post a comment</a> or leave a trackback: <a class="trackback-link" href="%s" title="Trackback URL for your post" rel="trackback">Trackback URL</a>.', 'noteworthy' ), get_trackback_url() ); ?>
                <?php elseif ( ! comments_open() && pings_open() ) : // Only trackbacks open ?>
                    <?php printf( __( 'Comments are closed, but you can leave a trackback: <a class="trackback-link" href="%s" title="Trackback URL for your post" rel="trackback">Trackback URL</a>.', 'noteworthy' ), get_trackback_url() ); ?>
                <?php elseif ( comments_open() && ! pings_open() ) : // Only comments open ?>
                    <?php _e( 'Trackbacks are closed, but you can <a class="comment-link" href="#respond" title="Post a comment">post a comment</a>.', 'noteworthy' ); ?>
                <?php elseif ( ! comments_open() && ! pings_open() ) : // Comments and trackbacks closed ?>
                    <?php _e( 'Both comments and trackbacks are currently closed.', 'noteworthy' ); ?>
                <?php endif; ?>
                <?php edit_post_link( __( 'Edit', 'noteworthy' ), ' <span class="edit-link">', '</span>' ); ?>
            </footer><!-- .entry-meta -->
        </article><!-- #post-<?php the_ID(); ?> -->
        <nav id="image-navigation">
                    <span class="previous-image"><?php previous_image_link( false, __( 'Previous' , 'noteworthy' ) ); ?></span>
                    <span class="next-image"><?php next_image_link( false, __( 'Next' , 'noteworthy' ) ); ?></span>
                </nav><!-- #image-navigation -->

        <?php comments_template(); ?>

    <?php endwhile; // end of the loop. ?>

    </div>
</div>

Attachment Sizes for first image in the post.

<?php
$attachments = get_children(array('post_parent' => get_the_ID(), 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'menu_order'));
    if ( ! is_array($attachments) ) continue;
        $count = count($attachments);
        $first_attachment = array_shift($attachments);
?>

<div class="image-meta">
 <p>Sizes:</p>
  <ul>
     <?php 

     $links = array();

     $sizes = get_intermediate_image_sizes();

        foreach ( $sizes as $size ) {

        /* Get the image source, width, height, and whether it's intermediate. */
        $image = wp_get_attachment_image_src( $first_attachment->ID, $size );

        $links[] = "<li><a class='image-size-link' href='{$image[0]}'>{$image[1]} &times; {$image[2]}</a></li>";

        }

    echo join(  $links ); ?>      

 </ul>
</div>
13
  • Thanks @Jacob Rambo, but i had already tried this, but it does not work
    – Stew
    Commented Mar 8, 2013 at 19:10
  • This works perfectly. Here is a test I made for you line5design.net/how-to-choose-a-web-designer/fork_in_the_road Commented Mar 8, 2013 at 20:01
  • WOW result is cool!!! but in my site not show nothing: pcgameswallpapers.com/god-of-war-4-wallpaper-hd i've placed the snipped in single.php
    – Stew
    Commented Mar 8, 2013 at 20:10
  • See my edit to my answer. Replace the function with the one i just edited and you should be good to go. You can customize the image.php to fit your needs. If you like the solution please accept it as the answer. Commented Mar 8, 2013 at 20:17
  • I have too an image.php file...how i can send to you?
    – Stew
    Commented Mar 8, 2013 at 20:19
1

I guess you're lookin for get_intermediate_image_sizes function and $_wp_additional_image_sizes variable:

$standard_image_sizes = get_intermediate_image_sizes();
global $_wp_additional_image_sizes;

Than you can loop the sizes and calling wp_get_attachment_image_src for each image size

2
  • im wp beginner, plaese can you elaborate step by step what i do? please... sure i need place this $standard_image_sizes = get_intermediate_image_sizes(); global $_wp_additional_image_sizes; in function.php file...yes?
    – Stew
    Commented Mar 8, 2013 at 13:40
  • maybe isn't easy....
    – Stew
    Commented Mar 8, 2013 at 14:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.