Custom code#
Inserting your own CSS, JavaScript, or a third-party snippet into the pages of the site — without access to the files on the server.
Find it under Web → Stránky → Vlastní kód (the Web group in the left column).
It is not a replacement for editing the template
The inserted code is neither checked nor adjusted — it runs exactly as you write it. A mistake in the CSS breaks the look of the pages the code runs on; a mistake in the JavaScript breaks their features. Permanent changes to the design belong in the template; this is for what is needed right now or just once: a measurement tag, a small style fix, a snippet from a supplier.
Whoever gets in here controls the site
JavaScript inserted into a page sees everything the visitor does on it — including what they type into forms and including signing in. Custom code therefore has its own permission group, Vlastní kód, under Roles and privileges, which has to be granted separately. Access to Settings does not grant it automatically.
| Permission | What it allows |
|---|---|
| view | open the list and read the codes; without it neither the menu item nor the tab on a page is shown |
| create / edit / delete | create, change, delete a code in the library |
| assign to pages | change the codes in a page's Vlastní kód tab and use the Přidat na všechny / Odebrat ze všech actions |
How it works: the library and assignment#
The Vlastní kód screen is a library: each code is created and edited here only once. On its own, though, it runs nowhere — it runs on a page only when it is assigned to it. How to assign a code to pages is described in Which pages the code runs on.
The library list shows for each code:
| Column | What it shows |
|---|---|
| Název (name) | the code's description |
| Typ, Umístění | how and where the code is inserted — see below |
| Souhlas s cookies | the category whose consent the code waits for, or spustit vždy (always run) |
| Aktivní | a switch — click it to turn the code on or off right in the list |
| Kde (where) | on how many pages the code is (3 stránky); a dash = nowhere yet |
| Pořadí (order) | the order in which codes are inserted |
What you fill in for each piece of code#
Create a code with the přidat (add) button above the list; edit it with the editovat (edit) action in its row.
| Field | What it is for | When left empty |
|---|---|---|
| Aktivní / Neaktivní (switch at the top) | a deactivated code disappears from all pages but stays stored and assigned | a new code is active |
| Popis | for you — so that in a year you know what it is and why it is there; in the list it is the Název column | the form is not saved: Pojmenujte vložený kód. |
| Typ | CSS / JavaScript / HTML (cizí snippet) — see below | not possible — a new code has CSS preselected |
| Umístění | where in the page the code goes | not possible — a new code has Hlavička (head) preselected |
| Souhlas s cookies | should the code wait for the visitor's consent? | — spustit vždy —: the code runs regardless of the cookie bar |
| Pořadí | the lower the number, the earlier the code is inserted; on a tie the older one first | 0 is saved; a negative number is saved as 0 as well |
| Kód | the contents | saved; the page then gets just an empty tag, nothing happens |
| Přidávat na nově vytvořené stránky (add to newly created pages) | every newly created page gets this code automatically | new pages do not get it |
Below the form, the Použito na (used on) section lists the pages the code is assigned to (each page name links to its edit form). At the top, next to the switch, are the Přidat na všechny and Odebrat ze všech buttons — they do the same as the actions in the list.
Deactivating beats deleting
When something is wrong, switch the code to Neaktivní and save (or turn it off with the switch in the list). The code stays stored and assigned to its pages, so you just turn it back on — and finding the culprit is one click.
Deleting a code cannot be undone
A deleted code (the odstranit action) disappears from the library and from all pages it was assigned to. The only way back is to create it again and assign it again.
The type decides how the code is inserted#
| Type | What you write | What appears in the page |
|---|---|---|
| CSS | the rules only, .class { color: red; } |
<style>…</style> |
| JavaScript | the code only, without tags | <script>…</script> |
| HTML (cizí snippet) | the whole snippet including tags | inserted exactly as is |
Do not write the tags for CSS and JS
The wrapping <style> or <script> is added by the system, and the closing
</style> or </script> is cut out of your code. If you write the tags as well, an
extra opening tag stays in the page — the CSS is then partly ignored and the
JavaScript does not run at all.
The HTML type is for third-party snippets
Code from a supplier (a chat window, an advertising pixel) usually brings its own
tags including <script src="…">. That belongs here — paste it unchanged. Such code
cannot wait for the cookie bar, though; see below.
Placement#
| Option | Where it goes | When to use it |
|---|---|---|
Hlavička (<head>) |
into <head> |
styles and libraries that must load before the content |
Začátek stránky (za <body>) |
right after <body> |
whatever explicitly requires it — typically the <noscript> part of Tag Manager |
Konec stránky (před </body>) |
before </body> |
scripts that should wait until the page is ready |
Put scripts at the end of the page
A script in the head slows rendering down — the browser has to download and run it before it shows anything. At the end of the page it costs no speed. CSS, on the contrary, belongs in the head; otherwise the page briefly flashes in its original look.
Cookie consent#
Does your code store cookies or send data somewhere? Pick a category (Analytické cookies, Marketingové cookies). The code will then run only once the visitor allows that category on the cookie bar — until then it sits in the page, inert.
Exactly the categories from the cookie bar are offered
The list is not a separate setting of this screen — it is the same list the Cookie settings window is built from, minus Necessary (always granted, so it would not differ from "always run"). When a new category is added to the site, it appears here on its own. Adding one is a developer change in the configuration, not an administrator setting.
Without a category the code always runs
The — spustit vždy — option means the cookie bar has no effect on your code. For a measurement script or an advertising pixel that means the site measures even visitors who declined — and does not match what the bar promised them.
Only the JavaScript type can wait for consent
- HTML: a foreign snippet brings its own tags, so there is nothing to reconfigure on them. The form therefore refuses an HTML code with a category and shows an error at the field. The fix: rewrite the snippet as the JavaScript type (see Procedure: insert a measurement tag), or leave the category empty.
- CSS: the form accepts a category, but the style applies immediately, without waiting for consent — while the list still shows the category in the Souhlas s cookies column. Do not fill in a category for CSS.
Which pages the code runs on#
A page runs exactly the active codes assigned to it. The Kde column in the list shows how many pages a code has; the Použito na section in the code's edit form shows which ones.
| How to assign the code | Where you do it |
|---|---|
| to all existing pages | the Přidat na všechny (add to all) action in the code's row (or the button in the code's edit form) |
| to pages that will be created later | the Přidávat na nově vytvořené stránky checkbox in the code's edit form |
| to a single page | Web → Stránky → Přehled stránek, the page's edit form, the Vlastní kód tab |
All means truly all pages of the site, including system pages (cart, sign-in and the like). The order in which codes are inserted on a page is set by the code's Pořadí in the library — not by the order of rows in the page's tab.
The Vlastní kód tab on a page#
The page edit form has, next to the Stránka tab, a Vlastní kód tab listing the codes that run on the page. Each shows its type and placement and an upravit v knihovně (edit in library) link. The code's contents cannot be changed here; codes are only assigned.
- Přidat kód (add code) adds a row in which you pick a code from the library (type part of its name, or open the selection with the Vyhledat button).
- The bin icon in a row removes the code from the page. It does not disappear from the library or from other pages.
- Changes take effect only after the page is saved.
- For a new page, the list is prefilled with the codes that have Přidávat na nově vytvořené stránky ticked. Remove any the page should not have before saving.
Without the assign permission the tab is read-only. Without the permission to view custom code the tab is not shown at all — a new page then still gets the codes with Přidávat na nově vytvořené stránky.
Add to newly created pages does not affect existing pages
Ticking it does not put the code on existing pages — that is what Přidat na všechny is for. And conversely: Odebrat ze všech does not untick it, so every further new page gets the code again.
Procedure: insert a measurement tag#
Do not insert Google Analytics or Tag Manager this way — they have their own card under Third-party connections, which waits for the cookie bar on its own. This procedure is for other measurement and advertising tools.
- In the left column open Web → Stránky → Vlastní kód.
- Click přidat.
- In Popis write what it is (for example Traffic measurement — Hotjar).
- Switch Typ to JavaScript and paste only what sits between
<script>and</script>. - Set Umístění to Konec stránky (před
</body>). - In Souhlas s cookies pick Analytické cookies (for an advertising pixel, Marketingové cookies).
- Tick Přidávat na nově vytvořené stránky and press Uložit.
- In the list, choose Přidat na všechny in the code's row and in the confirmation click Přidat na všechny.
- Open the site — check in the browser that the code runs only after cookies are accepted.
A snippet with <script src=\"…\">
If the snippet loads a script from a foreign address with a
<script src="…"></script> tag, there is nothing between the tags. In the
JavaScript type, replace it with this line (copy the address from the snippet) and
put the contents of the other <script> tags below it:
Procedure: code on a single page only#
- Create the code in Web → Stránky → Vlastní kód and leave Přidávat na nově vytvořené stránky unticked.
- Open Web → Stránky → Přehled stránek and choose to edit the page.
- Switch to the Vlastní kód tab and click Přidat kód.
- In the new row pick the code from the library.
- Save the page.
The code list then shows 1 stránka in the Kde column.
Procedure: add a code to all pages, or remove it from all#
- In Web → Stránky → Vlastní kód, find the code's row.
- Click the Přidat na všechny (add to all) action, or Odebrat ze všech (remove from all).
- In the confirmation, click the button with the same name — Přidat na všechny or Odebrat ze všech. (From the code's edit form the confirmation button is Provést.)
The message says how many pages the code was newly added to or removed from. Removing does not delete the code; it stays in the library and you can assign it again at any time.
Procedure: switch a code off temporarily#
- In Web → Stránky → Vlastní kód, click the switch in the Aktivní column of the code's row.
- The switch shows ne and the code stops running on all pages.
The assignment to pages stays, so once switched back on the code runs exactly where it did before.
Links to foreign servers#
CSS can load fonts and images from elsewhere (@import, url(https://…)); a script can
load further scripts. All of it is downloaded by the visitor's browser, not by your
server.
The foreign server learns about every visitor
It receives their IP address and the address of the page they opened. For your cookie and personal-data policy that is the same as putting a tracker there. We do not forbid it — just know about it.
When the code does not show up#
- Is the code active?
- Is it assigned to the page you are looking at (the Kde column, the Použito na section)?
- Is it waiting for a cookie consent you have not given in your browser?
- Does the placement match — are you looking for an end-of-page script in the head?
- Does a CSS or JavaScript code contain extra
<style>or<script>tags?