We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 18830
    • 161 Posts
    Here is a littel snippet that together with an image-TV and an text-TV will change the class of an image according to it’s with. It will output the image and the caption in a definition list and it will also height and width to the img-element.

    <?php
    $base = $_SERVER['DOCUMENT_ROOT'];
    $class='';
    $caption='';
    $tvout=$modx->getTemplateVarOutput('caption_image',$modx->documentIdentifier);
    if($tvout['caption_image']!='') $caption.=$tvout['caption_image'];
    $tvout=$modx->getTemplateVarOutput('image',$modx->documentIdentifier);
    if($tvout['image']!='') $src.=$tvout['image'];
    $url=parse_url($src);
    $path=$url['path'];
    $file=$base.'/'.$path;
     
    $alt = basename($file);
    $alt = ereg_replace('_','',$alt);
    $alt = ereg_replace('^(.*)\.[a-zA-Z]*$','\\1',$alt);
    $alt = ucfirst($alt);
    
    if(file_exists($file) && !is_dir($file)) {
        list($w, $h) = getimagesize($file);
     if($w=='250'){
    $output = <<<EOD
    <dl class="left"><dt><img src="/{$src}" alt="{$alt}" title="{$caption}" width="{$w}" height="{$h}" /></dt><dd>{$caption}</dd></dl>
    EOD;
    }
     if($w=='390'){
    $output = <<<EOD
    <dl class="top"><dt><img src="/{$src}" alt="{$alt}" title="{$caption}" width="{$w}" height="{$h}" /></dt><dd>{$caption}</dd></dl>
    EOD;
    }
    }
    return $output;
    ?>
    


    How to use: First create a new snippet called if_image and copy the code to it. At the end of the snippet set the width of the images - in this example 250px and 390px - and define the class names according to your needs. Save.

    Create an image-TV with the name of image and a text-TV that you should call caption_image.

    Call the snippet with [[if_image]].

    That’s all.