Omlouváme se, tato položka je k dispozici pouze v Slovenčina.

Návod pre video galériu produktov pre Shoptet

Na tejto stránke nájdete jednoduchý návod pre Shoptet doplnok Video galéria produktov, ktorý vám poskytne základné informácie nastavení spolu s možnosťami nastavenia a prispôsobenia doplnku.

Ako nastaviť video do produktovej galérie:

Priradenie videí k produktu funguje pomocou popisných parametrov (nastavené parametre pre video sa na e-shope nebudú zobrazovať). K jednému produktu môžete priradiť viacero videí z rôznych zdrojov, tiež je možné nastaviť rôzne videá pre iné cudzie jazyky – slovenské alebo české video pre domáci trh, anglické pre shop v anglickom jazyku.

Název parametru – sem sa zadáva text video_X .. kde X je poradie videa v galérii, tj. ak zadáte video_3, video bude za druhou fotkou tretie v poradí.
Hodnota popisného parametru – sem sa zadáva url adresa na video, link zo správcu súborov ak nahráte vlastné video (.mp4) alebo link z YouTube, YouTube Shorts, Vimeo. Vlastné videá iného formátu ako .mp4 nie je možné prehrávať.
Vysvětlivka názvu parametru – url na náhľadový obrázok, rozmer postačuje 200x200px, zobrazuje sa len v menších náhľadových fotografiách pod galériou v prípade, ak využívate priame prehrávanie videí v galérii. Ak videá prehrávate až po kliku v popup okne, odporúčam nastaviť náhľadovú fotografiu rovnakej veľkosti, ako hlavná produktová fotka.

Ak sa nezadá žiadna url obrázku, zobrazí sa biele pozadie s tlačidlom play. Pri YouTube, YouTube Shorts a Viemo sa zobrazí náhľadová fotka videa automaticky v prípade, ak nenastavíte žiadny vlastný obrázok.

Konfigurátor galérie

Pomocou jednoduchého konfigurátora si môžete prispôsobiť vzhľad a možnosti videí v galérii. Výsledný kód skopírujete a vložíte do editora, ktorý nájdete v administrácii vašeho obchodu v časti Vzhľad a obsah – Editor – záložka HTML kód.

Príklad umiestnenia vygenerovaného kódu v administrácii Shoptet:

Záhlavie (pred uzátvárajúcím tagom HEAD)

Pätička (pred uzátvárajúcím tagom BODY)

Pre developerov - sledovanie eventov v konzole

Galéria vysiela vlastné DOM eventy, ktoré môžete počúvať vo svojom custom JS kóde. Vďaka tomu môžete reagovať na dianie v galérii bez toho, aby ste menili jej kód.

document.addEventListener('jgmProductVideoGallery:init', function() {
    console.log('[JGM] Galéria načítaná');
});

document.addEventListener('jgmProductVideoGallery:slideChange', function(e) {
    console.log('[JGM] Slide:', e.detail.index);
});

document.addEventListener('jgmProductVideoGallery:videoPlay', function() {
    console.log('[JGM] Video spustené');
});

document.addEventListener('jgmProductVideoGallery:videoPause', function() {
    console.log('[JGM] Video pauznuté');
});

document.addEventListener('jgmProductVideoGallery:fancyboxOpen', function() {
    console.log('[JGM] Lightbox otvorený');
});

document.addEventListener('jgmProductVideoGallery:fancyboxClose', function() {
    console.log('[JGM] Lightbox zatvorený');
});