load a different version of the image

[jova313]

This is not really an issue, but a question:

I'm trying to edit a wordpress theme were this script is used (http://clapat.ro/themes/soho-wordpress/soho_portfolio/sexy-woman/). I would like to load a bigger image while intense zoom is activated.

How could I get this result?

I figured i could use 2 different images: 1 normal (for example: image-one.png) and one bigger one (= same image but bigger) (for example: image-one-tag.png).

Is it possible to ad something to the code, to add something (-tag) to the image source so the bigger image is shown instead of the original one while 'zooming'?

I'm not really used to using scripts so i'm not really sure how to handle this...

Thank you in advance,

Jonas

[tholman]

Hey there. Yep, you sure can.

Here in your code (http://d.pr/i/Cm7v/12YUe0t0) ... you can see the data-image tag, which is linking to the same image as the background image of the element above it... if you change the data-image to a larger image, you'll get the result you're looking for :)

[jova313]

Thank you for your (very) quick response! Only problem is that the image source is automatically generated. I can't manually link another image for data-image.

I found this peace of code:

// retrieve images from the attached gallery
    $gallery = soho_get_post_meta( SOHO_THEME_OPTIONS, get_the_ID(), 'soho-opt-portfolio-slider-gallery' );
    $images_gallery = array();
    if( $gallery ){

        $images_gallery = explode(',', $gallery);
    }

    if( ! empty( $images_gallery ) ){

        foreach( $images_gallery as $image_id ){

            $image = wp_get_attachment_image_src( $image_id, "full" );
            $image_path = trim( $image[0] );

            if( $image_path ){
?>              
            <li style="background-image:url(<?php echo esc_url( $image_path ); ?>)">
                <div class="intense-zoom" data-image="<?php echo esc_url( $image_path ); ?>">
            </li>              

<?php           
            }
        }
    }
    else {

        echo wp_kses_post( __('<h5>There are no images in the gallery attached to this project. You need to create at least one under Portfolio item options.</h5>', 'soho') );
    }

?>

                </ul>
            </div>

Do you think it would work if i add some code which adds something to the image path, so it links to another image? Or isn't this possible?

Thank you!

[tholman]

Yeah, you'll want to put in the different url in this line

<div class="intense-zoom" data-image="<?php echo esc_url( $image_path ); ?>">