---
title: "HTML kódy"
articleId: "htmlEditor"
lastEdited: "2026-10-27 15:29 UTC"
canonical: https://podpora.shoptet.cz/html-kody/
breadcrumb: "Shoptet Podpora / Nastavení / Vzhled"
language: cs
sections:
  - { title: "Editace HTML kódu", level: 2, url: "https://podpora.shoptet.cz/html-kody/#editace-html-kodu" }
  - { title: "Content Signals", level: 3, url: "https://podpora.shoptet.cz/html-kody/#content-signals" }
  - { title: "Délka HTML kódu", level: 2, url: "https://podpora.shoptet.cz/html-kody/#delka-html-kodu" }
  - { title: "Pravidla vkládání souborů s kódem", level: 2, url: "https://podpora.shoptet.cz/html-kody/#pravidla-vkladani-souboru-s-kodem" }
  - { title: "Obecné pokyny", level: 3, url: "https://podpora.shoptet.cz/html-kody/#obecne-pokyny" }
  - { title: "Verze souboru", level: 3, url: "https://podpora.shoptet.cz/html-kody/#verze-souboru" }
  - { title: "Soubory JS", level: 3, url: "https://podpora.shoptet.cz/html-kody/#soubory-js" }
  - { title: "Doporučení pro rychlé načítání", level: 3, url: "https://podpora.shoptet.cz/html-kody/#doporuceni-pro-rychle-nacitani" }
  - { title: "Doporučení pro rychlé načítání (určeno partnerům)", level: 3, url: "https://podpora.shoptet.cz/html-kody/#doporuceni-pro-rychle-nacitani-urceno-partnerum" }
  - { title: "Poznámka v kódu", level: 2, url: "https://podpora.shoptet.cz/html-kody/#poznamka-v-kodu" }
---

# HTML kódy

> **Varování**
>
> **Tato funkce je určena pokročilým uživatelům**, kteří mají zkušenosti s tvorbou webových stránek a ovládají HTML, CSS, a případně i Javascript. **Vložením neodborných nebo nevhodných úprav může dojít k narušení funkčnosti e-shopu**.

