{"id":689,"date":"2021-07-05T14:02:18","date_gmt":"2021-07-05T13:02:18","guid":{"rendered":"https:\/\/www.graphicz.co.uk\/blog\/?p=689"},"modified":"2021-07-05T14:08:08","modified_gmt":"2021-07-05T13:08:08","slug":"serving-scaled-images-resizing-images","status":"publish","type":"post","link":"https:\/\/www.graphicz.co.uk\/blog\/serving-scaled-images-resizing-images\/","title":{"rendered":"Serving Scaled Images – Resizing images"},"content":{"rendered":"\n

In July 2020 I wrote about resizing images using a php script called Simple Image (https:\/\/community.sellerdeck.com\/forum\/sellerdeck-ecommerce-software\/sellerdeck-desktop-v18\/552425-page-load-times?p=552830#post552830<\/a>)

I have been developing the concept and along with some valuable input from Norman Rouxell of drillpine.biz<\/a> regarding using the script with a Bootstrap site (Swift for example) am now using the following way of serving scaled images appropriate to viewport. It also gives the appropriate width and height for each image which also helps SEO.

You need to download the simpleImage.php script from https:\/\/github.com\/claviska\/SimpleImage<\/a>

Please note, this is now version 3.6.3 and it differs from earlier versions in having the line<\/p>\n\n\n\n

namespace claviska;<\/code><\/pre>\n\n\n\n
So that when the script is called you need to use:<\/p>\n\n\n\n
$image = new \\claviska\\SimpleImage();<\/code><\/pre>\n\n\n\n
and not as previously:<\/p>\n\n\n\n
$image = new SimpleImage();<\/code><\/pre>\n\n\n\n
You need to create a folder in the Site folder called ‘scaled’.

The layouts that are modified are as follows:

Before you start take a site snapshot!<\/strong>

Then copy these layouts in the design library so you have backups:<\/p>\n\n\n\n