Gallery - custom html for inserting images

Question

I have gallery (I'm using Cleaner Gallery plugin) with many images. I want to add asynchronous image loading with jQuery (I'm using JAIL to do that). But to use this JAIL plugin I need to change gallery output (need to use data-href tag with link to image). How can I do that? I've been trying to edit cleaner-gallery.php inside my plugin directory but id does not change anything!

@edit: Changing cleaner-gallery.php doesn't give wanted output. I don't know why but maybe I have to edit some function from wp-includes/media.php? Do you know what function should I overwrite?

Answer 1

In cleaner-gallery.php make changes to the cleaner_gallery_plugin_gallery_image function that starts on line 122 and ends on line 151.

What we are doing is replacing href with data-href in the two instances that output the html with the image attributes.

function cleaner_gallery_plugin_gallery_image( $image, $id, $attr, $instance ) {

    /* If the image should link to nothing, remove the image link. */
    if ( 'none' == $attr['link'] ) {
        $image = preg_replace( '/<a.*?>(.*?)<\/a>/', '$1', $image );
    }

    /* If the image should link to the 'file' (full-size image), add in extra link attributes. */
    elseif ( 'file' == $attr['link'] ) {
        $attributes = cleaner_gallery_link_attributes( $instance );

        if ( !empty( $attributes ) )
            $image = str_replace( '<a href=', "<a{$attributes} data-href=", $image );
    }

    /* If the image should link to an intermediate-sized image, change the link attributes. */
    elseif ( in_array( $attr['link'], get_intermediate_image_sizes() ) ) {

        $post = get_post( $id );
        $image_src = wp_get_attachment_image_src( $id, $attr['link'] );

        $attributes = cleaner_gallery_link_attributes( $instance );
        $attributes .= " data-href='{$image_src[0]}'";
        $attributes .= " title='" . esc_attr( $post->post_title ) . "'";

        $image = preg_replace( '/<a.*?>(.*?)<\/a>/', "<a{$attributes}>$1</a>", $image );
    }

    /* Return the formatted image. */
    return $image;
}

Answer 2

Are you caching your site?

If not, the function cleaner_gallery_plugin_gallery_image in cleaner-gallery.php (v0.9.2) works with the variable $image. This is the image HTML as a string. Some regex magic should then be able to achieve what you want.