> **Upozornění**
>
> **Upozorňujeme, že k individuálním úpravám e-shopu pomocí HTML/CSS/JS kódu neposkytuje naše technická podpora pomoc.** Pokud potřebujete s úpravami pomoc, můžete se obrátit například na některé z našich partnerů kodérů skrz portál [Shoptet Partneři](https://partneri.shoptet.cz/profesionalove/kodovani/).

Pokud chcete či potřebujete ve svém obchodě provést úpravy pomocí vlastních HTML kódů, a HTML, CSS nebo Javascript neovládáte, můžete se s poptávkou obrátit na [někoho z našich partnerů](https://partneri.shoptet.cz/profesionalove/kodovani/).

## Editace HTML kódu

> **Tip**
>
> **Upravit vzhled vašeho obchodu, včetně úprav HTML kódu, můžete nově snadno a z jednoho místa pomocí [funkce Návrhář šablon](https://podpora.shoptet.cz/navrhar-sablon/).** Vaše úpravy kódu si v Návrháři můžete v klidu vyzkoušet a odladit předtím, než je v zveřejníte všem návštěvníkům obchodu.

Editace HTML kódu se nachází v umístění **Vzhled a Obsah → Editor → HTML kód**.

Do sekce **Záhlaví** (před koncovým tagem HEAD) se vkládají meta tagy, odkazy na CSS, JavaScripty apod. Tagy vložené na tomto místě se zobrazí v kódu mezi značkami `<head></head>`. Úpravu v této sekci dobře zvažte, abyste do kódu nevložili nějakou funkcionalitu, která by vám mohla uškodit. Do sekce **Zápatí** (před koncovým tagem BODY) můžete vkládat některé JavaScripty apod.

Pokud chcete editovat vzhled záhlaví na vašem e-shopu (tj. logo, obrázek), podívejte se na nápovědu [Záhlaví webu](https://podpora.shoptet.cz/zahlavi-e-shopu/). Do zápatí lze pak vložit [Ikonky](https://podpora.shoptet.cz/ikonky/) a [Odkazy](https://podpora.shoptet.cz/odkazy/).

Sekce **Dokončená objednávka** se používá pro sledování konverzí. Kódy se uplatní pouze na děkovací stránce objednávkového procesu. Doporučujeme místo této možnosti použit [Google Tag Manager](https://podpora.shoptet.cz/google-tag-manager/), který vám umožní zpracovat informace o objednávce.

Do sekce **Robots.txt** se obvykle vkládají direktivy, kterými zamezíte robotům vyhledávačů přístup k vybraným stránkám vašeho e-shopu. Vložený text se přidá na konec souboru robots.txt.

Do sekce **llms.txt**, kterou najdete za sekcí **Robots.txt**, můžete vložit vlastní text pro soubor llms.txt, nebo ho vygenerovat tlačítkem **Vygenerovat pomocí AI**. Více informací najdete v článku [llms.txt](https://podpora.shoptet.cz/llms-txt/).

### Content Signals

V sekci **Robots.txt** nad editorem nastavíte, k čemu smějí automatizované služby, jako jsou vyhledávače a AI nástroje, používat obsah vašeho e-shopu. Nastavení se do souboru robots.txt zapíše jako direktiva Content-Signal, nemusíte ji tedy vpisovat ručně.

- **Vyhledávače (vyhledávání)** – indexace ve vyhledávačích, odkazy a úryvky.
- **Odpovědi AI (ai-input)** – využití obsahu v odpovědích AI.
- **Trénování modelu AI (ai-train)** – trénování a dolaďování AI modelů.

U každé položky vyberete **Povolit**, **Nepovolit** nebo **Nenastaveno**. Výchozí nastavení je: vyhledávání povoleno, odpovědi AI nenastaveno a trénování modelu AI nepovoleno. Změny uložíte tlačítkem **Uložit**.

> **Upozornění**
>
> **Pokud do sekce Robots.txt vložíte vlastní text, nastavení Content Signals se neprojeví.**

## Délka HTML kódu

Do každé ze sekcí **Záhlaví**, **Zápatí**, **Dokončená objednávka** a **Robots.txt** můžete vložit validní HTML kód o maximální délce 8192 znaků. Po dosažení limitu není možné provedené změny uložit.

Pokud chcete vložit delší kód, je třeba nahrát soubor s kódem přes FTP klienta a na příslušnou část kódu odkázat. Více o informací o tomto způsobu nahrávání v článku [FTP](https://podpora.shoptet.cz/vytvoreni-ftp-uctu-v-administraci/).

## Pravidla vkládání souborů s kódem

### Obecné pokyny

Odkaz na soubor s delším kódem může vypadat v případě JavaScriptu takto: `<script src="/user/documents/modification.js" type="text/javascript"></script>` nebo v případě CSS takto: `<link href="/user/documents/style.css" rel="stylesheet" />`.

Při editaci souboru, který chcete nahrát a odkazovat na něj, se ujistěte, že máte nastaveno ve vašem editoru kódování UTF-8. Zabráníte tak, aby se české znaky změnily na �.

### Verze souboru

Přidáním `?v=CISLO_VERZE` za cestu k souboru se vynutí načtení aktuálního souboru. Například pro čtvrtou verzi aktuálního JavaScriptu napíšete odkaz takto: `<script src="/user/documents/modification.js?v4" type="text/javascript"></script>`. V žádném případě nepoužívejte timestampy.

Další možností je použít při ladění nového CSS nebo JavaScriptu placeholder `DEBUG_TIMESTAMP`, kterým vynutíte načtení aktuálního souboru při každém obnovení stránky:

```
 <script src="/user/documents/modification.js?v=#DEBUG_TIMESTAMP#"></script>
```

Aby `DEBUG_TIMESTAMP` fungoval, je potřeba vytvořit cookie `debugTimestamp` a být přihlášený pod administrátorským účtem. V konzoli zadejte:

```
 shoptet.cookie.create('debugTimestamp', 1, {days: 1});
```

### Soubory JS

V soubor JavaScriptu nepoužívejte značku `document.write()`, která blokuje hladké načítání scriptů. Pokud CSS nebo JS soubor generujete na serveru (např. PHP scriptem), doporučujeme soubor generovat s předstihem a uložit na disk, aby se při vyřizování požadavku rovnou servíroval uložený script (styl) a obsluha požadavku se nezdržovala generováním.

Při vkládání souboru JavaScriptu (JS), smí být v souboru jen samotný JavaScript. Tedy jen to, co se nachází mezi značkami `<script>` `</script>`. Tyto značky samotné ani HTML komentáře do souboru nepatří.

Nepoužívejte obfuskované JavaScripty. Google e-shopy s těmito kódy považuje za podezřelé a neodkazuje na ně v reklamách.

### Doporučení pro rychlé načítání

Pro rychlejší načítání z FTP úložiště doporučujeme URL adresy vypisovat včetně CDN prefixu.

```
<script src="https://cdn.myshoptet.com/usr/www.domena-eshopu.cz/user/documents/common.js" type="text/javascript"></script>  
<link href="https://cdn.myshoptet.com/usr/www.domena-eshopu.cz/user/documents/style.css?v=1" rel="stylesheet" />

```

### Doporučení pro rychlé načítání (určeno partnerům)

Kodérům z řad partnerů doporučujeme jako úložiště souborů CSS a JS použít FTP `/user/documents/` na jejich vlastním partnerském e-shopu. Zajistíte tak optimální rychlost doručení souboru, avšak zároveň zamezíte závislosti na dalším hosting providerovi. Doporučujeme použít URL včetně CDN prefixu, který zajistí, že nedojde k problému kvůli [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS).

```
<script src="https://cdn.myshoptet.com/usr/demo-partner.myshoptet.com/user/documents/addon_1/common.js" type="text/javascript"></script>  
<link href="https://cdn.myshoptet.com/usr/demo-partner.myshoptet.com/user/documents/addon_1/#TEMPLATE#.css" rel="stylesheet" />  
<link href="https://cdn.myshoptet.com/usr/demo-partner.myshoptet.com/user/documents/addon_1/#HOST#/style.css?v=1" rel="stylesheet" />

```

## Poznámka v kódu

Aby byl váš HTML kód přehledný, doporučujeme vkládat do něj poznámky s informacemi. Tyto poznámky vkládejte jen do HTML editoru v administraci. Poznámky nepoužívejte ve vložených souborech CSS a JS (JavaScript).

Díky poznámce se tak snáze vyznáte v tom, k čemu daná část kódu slouží, kde kód začíná a končí atp. Tyto poznámky bude prohlížeč ignorovat, uvidí je tedy jen ten, kdo kód edituje. Takovou poznámku vložíte tagem `<!--` `-->`.

Tedy například:

```
<!-- Váš název kódu Start -->  
<!-- Váš název kódu Konec -->
```