Add Video overlay Icon to Zenphoto Thumbnails

  • Edit zp-coretemplate-functions.php, look for printCustomSizedImage() function and edit it to switch to using style=”background:url(‘’)” as shown below.
  • Configure overlay image:
    • Start with a completely transparent png the same height and width as your thumbnails (168 pixels in my case)
    • Find a preferred icon for the image (perhaps via Google Image Search) and paste that into your transparent background…
    • downsizing and hiding it in a corner is a nice effect
    • as well as adding a little bit of transparency

For example:
Video_Overlay

function printCustomSizedImage($alt, $size, $width=NULL, $height=NULL, $cropw=NULL, $croph=NULL, $cropx=NULL, $cropy=NULL, $class=NULL, $id=NULL, $thumbStandin=false, $effects=NULL) {
    global $_zp_current_image;
    if (is_null($_zp_current_image)) return;
    if (!$_zp_current_image->getShow()) {
        $class .= " not_visible";
    }
    $album = $_zp_current_image->getAlbum();
    $pwd = $album->getPassword();
    if (!empty($pwd)) {
        $class .= " password_protected";
    }
    if ($size) {
        $dims = getSizeCustomImage($size);
        $sizing = ' width="'.$dims[0].'" height="'.$dims[1].'"';
    } else {
        $sizing = '';
        if ($width) $sizing .= ' width="'.$width.'"';
        if ($height) $sizing .= ' height="'.$height.'"';
    }
    if ($id) $id = ' id="'.$id.'"';
    if ($class) $id .= ' class="'.$class.'"';
    if (isImagePhoto() || $thumbStandin) {
                      /* $html = '<img src="' . pathurlencode(getCustomImageURL($size, $width, $height, $cropw, $croph, $cropx, $cropy, $thumbStandin, $effects)) . '"' . */
        $html = '<img src="' . VideoOverlayIcon(pathurlencode(getCustomImageURL($size, $width, $height, $cropw, $croph, $cropx, $cropy, $thumbStandin, $effects))) . '"' .
            ' alt="' . html_encode($alt) . '"' .
            $id .
            $sizing .
            ' />';
        $html = zp_apply_filter('custom_image_html', $html, $thumbStandin);
        echo $html;
    } else { // better be a plugin
        echo $_zp_current_image->getBody($width, $height);
    }
}
 
function VideoOverlayIcon($url)
{
    if (isImageVideo()) return '/Photos/albums/Video_Overlay.png" style="background:url(' . $url . ')';
    else return $url;
}

Leave a Reply