diff --git a/app/components/instagram-feed.php b/app/components/instagram-feed.php index f1c8014..1ce175a 100644 --- a/app/components/instagram-feed.php +++ b/app/components/instagram-feed.php @@ -23,7 +23,7 @@ $maxPosts = (int) config('instagram.max_posts', 9); <?= e($post['alt'] ?? 'Instagram-Beitrag des TSV 08 Kulmbach') ?> + width="640" height="800" loading="lazy" decoding="async"> diff --git a/bin/instagram-sync.php b/bin/instagram-sync.php index 28c1fda..31ecc71 100644 --- a/bin/instagram-sync.php +++ b/bin/instagram-sync.php @@ -146,7 +146,7 @@ if ($posts === []) { $fail('Keine Posts ermittelbar (Instagram blockt vermutlich die Server-IP oder hat die Struktur geändert)'); } -// --- Bilder lokal laden, auf 640px-Quadrat bringen --- +// --- Bilder lokal laden, auf Instagram-Portrait 4:5 (640x800) bringen --- if (!is_dir($imgDir)) { mkdir($imgDir, 0755, true); } @@ -167,9 +167,16 @@ foreach ($posts as $post) { } $w = imagesx($src); $h = imagesy($src); - $side = min($w, $h); - $out = imagecreatetruecolor(640, 640); - imagecopyresampled($out, $src, 0, 0, (int) (($w - $side) / 2), (int) (($h - $side) / 2), 640, 640, $side, $side); + // Mittiger Crop auf 4:5 (Instagram-Portrait), dann auf 640x800 skalieren. + if ($w / $h > 4 / 5) { + $cropH = $h; + $cropW = (int) round($h * 4 / 5); + } else { + $cropW = $w; + $cropH = (int) round($w * 5 / 4); + } + $out = imagecreatetruecolor(640, 800); + imagecopyresampled($out, $src, 0, 0, (int) (($w - $cropW) / 2), (int) (($h - $cropH) / 2), 640, 800, $cropW, $cropH); imagejpeg($out, $file, 80); } diff --git a/public/assets/css/components.css b/public/assets/css/components.css index 7a252a1..b2182ad 100644 --- a/public/assets/css/components.css +++ b/public/assets/css/components.css @@ -107,7 +107,8 @@ .instagram__link img { width: 100%; height: auto; - aspect-ratio: 1; + /* Instagram-Portrait 1080x1350 */ + aspect-ratio: 4 / 5; object-fit: cover; transition: transform var(--transition); }