SmugMug Responsive Embeds for Wordpress

Use this tool to embed your SmugMug images responsively in Wordpress using a simple [smugmug] shortcode.

<picture>, Picturefill, and retina ready!

Using this plugin is simple. In fact an example is the best way to demonstrate it. Click here to see it live!.


[smugmug src="http://photos.onvagrancy.com/Bikerafting-Europe-2013/Albania/i-MDbNBBV/1/L/DSC01786_v1-L.jpg" align="align center"]
Packrafting on Lake Koman
[/smugmug]

Available attributes are alt, title, src, align, breakpoints, units, and basesize. The optional caption goes between the open and closing tags.

To install simply copy this code into your theme's functions.php file, then edit the two settings at the beginning.


/* RESPONSIVE SMUG MUG EMBEDDiNG */* RESPONSIVE SMUG MUG EMBEDDiNG *//
// Change these settings
global $SMUGMUG_ACCOUNT = 'YOUR-ACCOUNT-NICK-NAME';
global $SMUGMUG_API_KEY = 'YOUR-API-KEY';

// do not edit below this line
// ---------------------------

function smugmug_url( $baseurl, $width, $density ) {
    $smug_url_re = '/(http:\/\/.*\/\d)(\/(?:L|M|S|XL)\/)(.*)(-(?:L|M|S|XL))(.jpg)/';
    $templ = '$1/{W}x{W}/$3-{W}$5';
    $dim = str_replace('{W}', $width, $templ);
    $src_url = preg_replace($smug_url_re, $dim, $baseurl);
    return $src_url . ' ' . $density;
}

function smugmug_get_tree($bust_cache = false) {
    $smug_transient = 'smugmug_user_tree';
    if ( false === ( $tree = get_transient( $smug_transient ) ) || $bust_cache ) {
        $api_url = sprintf('https://api.smugmug.com/services/api/php/1.3.0/?method=smugmug.users.getTree&APIKey=%s&NickName=%s&Heavy=true', $SMUGMUG_API_KEY, $SMUGMUG_ACCOUNT);
        $result = wp_remote_get( $api_url, array( 'timeout' => 10));
        if ( is_wp_error($result) ) {
            echo $result->get_error_message();
            return false;
        }
        $parsed = unserialize($result['body']);
        if ( is_wp_error($parsed) ) {
            echo $parsed->get_error_message();
            return false;
        }
        if ($parsed['stat'] != 'ok') {
            return false;
        }
        $tree = $parsed;
        set_transient( $smug_transient, $tree, 60*60*12 ); /* 12 hours */
    }
    return $tree;
}

function smugmug_format_gallery_url($url, $tree) {
    $re = "/(http:\\/\\/.*?\\/.*?\\/.*?)\\/.*?/";
    if( preg_match($re, $url, $matches) != 1 )
        return "";
    foreach( $tree['Categories'] as $cat ) {
        if( !array_key_exists('Albums', $cat) ) continue;
        foreach( $cat['Albums'] as $alb) {
            if( strstr($alb['URL'], $matches[1]) )
                return $alb['URL'] . '/' . $alb['id'] . '_' . $alb['Key'];
        }
    }
    return "";
}

function smugmug_responsive_shortcode( $atts , $content = null ) {
    extract( shortcode_atts(
        array(
            'breakpoints' => '64,40,30',
            'units' => 'em',
            'basesize' => '16',
            'caption' => '',
            'src' => '',
            'alt' => '',
            'title' => '',
            'align' => 'aligncenter'
        ), $atts )
    );
    $content = trim($content);
    if(empty($caption) && empty($src)) {
        $src = $caption;
    } else if( !empty($src) && empty($caption) ) {
        $caption = $content;
    } else if( empty($src) && !empty($caption) ) {
        $src = $content;
    } else if( !empty($src) && !empty($caption) ) {
        return "SMUGMUG ERROR: use src or caption attributes, not both";
    }
    if( !$tree = smugmug_get_tree() ) {
        return "SMUGMUG API ERROR";
    }
    $gallery_url = smugmug_format_gallery_url( $src, $tree );
    if( !$gallery_url ) {
        if( !$tree = smugmug_get_tree(true) ) {
            return "SMUGMUG API ERROR (cached busted)";
        }
    }
    $gallery_url = smugmug_format_gallery_url( $src, $tree );
    $breakpoints = explode(',', $breakpoints);
    $source_tags = array();
    $img_tag = '';
    foreach( $breakpoints as $bp ) {
        $width_px = $bp;
        if( $units == 'em' ) {
            $width_px = $bp*$basesize;
        }
        $srcsets = array( smugmug_url($src, $width_px, '1x'), smugmug_url($src, $width_px*2, '2x'));
        $srcset = join(', ', $srcsets);
        $width = $bp . $units;
        $source_tag_fmt = '';
        $source_tag = sprintf($source_tag_fmt, $srcset, $width);
        $source_tags[] = $source_tag;
        $img_tag_fmt = '%s';
        $img_tag = sprintf($img_tag_fmt, $srcset, esc_attr($alt), esc_attr($title));
    }
    $picture_tag_fmt = '%s%s';
    $picture_tag = sprintf($picture_tag_fmt, join('', $source_tags), $img_tag);
    $anchor_fmt = '%s';
    if( !empty($gallery_url) ) {
        $picture_tag = sprintf($anchor_fmt, $gallery_url, $picture_tag);
    }
    if( !empty($caption) ) {
        $figure_tag_fmt = '
%s
%s
'; return sprintf($figure_tag_fmt, esc_attr($align), $picture_tag, $caption); } return $picture_tag; } add_shortcode( 'smugmug', 'smugmug_responsive_shortcode' ); ?>