Vlastní kód#
Vložení vlastního CSS, JavaScriptu nebo cizího snippetu do stránek webu — bez přístupu k souborům na serveru.
Najdete ho v Web → Stránky → Vlastní kód (skupina Web v levém sloupci).
Není to náhrada za úpravu šablony
Vložený kód se nekontroluje ani neupravuje — spustí se přesně tak, jak ho napíšete. Chyba v CSS rozbije vzhled stránek, na kterých kód běží, chyba v JavaScriptu jejich funkce. Na trvalou úpravu vzhledu patří šablona; tohle je na to, co je potřeba hned nebo jednorázově: měřicí kód, drobná oprava stylu, snippet od dodavatele.
Kdo sem smí, ovládá web
JavaScript vložený do stránky vidí všechno, co na ní návštěvník dělá — včetně toho, co píše do formulářů, a včetně přihlášení. Vlastní kód má proto vlastní skupinu oprávnění Vlastní kód v Role a privilégia, kterou je potřeba přidělit zvlášť. Kdo smí do Nastavení, sem automaticky nesmí.
| Oprávnění | Co dovolí |
|---|---|
| zobrazení | otevřít výpis a kódy číst; bez něj položka v menu ani záložka u stránky nejsou |
| založení / úprava / smazání | vytvořit, změnit, smazat kód v knihovně |
| přiřazení ke stránkám | měnit kódy v záložce Vlastní kód u stránky a používat akce Přidat na všechny / Odebrat ze všech |
Jak to funguje: knihovna a přiřazení#
Obrazovka Vlastní kód je knihovna: každý kód se tu založí a upravuje jen jednou. Sám od sebe ale nikde neběží — na stránce se spustí jen tehdy, když je k ní přiřazený. Jak kód ke stránkám přiřadit, popisuje oddíl Na kterých stránkách kód běží.
Ve výpisu knihovny vidíte u každého kódu:
| Sloupec | Co ukazuje |
|---|---|
| Název | popis kódu |
| Typ, Umístění | jak a kam se kód vloží — viz níže |
| Souhlas s cookies | kategorii, na jejíž povolení kód čeká, nebo spustit vždy |
| Aktivní | přepínač — kliknutím kód zapnete nebo vypnete rovnou ve výpisu |
| Kde | na kolika stránkách kód je (3 stránky); pomlčka = zatím nikde |
| Pořadí | v jakém pořadí se kódy vkládají |
Co se u každého kódu vyplňuje#
Kód založíte tlačítkem přidat nad výpisem, upravíte akcí editovat v jeho řádku.
| Pole | K čemu je | Když ho nevyplníte |
|---|---|---|
| Aktivní / Neaktivní (přepínač nahoře) | vypnutý kód zmizí ze všech stránek, ale zůstane uložený i přiřazený | nový kód je zapnutý |
| Popis | pro vás — ať za rok víte, co to je a proč tam je; ve výpisu je to sloupec Název | formulář se neuloží: Pojmenujte vložený kód. |
| Typ | CSS / JavaScript / HTML (cizí snippet) — viz níže | nejde — nový kód má předvybrané CSS |
| Umístění | kam do stránky se kód vloží | nejde — nový kód má předvybranou Hlavičku |
| Souhlas s cookies | má kód počkat na souhlas návštěvníka? | — spustit vždy —: kód běží bez ohledu na cookie lištu |
| Pořadí | čím nižší číslo, tím dřív se kód vloží; při shodě dřív ten starší | uloží se 0; záporné číslo se také uloží jako 0 |
| Kód | vlastní obsah | uloží se; ve stránce pak vznikne jen prázdná značka, nic se nestane |
| Přidávat na nově vytvořené stránky | každá nově založená stránka dostane tenhle kód automaticky | nové stránky ho nedostanou |
Pod formulářem je oddíl Použito na se seznamem stránek, ke kterým je kód přiřazený (název stránky je odkaz na její úpravu). Nahoře vedle přepínače jsou tlačítka Přidat na všechny a Odebrat ze všech — dělají totéž co akce ve výpisu.
Vypnout je lepší než smazat
Když něco nefunguje, přepněte kód na Neaktivní a uložte (nebo ho vypněte přepínačem ve výpisu). Kód zůstane uložený i přiřazený ke stránkám, takže stačí ho zase zapnout — a hledání viníka je otázka jednoho kliknutí.
Smazání kódu je nevratné
Smazaný kód (akce odstranit) zmizí z knihovny i ze všech stránek, ke kterým byl přiřazený. Zpátky ho dostanete jen tak, že ho založíte znovu a znovu přiřadíte.
Typ určuje, jak se kód vloží#
| Typ | Co napíšete | Co vznikne ve stránce |
|---|---|---|
| CSS | jen pravidla, .trida { color: red; } |
<style>…</style> |
| JavaScript | jen kód, bez značek | <script>…</script> |
| HTML (cizí snippet) | celý snippet i se značkami | vloží se přesně tak, jak je |
U CSS a JS značky nepište
Obalující <style> nebo <script> doplní systém sám a uzavírací </style>,
resp. </script> z vašeho kódu vyřízne. Když značky napíšete taky, zůstane ve
stránce navíc otevírací značka — CSS se pak částečně nepoužije a JavaScript se
nespustí vůbec.
Typ HTML je pro cizí snippety
Kód od dodavatele (chatovací okno, reklamní pixel) si obvykle nese vlastní značky
včetně <script src="…">. Ten patří sem — přenesete ho schránkou beze změn. Na
cookie lištu ale takový kód čekat neumí, viz níže.
Umístění#
| Volba | Kam se vloží | Kdy ji použít |
|---|---|---|
Hlavička (<head>) |
do <head> |
styly a knihovny, které musí být načtené dřív než obsah |
Začátek stránky (za <body>) |
hned za <body> |
co si to výslovně žádá — typicky <noscript> část Tag Manageru |
Konec stránky (před </body>) |
před </body> |
skripty, které mají počkat, až je stránka hotová |
Skript dejte na konec stránky
Skript v hlavičce brzdí vykreslení — prohlížeč ho musí stáhnout a spustit dřív, než ukáže obsah. Na konci stránky se to na rychlosti neprojeví. CSS naopak patří do hlavičky, jinak stránka chvíli bliká v původním vzhledu.
Souhlas s cookies#
Ukládá váš kód cookies nebo posílá data někam ven? Vyberte kategorii (Analytické cookies, Marketingové cookies). Kód se pak spustí až ve chvíli, kdy návštěvník tu kategorii na cookie liště povolí — do té doby leží ve stránce nečinný.
Nabízejí se přesně kategorie z cookie lišty
Seznam není zvláštní nastavení téhle obrazovky — je to týž seznam, ze kterého se skládá okno Nastavení cookies, jen bez Nezbytných (ty jsou udělené vždy, takže by se od volby „spustit vždy“ nelišily). Přibude-li na webu nová kategorie, objeví se tady sama. Přidává ji vývojář v konfiguraci, ne administrátor.
Bez kategorie se kód spustí vždy
Volba — spustit vždy — znamená, že cookie lišta na váš kód nemá vliv. U měřicího skriptu nebo reklamního pixelu to znamená, že web měří i návštěvníky, kteří to odmítli — a neodpovídá tomu, co jim na liště slíbil.
Na souhlas umí čekat jen typ JavaScript
- HTML: cizí snippet si nese vlastní značky, takže na nich není co přenastavit. Formulář proto kód typu HTML s vybranou kategorií neuloží a u pole ukáže chybu. Řešení: přepište snippet na typ JavaScript (viz Postup: vložit měřicí kód), nebo kategorii nechte prázdnou.
- CSS: kategorii formulář přijme, ale styl se použije hned, bez čekání na souhlas — výpis přitom ve sloupci Souhlas s cookies kategorii ukazuje. U CSS kategorii nevyplňujte.
Na kterých stránkách kód běží#
Na stránce běží přesně ty aktivní kódy, které jsou k ní přiřazené. Kolik stránek kód má, ukazuje ve výpisu sloupec Kde, které to jsou, oddíl Použito na v úpravě kódu.
| Jak kód přiřadit | Kde to uděláte |
|---|---|
| na všechny stávající stránky | akce Přidat na všechny v řádku kódu (nebo tlačítko v úpravě kódu) |
| na stránky, které teprve vzniknou | zaškrtávátko Přidávat na nově vytvořené stránky v úpravě kódu |
| na jednu stránku | Web → Stránky → Přehled stránek, úprava stránky, záložka Vlastní kód |
Na všechny znamená opravdu všechny stránky webu včetně systémových (košík, přihlášení a podobně). V jakém pořadí se kódy na stránce vloží, určuje Pořadí kódu v knihovně — ne pořadí řádků v záložce stránky.
Záložka Vlastní kód u stránky#
V úpravě stránky je vedle záložky Stránka záložka Vlastní kód se seznamem kódů, které na stránce běží. U každého je vidět typ a umístění a odkaz upravit v knihovně. Obsah kódu se tu měnit nedá, jen se přiřazuje.
- Přidat kód přidá řádek, ve kterém kód vyberete z knihovny (napíšete část názvu, nebo tlačítkem Vyhledat otevřete výběr).
- Ikona koše u řádku kód ze stránky odebere. Z knihovny ani z jiných stránek nezmizí.
- Změny se projeví až po uložení stránky.
- U nové stránky je seznam předvyplněný kódy se zaškrtnutým Přidávat na nově vytvořené stránky. Který tu stránku mít nemá, před uložením odeberte.
Bez oprávnění k přiřazování je záložka jen pro čtení. Bez oprávnění k zobrazení vlastního kódu se záložka vůbec neukáže — nová stránka pak kódy s Přidávat na nově vytvořené stránky dostane i tak.
Přidávat na nově vytvořené stránky se netýká stránek, které už jsou
Zaškrtnutím se kód na existující stránky nedostane — k tomu je akce Přidat na všechny. A naopak: Odebrat ze všech zaškrtávátko nezruší, takže každá další nová stránka kód zase dostane.
Postup: vložit měřicí kód#
Google Analytics a Tag Manager tudy nevkládejte — mají vlastní kartu v Napojení třetích stran, která na cookie lištu čeká sama. Tenhle postup je pro ostatní měřicí a reklamní nástroje.
- V levém sloupci otevřete Web → Stránky → Vlastní kód.
- Klikněte na přidat.
- Do Popisu napište, co to je (například Měření návštěvnosti — Hotjar).
- Typ přepněte na JavaScript a ze snippetu vložte jen to, co je mezi
<script>a</script>. - Umístění dejte Konec stránky (před
</body>). - V Souhlasu s cookies vyberte Analytické cookies (u reklamního pixelu Marketingové cookies).
- Zaškrtněte Přidávat na nově vytvořené stránky a dejte Uložit.
- Ve výpisu v řádku kódu zvolte Přidat na všechny a v potvrzení klikněte na Přidat na všechny.
- Otevřete si web — v prohlížeči zkontrolujte, že se kód spustí teprve po přijetí cookies.
Snippet se <script src=\"…\">
Načítá-li snippet skript z cizí adresy značkou <script src="…"></script>, mezi
značkami nic není. V typu JavaScript ho nahraďte tímhle řádkem (adresu
zkopírujte ze snippetu) a pod něj dejte obsah ostatních <script> značek:
Postup: kód jen na jednu stránku#
- Kód založte v Web → Stránky → Vlastní kód a Přidávat na nově vytvořené stránky nechte nezaškrtnuté.
- Otevřete Web → Stránky → Přehled stránek a u stránky zvolte úpravu.
- Přepněte na záložku Vlastní kód a klikněte na Přidat kód.
- V novém řádku kód vyberte z knihovny.
- Uložte stránku.
Ve výpisu kódů je pak ve sloupci Kde 1 stránka.
Postup: přidat kód na všechny stránky, nebo ho ze všech odebrat#
- V Web → Stránky → Vlastní kód najděte řádek kódu.
- Klikněte na akci Přidat na všechny (nebo Odebrat ze všech).
- V potvrzení klikněte na tlačítko se stejným názvem — Přidat na všechny, nebo Odebrat ze všech. (Ze stránky úpravy kódu se potvrzuje tlačítkem Provést.)
Hláška řekne, na kolik stránek se kód nově přidal, nebo z kolika se odebral. Odebráním se kód nesmaže, zůstane v knihovně a můžete ho kdykoli přiřadit znovu.
Postup: kód dočasně vypnout#
- V Web → Stránky → Vlastní kód klikněte v řádku kódu na přepínač ve sloupci Aktivní.
- Přepínač ukáže ne a kód přestane běžet na všech stránkách.
Přiřazení ke stránkám zůstane, takže po opětovném zapnutí kód běží přesně tam, kde dřív.
Odkazy na cizí servery#
CSS umí načítat písma a obrázky odjinud (@import, url(https://…)), skript umí
načítat další skripty. Všechno to stahuje prohlížeč návštěvníka, ne váš server.
Cizí server se tím dozví o každém návštěvníkovi
Dostane jeho IP adresu a adresu stránky, kterou si otevřel. Pro zásady zpracování cookies a osobních údajů to je totéž jako vložit tam měřicí kód. Nezakazujeme to — jen o tom vězte.
Když se kód neprojeví#
- Je kód aktivní?
- Je přiřazený ke stránce, na kterou se díváte (sloupec Kde, oddíl Použito na)?
- Nečeká na souhlas s cookies, který jste v prohlížeči nedali?
- Sedí umístění — nehledáte skript z konce stránky v hlavičce?
- Nejsou v kódu typu CSS nebo JavaScript navíc značky
<style>nebo<script>?