Képgaléria

Ebben a cikkben bemutatjuk, hogy hogyan tölthet fel képeket a termékek képgalériájába, valamint itt találja a termékfotók műszaki jellemzőire vonatkozó információkat is.

A carouselben és a bannerekben lévő képekről a Bannerek, logók és sablon fejlécek mérete bejegyzésben olvashat. A 360 fokos képekről a 360°-os képek bejegyzésben talál információkat.

Képgaléria

A Képgaléria a Termékek menüpontban a termék részletében, az Általános adatok fülön található. A termék képét a Feltöltés gombbal tudja hozzáadni.

A feltöltés után az elölnézeti fotó alatt négy ikon jelenik meg. Kitörölheti a képet, megjelenítheti az eredeti képet, megváltoztathatja a helyét a sorban.

A vízszintes vonalas ikon segítségével módosítani tudja a termék feliratát. A HTML-ben ez egy alt jel, azaz a kép alternatív felirata. A helyes és tárgyilagos felirat támogatja a SEO-t is.

Termékváltozat képe

Azokat a fotókat, amiket a terméke változataival szeretne hozzáadni, az előbbiekben leírtak szerint töltse fel a webáruházba. Bővebb információ a Képek hozzárendelése a változatokhoz bejegyzésben található.

Műszaki jellemzők

Valamennyi sablonon a 1024 px minimális képszélesség javasolt. A magasságot aszerint válassza meg, hogy milyen képarányt szeretne a sablonban használni. Az elérhető képarány most 4:3, majd 2:3, 1:1 és 3:4. A beállítást a Beállítások → Termékek → Termékek megjelenítése menüpontban végezheti el. Az alapértelmezett képarány minden sablonnál 4:3.

• 4:3 → 1364 x 1024 px
• 2:3 → 1024 x 1536 px
• 1:1 → 1024 x 1024 px
• 3:4 → 1024 x 1364 px

A régebbi Pop, Rock, Soul és Echo sablonokon más képarány nem választható. Itt a javasolt képméret mindig 1024 x 768 px.

A képfájl maximális mérete 2 MB. A JPG, PNG, GIF és WebP a megengedett formátum.

Azokat a képeket, melyek meghaladják a javasolt méreteket, a rendszer automatikusan úgy kicsinyíti le, hogy illeszkedjenek az ajánlott méretekhez. A képek nem lesznek levágva és megnyújtva. A hiányzó hely fehér színnel kerül kitöltésre.

Képek megjelenítése

A feltöltött képeket WebP formátumba konvertálja a rendszer, amikor megjeleníti őket a végfelhasználó számára, kivéve az alábbiakban felsorolt ​​eseteket. A WebP-re való átalakítás nem csak a termékfotóknál, hanem a CDN-szerverünkön tárolt összes képnél is megtörténik, ami azt jelenti, hogy ezek URL-címe a következővel kezdődik: https://cdn.myshoptet.com/usr/<domain_of_e-shop>/user/. Ez gyakorlatilag az összes e-shopba feltöltött képre vonatkozik, mint például a bannerek, logók, cikkekben található képek, stb.

A WebP-re konvertálás automatikusan történik a feltöltött fájlokból. Ezeket az előző részben említett műszaki jellemzők szerint kell feltölteni. A képek közvetlenül WebP formátumban történő feltöltése jelenleg nem lehetséges. Az átalakítás után a fájl kiterjesztése változatlan marad, így például az image.jpg WebP formátumban jelenik meg, de a kiterjesztés továbbra is .jpg lesz.

A WebP-re való átalakítás nem történik meg a következő esetekben (a szabályok nem csak a termékképekre vonatkoznak):

• a felhasználó böngészője nem támogatja a WebP formátumot
• a kép .gif, .ico vagy .svg kiterjesztéssel rendelkezik
• a fájl videoformátum-kiterjesztéssel rendelkezik, például .mp4, .mkv vagy .avi
• a fájlnév APNG-vel kezdődik, és .png kiterjesztéssel rendelkezik – ez a szabály biztosítja az animált PNG-k (APNG formátum) megfelelő megjelenítését
• a kép felbontása nagyobb, mint 75 Mpx
• A WebP-re való átalakítás váratlan okok miatt nem lehetséges

A termékképek kivágásainak URL-címei

A termékképek kivágásainál új URL-struktúrát használunk. Korábban az URL csak a kép elérési útját és a kérdőjel utáni rövid paramétert tartalmazta:

https://cdn.myshoptet.com/usr/www.webaruhaz-domain.hu/user/shop/big/165_165-batmanuv-hrnek.jpg?59393c3a

Az új URL-cím query paramétereket tartalmaz, amelyek meghatározzák a kért kivágást és annak feldolgozását, például az x és y méretet, a q minőséget, a ts időbélyeget és az sg aláírást:

https://cdn.myshoptet.com/usr/www.webaruhaz-domain.hu/user/shop/big/165_165-batmanuv-hrnek.jpg?ff=1&x=1024&y=768&q=85&r=1&ts=59393c3a&sg=df3f0411

Az URL-cím biztonsági aláírást tartalmaz (sg paraméter), amely ellenőrzi, hogy a méreteket és a további paramétereket a Shoptet hozta létre. Ha az URL-ben lévő paraméterek megváltoznak, az aláírás már nem fog egyezni, ezért így nem lehet saját kivágást létrehozni. Az új megoldás nem az URL útvonalában szereplő mappa alapján határozza meg a végeredményt, például big, related stb., hanem a query paraméterek alapján.

A korábbi URL-struktúra egyelőre támogatott. Ha a korábbi működésre van szükség, a query paraméterek között csak a ts értéket hagyja meg, például:

https://cdn.myshoptet.com/usr/www.webaruhaz-domain.hu/user/shop/big/165_165-batmanuv-hrnek.jpg?ts=59393c3a