Prodejní iframe - vstupenky na akci přímo na vašem webu

Nemusíte návštěvníky přesměrovávat jinam – celý nákup mohou dokončit přímo na vašich stránkách. Díky tomu zůstanou na vašem webu déle a vy s nimi můžete lépe komunikovat aktuální informace o akci nebo sdílet připravované novinky.

Vložení prodejního okna (iframe) na váš web

Co je to iframe?

iframe (zkratka pro "inline frame") je speciální prvek na webové stránce, který umožňuje zobrazit obsah z jiného webu, aniž by musel uživatel stránku opustit. V tomto případě iframe zobrazí prodejní okno s možností nákupu vstupenek.

Jak vložit iframe na váš web?

• Přihlašte se do administrativního rozhraní smsticket pro pořadatele.
• Vyberte akci v prodeji, ke které chcete na vašem webu prodávat vstupenky.
• Klikněte na záložku „Promování“ a vyberte dlaždici "Prodejní iframe":

• Klikněte na modré tlačítko "Zobrazit".
• Zkopírujte kód pro vložení.
• Vložte kód na požadované místo ve zdrojovém kódu vaší stránky.
• Hotovo! Vaši zákazníci mohou začít nakupovat vstupenky přímo z vašeho webu.
• Chcete si iFrame otestovat? Můžete tak učinit zde: Festival v Parku - test – iframe

_______________________________________________________

Co jednotlivé části kódu znamenají?

• src="..." – odkazuje na obsah, který se má zobrazit (v tomto případě prodej vstupenek).
• frameborder="0" – zajišťuje, že iframe nebude mít žádné viditelné okraje.
• scrolling="no" – vypíná rolovací lišty, takže obsah iframe se přizpůsobí jeho výšce.
• allowtransparency="true" – umožňuje, aby pozadí iframu bylo průhledné, pokud to prodejní okno podporuje.
• style="height: 606px; width: 100%; max-width: 920px;" – nastavuje výchozí rozměry, aby se iframe správně zobrazil na různých zařízeních.

Dynamické přizpůsobení velikosti iframu

class="smsticket-iframe" je nutná kvůli automatickému přizpůsobování výšky. style="height: 606px" kvůli nastavení výchozí výšky pokud akce není v prodeji, je vyprodaná nebo už předprodej skončil. Vložený skript zajistí, že výška iframu se automaticky upraví podle obsahu. To znamená, že se prodejní okno bude měnit podle potřeby a nebude zabírat zbytečně moc nebo málo místa.

_______________________________________________________

Přizpůsobení iframu pro různé jazyky

Prodejní okno (iframe) lze zobrazit v různých jazycích. Stačí upravit adresu v parametru src podle požadovaného jazyka:

• Čeština: cs (výchozí)
• Angličtina: en
• Slovenština: sk
• Němčina: de

Například:

<iframe src="https://www.smsticket.cz/api/widgets/event-sale/v2/en/{id-akce}?eventInfo=false"></iframe>

Tímto způsobem se iframe zobrazí v angličtině.

_______________________________________________________

Přizpůsobení iframu pomocí URL parametrů

Prodejní okno (iframe) lze upravit pomocí parametrů v adrese src. Stačí ke konci URL přidat otazník ? a následně parametry ve formátu název=hodnota. Více parametrů se odděluje znakem &.

Dostupné parametry:

• eventInfo – určuje, zda se v iframu zobrazí informace o akci (název, místo konání, plakát).
  • false – informace o akci se nezobrazí (výchozí nastavení).
  • true – informace se zobrazí.

Příklad URL s parametry:

<iframe src="https://www.smsticket.cz/api/widgets/event-sale/v2/cs/{id-akce}?eventInfo=true"></iframe>

Tento kód zobrazí prodejní okno v češtině a s detaily o akci.

_______________________________________________________

Automatické přizpůsobení velikosti iframu

Iframe má přednastavenou výšku 606px, což zajistí správné zobrazení, i když:

• Akce není v prodeji,
• Je vyprodaná,
• Předprodej skončil.

Díky vloženému skriptu se výška iframu automaticky upravuje podle obsahu, takže se přizpůsobí velikosti prodejního okna.

_______________________________________________________

Jak iframe vypadá na mobilu a různých obrazovkách?

Na responzivních webech (tedy webech, které se správně zobrazují na mobilech, tabletech i počítačích) se iframe automaticky přizpůsobuje šířce stránky.

• Maximální šířka iframu je 960 px.
• Pokud je šířka stránky 600 px nebo méně, iframe se přepne do jednosloupcového zobrazení, aby byl obsah dobře čitelný na mobilních zařízeních.

Tento mechanismus zajistí, že iframe správně zapadne do designu vašeho webu a nebude narušovat rozvržení stránky.

_______________________________________________________

Jak vložit iframe do webu na WordPressu nebo Drupalu?

Pokud používáte redakční systémy jako WordPress nebo Drupal, iframe můžete vložit přímo do stránky nebo článku pomocí kódu.

⚠️ Důležité:
Některé pluginy mohou způsobit problémy s načítáním iframu, například WP Rocket s funkcí LazyLoading. Pokud iframe nefunguje správně, doporučujeme LazyLoading pro iframy vypnout.

_______________________________________________________

Pokud vás zajímají další nástroje pro zvýšení online prodeje, doporučujeme projít náš článek Bezplatné nástroje na propagaci a prodej vstupenek na vaše akce.