---
title: "Obrázky produktov — Shops for Laravel | Roundly"
description: "Hlavné obrázky a galérie produktov, obrázky variantov a bannery kategórií — predvolene verejné, s responzívnymi šírkami."
url: https://roundly-consulting.com/sk/open-source/navody/shops-for-laravel/obrazky-produktov
language: sk
---

[Všetky balíky](https://roundly-consulting.com/sk/open-source.md)

[Shops for Laravel](https://roundly-consulting.com/sk/open-source/navody/shops-for-laravel.md)

# Obrázky produktov

Produkty, varianty a kategórie nesú obrázky cez media-library-for-laravel. Médiá katalógu sú predvolene verejné (vhodné pre CDN aj SEO) a generujú responzívne šírky zo shops.media.responsive\_widths. Každá skupina prijme JPEG, PNG, WebP, GIF a AVIF:

| Model | Skupina (konfiguračný kľúč) | Tvar | Pomocné metódy |
| --- | --- | --- | --- |
| `Product` | `media.featured_bucket (featured)` | Jeden súbor | `featuredImage(), featuredImageUrl()` |
| `Product` | `media.gallery_bucket (gallery)` | Viac súborov | `galleryImages(), galleryUrls(), seoImageUrl()` |
| `ProductVariant` | `media.variant_bucket (gallery)` | Viac súborov | `variantImages(), variantImageUrl(), variantImageUrls()` |
| `Category` | `media.banner_bucket (banner)` | Jeden súbor | `banner(), bannerUrl()` |

```php
$product->addMedia($file)->toMediaBucket($product->featuredBucket());   // single featured image
$product->addMedia($file)->toMediaBucket($product->galleryBucket());    // multi-image gallery

$product->featuredImage();                      // ?Media
$product->featuredImageUrl();                   // original URL ('' when empty)
$product->featuredImageUrl('responsive-640');   // a responsive width
$product->galleryImages();                      // Collection<Media>
$product->galleryUrls('responsive-320');        // list<string>
$product->seoImageUrl();                        // featured, else the first gallery image, else ''

$variant->addMedia($file)->toMediaBucket($variant->variantGalleryBucket());
$variant->variantImages();                      // Collection<Media>
$variant->variantImageUrl();                    // first variant image URL ('')
$variant->variantImageUrls();                   // list<string>

$category->addMedia($file)->toMediaBucket($category->bannerBucket());
$category->banner();                            // ?Media
$category->bannerUrl();                         // string ('')
```

## Responzívne obrázky

Skupiny nedeklarujú pomenované varianty — každá šírka z rebríka sa vygeneruje ako variant s názvom responsive-{šírka} (nikdy nie väčší ako originál). Na značky použite pomocné metódy srcset z media-library:

```php
$image = $product->featuredImage();

$image?->srcset();   // "… 320w, … 640w, …" — generated widths only, ascending
$image?->responsiveImage('', ['alt' => 'Sparkling Water', 'sizes' => '100vw']);   // a full <img> tag
```

Každá čítacia metóda prijme voliteľný názov variantu a vráti pôvodný obrázok, ak tento variant ešte nie je vygenerovaný (obrázok je užší než daná šírka alebo konverzia vo fronte ešte neprebehla), takže stránka na chýbajúcom variante nikdy nezlyhá. Názvy skupín, disk, viditeľnosť, responzívne šírky a voliteľný limit veľkosti súboru (v bajtoch) sa nastavujú v shops.media a platia pre všetky skupiny katalógu — produkt, variant aj kategóriu. Záznamy médií sú vo vlastnej tabuľke media balíka media-library, prepojené polymorfne.

## Prejavte lásku k open source

Tento balík je zadarmo pod licenciou MIT. Ak vám šetrí čas, jednorazový príspevok alebo členstvo na Patreone nám pomôže ho ďalej udržiavať, testovať a dokumentovať.

[Ďalšie spôsoby podpory vrátane kryptomien](https://roundly-consulting.com/sk/podporte-nas.md)

Odoslaním daru súhlasíte s našimi [podmienkami prijímania darov](https://roundly-consulting.com/sk/podmienky-darov.md).

[Podporte našu open-source prácu (otvorí sa v novej karte)](https://donate.stripe.com/dRmeVe8FX5PF1Qd9pXcEw00) [Pridajte sa k nám na Patreone (otvorí sa v novej karte)](https://www.patreon.com/cw/roundly)

## Chcete to zabudovať do svojho produktu?

Naše balíky integrujeme do zákazkových Laravel a AI riešení. Napíšte nám, na čom pracujete, a ozveme sa do 48 hodín.

[Ponuka do 48 hodín](https://roundly-consulting.com/sk/kontakt.md) [Prezrieť všetky balíky](https://roundly-consulting.com/sk/open-source/navody/shops-for-laravel.md)