Home Page Section List - Simple Image Revised July 2021

[graphicz]

Title and explanation at:

https://community.sellerdeck.com/for...esizing-images

The forum only lets you post 10 <img> tags thinking theu are images even though they are in code, so the layouts are on a number of posts - sorry!

Home Page Section List - Simple Image Revised July 2021

From :

<div class="image">

To :

<div class="caption">
<a class="text-center product-title" href="<actinic:variable name="SectionURL" />"><actinic:variable name="SectionName" /></a>
</div>
</div>

Inclusive

<div class="image">
<actinic:block if="%3cactinic%3avariable%20name%3d%22SectionImageFileName%22%20%2f%3e%20%21%3d%20%22%22">
<actinic:block php="true" >
include_once 'SimpleImage.php';
error_reporting(E_ALL & ~E_NOTICE);
$altname = '<actinic:variable name="SectionName" encoding="perl" selectable="false" /> image';
$sOrigimagehps = str_replace('\\','/', '<actinic:variable name="SectionImageFileName" encoding="perl" selectable="false" />');
$scaleddir = 'scaled/';
$simpleimagebasehps = basename($sOrigimagehps);
$hpsxlgwidth = 240;
$hpsxmdwidth = 500;
$hpsxsmwidth = 770;
$hpsxxswidth = 580;
$hpsxlgfile = $scaleddir . 'hpsxlg_' . $simpleimagebasehps;
$hpsxmdfile = $scaleddir . 'hpsxmd_' . $simpleimagebasehps;
$hpsxsmfile = $scaleddir . 'hpsxsm_' . $simpleimagebasehps;
$hpsxxsfile = $scaleddir . 'hpsxxs_' . $simpleimagebasehps;
if ( file_exists($sOrigimagehps) )
{
$hpsxlgheight = ($hpsxlgwidth*(<actinic:variable encoding="perl" name="SectionImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="SectionImageWidth" selectable="false" />)) ;
$hpsxmdheight = ($hpsxmdwidth*(<actinic:variable encoding="perl" name="SectionImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="SectionImageWidth" selectable="false" />)) ;
$hpsxsmheight = ($hpsxsmwidth*(<actinic:variable encoding="perl" name="SectionImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="SectionImageWidth" selectable="false" />)) ;
$hpsxxsheight = ($hpsxxswidth*(<actinic:variable encoding="perl" name="SectionImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="SectionImageWidth" selectable="false" />)) ;
}
try
{
if ( file_exists($sOrigimagehps) )
{
$simpleimagehps = new \claviska\SimpleImage($sOrigimagehps);
$simpleimagehps -> resize($hpsxlgwidth) -> toFile($hpsxlgfile);
$simpleimagehps -> resize($hpsxmdwidth) -> toFile($hpsxmdfile);
$simpleimagehps -> resize($hpsxsmwidth) -> toFile($hpsxsmfile);
$simpleimagehps -> resize($hpsxxswidth) -> toFile($hpsxxsfile);
}
}
catch(Exception $err)
{
// Handle errors
echo $err->getMessage();
}
</actinic:block>
</actinic:block>
<a href=<actinic:variable name="SectionURL" />" class="text-center align-items-center d-flex image-link">
<img src=<actinic:block php="true">echo "\"$hpsxlgfile\" data-src=\"$hpsxlgfile\" alt=\"$altname\" width=\"$hpsxlgwidth\" height=\"$hpsxlgheight\"";</actinic:block> class="d-none d-lg-block lazy lazyload img-responsive product-summary-image ml-auto mr-auto"/>
<img src=<actinic:block php="true">echo "\"$hpsxmdfile\" data-src=\"$hpsxmdfile\" alt=\"$altname\" width=\"$hpsxmdwidth\" height=\"$hpsxmdheight\"";</actinic:block> class="d-none d-md-block d-lg-none lazy lazyload img-responsive product-summary-image ml-auto mr-auto"/>
<img src=<actinic:block php="true">echo "\"$hpsxsmfile\" data-src=\"$hpsxsmfile\" alt=\"$altname\" width=\"$hpsxsmwidth\" height=\"$hpsxsmheight\"";</actinic:block> class="d-none d-sm-block d-md-none lazy lazyload img-responsive product-summary-image ml-auto mr-auto"/>
<img src=<actinic:block php="true">echo "\"$hpsxxsfile\" data-src=\"$hpsxxsfile\" alt=\"$altname\" width=\"$hpsxxswidth\" height=\"$hpsxxsheight\"";</actinic:block> class="d-block d-sm-none lazy lazyload img-responsive product-summary-image ml-auto mr-auto"/>
</a>
<div class="caption">
<a class="text-center product-title" href="<actinic:variable name="SectionURL" />"><actinic:variable name="SectionName" /></a>
</div>
</div>