New Product - 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!

New Product - Simple Image Revised July 2021

Compact New Products Item

<actinic:block if="%3cactinic%3avariable%20name%3d%22ProductImageFileName%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="ProductName" encoding="perl" selectable="false" /> image';
$sOrigimagenp = str_replace('\\','/', '<actinic:variable name="ProductImageFileName" encoding="perl" selectable="false" />');
$scaleddir = 'scaled/';
$simpleimagebase = basename($sOrigimagenp);
$nplgwidth = 240;
$npmdwidth = 500;
$npsmwidth = 770;
$npxswidth = 580;

$nplgfile = $scaleddir . 'nplg_' . $simpleimagebase;
$npmdfile = $scaleddir . 'npmd_' . $simpleimagebase;
$npsmfile = $scaleddir . 'npsm_' . $simpleimagebase;
$npxsfile = $scaleddir . 'npxs_' . $simpleimagebase;
if ( file_exists($sOrigimagenp) )
{
$nplgheight = ($nplgwidth*(<actinic:variable encoding="perl" name="ProductImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="ProductImageWidth" selectable="false" />)) ;
$npmdheight = ($npmdwidth*(<actinic:variable encoding="perl" name="ProductImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="ProductImageWidth" selectable="false" />)) ;
$npsmheight = ($npsmwidth*(<actinic:variable encoding="perl" name="ProductImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="ProductImageWidth" selectable="false" />)) ;
$npxsheight = ($npxswidth*(<actinic:variable encoding="perl" name="ProductImageHeight" selectable="false" />/<actinic:variable encoding="perl" name="ProductImageWidth" selectable="false" />)) ;
}
try
{
if ( file_exists($sOrigimagenp) )
{
$simpleimagenpl = new \claviska\SimpleImage($sOrigimagenp);
$simpleimagenpl -> resize($nplgwidth) -> toFile($nplgfile);
$simpleimagenpl -> resize($npmdwidth) -> toFile($npmdfile);
$simpleimagenpl -> resize($npsmwidth) -> toFile($npsmfile);
$simpleimagenpl -> resize($npxswidth) -> toFile($npxsfile);
}
}
catch(Exception $err)
{
// Handle errors
echo $err->getMessage();
}
</actinic:block>
</actinic:block>


<div class="image">
<a class="d-flex align-items-center justify-content-center overflow-hidden" href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable name="ProductID" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e" >&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>">
<actinic:block if="%3cactinic%3avariable%20name%3d%22ProductImageFileName%22%20%2f%3e%20%21%3d%20%22%22" >
<img class="d-none d-lg-block lazyload lazy img-responsive" src=<actinic:block php="true">echo "\"$nplgfile\" data-src=\"$nplgfile\" alt=\"$altname\" width=\"$nplgwidth\" height=\"$nplgheight\"";</actinic:block> title="<actinic:variable encoding="strip" name="ProductName" />" >
<img class="d-none d-md-block d-lg-none lazyload lazy img-responsive" src=<actinic:block php="true">echo "\"$npmdfile\" data-src=\"$npmdfile\" alt=\"$altname\" width=\"$npmdwidth\" height=\"$npmdheight\"";</actinic:block> title="<actinic:variable encoding="strip" name="ProductName" />" >
<img class="d-none d-sm-block d-md-none lazyload lazy img-responsive" src=<actinic:block php="true">echo "\"$npsmfile\" data-src=\"$npsmfile\" alt=\"$altname\" width=\"$npsmwidth\" height=\"$npsmheight\"";</actinic:block> title="<actinic:variable encoding="strip" name="ProductName" />" >
<img class="d-block d-sm-none lazyload lazy img-responsive" src=<actinic:block php="true">echo "\"$npxsfile\" data-src=\"$npxsfile\" alt=\"$altname\" width=\"$npxswidth\" height=\"$npxsheight\"";</actinic:block> title="<actinic:variable encoding="strip" name="ProductName" />" >
</actinic:block>
<actinic:block if="%3cactinic%3avariable%20name%3d%22ProductImageFileName%22%20%2f%3e%20%3d%3d%20%22%22" >
<img src="<actinic:variable name="DefaultProductImage" />" class="lazyload lazy img-responsive" data-src="<actinic:variable name="DefaultProductImage" />" title="<actinic:variable encoding="strip" name="ProductName" />">
</actinic:block>
</a>
</div>
<div class="caption">
<a class="product-name" href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable encoding="url" name="ProductID" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e" >&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>">
<span><actinic:variable name="ProductName" /></span>
</a>
<div class="col-12">
<div class="product-price-sec">
<Actinic:PRICES PROD_REF="<actinic:variable name="ProductID" />" RETAIL_PRICE_PROMPT="<actinic:variable name="ProductPriceDescription" />">
<actinic:variable name="PriceListRetail" value="Standard Retail Price List" />
</Actinic:PRICES>
</div>
</div>
</div>
<p class="product-info">
<a class="add-to-cart-btn" href="<actinic:variable name="SearchCGIURL" />?PRODREF=<actinic:variable encoding="url" name="ProductID" />&amp;NOLOGIN=1<actinic:block if="%3cactinic%3avariable%20name%3d%22IsHostMode%22%20%2f%3e" >&amp;SHOP=<actinic:variable name="ShopID" /></actinic:block>">
<img src="cart-icon-w.png" class="cartIcon" alt="">
</a>
</p>