HTML kódy

Dôležité: táto stránka je určená používateľom, ktorí majú skúsenosti s tvorbou webových stránok a ovládajú HTML, CSS, prípadne Javascript. Pokiaľ nastaveniam nerozumiete, môžete vašimi úpravami narušiť chod e-shopu. Napríklad vložením jQuery zrušiť fungovanie každého jQuery pluginu, prípadne načítanie vašich JavaScriptov na stránkach.

Editácia HTML kódu

Editácia HTML kódu sa nachádza v umiestení Vzhľadu a Obsah → Editor → HTML kód.

Do sekcie Záhlavia (pred koncovým tagom HEAD) sa vkladajú meta tagy, odkazy na CSS, JavaScript a pod. Tagy vložené na tomto mieste sa zobrazia v kóde medzi značkami <head></head>. Úpravu v tejto sekcii dobre zvážte, aby ste do kódu nevložili nejakú funkcionalitu, ktorá by vám mohla uškodiť. Do sekcie Pätička (pred koncovým tagom BODY) môžete vkladať niektoré JavaScripty a pod.

Pokiaľ chcete editovať vzhľad záhlavia na vašom e-shope (tj. logo, obrázok), pozrite sa do článku Záhlavie webu. Do pätičky je potom možné vložiť Ikonky a Odkazy.

Sekcia Dokončená objednávka sa používa pre sledovanie konverzií. Kódy sa uplatňujú iba na ďakovnej stránke objednávkového procesu. Odporúčame namiesto tejto možnosti použiť Google Tag Manager, ktorý vám umožní spracovať informácie o objednávke.

Do sekcie robots.txt sa obvykle vkladajú direktívy, ktorými zamedzíte robotom vyhľadávačom prístup k vybraným stránkam vášho e-shopu. Vložený text sa pridá na koniec súboru robots.txt.

Dĺžka HTML kódu

Do každej zo štyroch sekcií (Záhlavie, Pätička, Dokončená objednávka a robots.txt) môžete vložiť platný HTML kód v maximálnej dĺžke 8192 znakov. Po dosiahnutí limitu nie je možné vykonané zmeny uložiť.

Pokiaľ chcete vložiť dlhší kód, je potrebné nahrať súbor s kódom cez FTP klienta a na príslušnú časť kódov odkázať. Viac o informácií o tomto spôsobe nahrávania v článku FTP.

Pravidlá vkladania súborov s kódom

Obecné pokyny

Odkaz na súbor s dlhším kódom môže vyzerať v prípade JavaScriptu takto: <script src="/user/documents/modification.js" type="text/javascript"></script> alebo v prípade CSS takto: <link href="/user/documents/style.css" rel="stylesheet" />.

Pri editácii súboru, ktorý chcete nahrať a odkazovať naň, sa uistite, že máte nastavené vo vašom editore kódovanie UTF-8. Zabránite tak, aby sa slovenské znaky zmenili na �.

Verzia súboru

Pridaním ?v=CISLO_VERZE za cestu k súboru sa vynúti načítanie aktuálneho súboru. Napríklad pre štvrtú verziu aktuálneho JavaScriptu napíšete odkaz takto: <script src="/user/documents/modification.js?v4" type="text/javascript"></script>. V žiadnom prípade nepoužívajte timestampy.

Ďalšou možnosťou je použiť pri ladení nového CSS alebo JavaScriptu placeholder DEBUG_TIMESTAMP, ktorým vynútite načítanie aktuálneho súboru pri každom obnovení stránky:

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

Aby DEBUG_TIMESTAMP fungoval, je potrebné vytvoriť cookie debugTimestamp a byť prihlásený pod administrátorským účtom. V konzole zadajte:

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

Súbory JS

V súbore JavaScriptu nepoužívajte značku document.write(), ktorá blokuje hladké načítanie scriptov. Pokiaľ CSS alebo JS súbor generujete na serveri (napr. PHP scriptom), odporúčame súbor generovať s predstihom a uložiť na disk, aby sa pri vybavovaní požiadaviek rovno servíroval uložený script (štýl) a obsluha požiadavky sa nezdržovala generovaním.

Pri vkladaní súboru JavaScriptu (JS), smie byť v súbore len samotný JavaScript. Teda iba to, čo sa nachádza medzi značkami <script> </script>. Tieto značky samotné ani HTML komentáre do súboru nepatria.

Nepoužívajte obfuskované JavaScripty. Google e-shopy s týmito kódmi považuje za podozrivé a neodkazuje na nich v reklamách.

Odporúčanie pre rýchle načítanie

Pre rýchlejšie načítanie z FTP úložiska odporúčame URL adresy vypisovať vrátane CDN prefixu.

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

Odporúčanie pre rýchle načítanie (určené partnerom)

Kóderom z radov partnerov odporúčame ako úložisko súborov CSS a JS použiť FTP /user/documents/ na ich vlastnom partnerskom e-shope. Zaistíte tak optimálnu rýchlosť doručenia súboru, avšak zároveň zamedzíte závislosti na ďalšom hosting providerovi. Odporúčame použiť URL vrátane CDN prefixu, ktorý zaistí, že nedôjde k problému kvôli 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óde

Aby bol váš HTML kód prehľadný, odporúčame vkladať do neho poznámky s informáciami. Tieto poznámky vkladajte iba do HTML editora v administrácii. Poznámky nepoužívajte vo vložených súboroch CSS a JS (JavaScript).

Vďaka poznámke sa tak ľahšie vyznáte v tom, k čomu daná časť kódu slúži, kde kód začína a končí atď. Tieto poznámky bude prehliadač ignorovať, uvidí ich teda len ten, kto kód edituje. Takúto poznámku vložíte tagom .

Teda napríklad:

<!-- Váš názov kódu Štart -->  
<!-- Váš názov kódu Koniec -->

Obsah článku