hi @nbcommunication,
thanks for your quick response.
yes, that's what i thought, and i was hoping that there would be an easy way to reduce the image size with processwire.
i'm doing it now like this. I reduce the imagesize and do some croping to squared images via php, then save it to the temp-folder and link to this image.
$instagram = $modules->get('InstagramBasicDisplayApi');
// Get 10 images
$images = $instagram->getImages(10);
$counter = '';
echo '<div class="start_instagram uk-grid-column-small uk-grid-row-small uk-child-width-1-2@s uk-child-width-1-5@m" uk-grid>';
foreach ($images as $image) {
$counter = $counter + 1;
$instagramImageUrl = $image->src;
$imageData = file_get_contents($instagramImageUrl);
$fileName = 'instaBild' . $counter . '.jpg';
$filePath = $config->paths->assets . "instaTemp/" . $fileName;
// Verkleinere das Bild auf eine maximale Breite von 300px
$maxWidth = 300;
list($width, $height) = getimagesizefromstring($imageData);
$aspectRatio = $width / $height;
$newWidth = min($maxWidth, $width);
$newHeight = $newWidth / $aspectRatio;
// Erstelle ein leeres quadratisches Bild
$imageResized = imagecreatetruecolor($maxWidth, $maxWidth);
$imageSource = imagecreatefromstring($imageData);
// Berechne die Position für das Cropping (zentriert)
$cropX = 0;
$cropY = 0;
if ($width > $height) {
// Querformat, seitlich beschnitten
$cropX = ($width - $height) / 2;
} elseif ($width < $height) {
// Hochformat, oben und unten beschnitten
$cropY = ($height - $width) / 2;
}
// Führe das Cropping durch
imagecopyresampled($imageResized, $imageSource, 0, 0, $cropX, $cropY, $maxWidth, $maxWidth, $width - (2 * $cropX), $height - (2 * $cropY));
// Speichere das verkleinerte und beschnittene Bild
imagejpeg($imageResized, $filePath);
imagedestroy($imageResized);
imagedestroy($imageSource);
// echo $fileName . " auf " . $filePath . " gespeichert.<br>";
$tempPath = "/site/assets/instaTemp/" . $fileName;
$altDesc = $image->alt;
echo "<div>
<a href='". $image->href ."' target='insta'>
<img src='" . $tempPath . "' alt='" . $altDesc . "' title='". $altDesc ."'>
</a>
</div>";
}
echo '</div>';
?>
i think this solution is OK, since i have proCache running and so it doesn't regenerate on every page load, or am i wrong?
there are 10 images loaded which are now about 160kb in size as compared to the 3mb for the originals.
suggestions for improvements are still welcome, i wanted to make sure i hadn't overlooked any major option.