HTML kódok
Fontos: ez az oldal olyan felhasználók számára készült, akik gyakorlattal rendelkeznek a weboldalak készítésében és jártasak a HTML, CSS, esetleg a Javascript használatában. Amennyiben nem ért a beállításhoz, úgy a módosításaival megzavarhatja a webáruház működését. Például a jQuery beszúrásával minden jQuery plugin működését, illetve az összes JavaScript oldalra történő beolvasását megzavarhatja.
HTML kód szerkesztése
A HTML kódszerkesztő a Megjelenés és Tartalom → Szerkesztő → HTML kód menüpontban található.
A Fejléc szekcióba (a lezáró HEAD tag elé) kerülnek beillesztésre a meta tagek, a CSS hivatkozások, a JavaScriptek. Erre a helyre beszúrt tagek a <head></head> jelek közötti kódban jelennek meg. Kellőképpen mérlegelje ezekben a szekciókban történő módosítást, hogy ne szúrjon be a kódba valamilyen olyan funkcionalitást, ami árthatna önnek. Például ledobhatná a keresőkben a helyéről. A Footer szekcióba (a BODY lezáró tag elé) egyes JavaScriptet beszúrhat.
Amennyiben a webáruháza fejlécének a megjelenését akarja szerkeszteni (azaz logó, kép), olvassa el a Webáruház fejléce súgót. A láblécbe Ikonok és Hivatkozások is beilleszthetők.
A Befejezett megrendelés szekció a konverzió követésére szolgál. A kódok csak a megrendelési folyamat köszönőoldalán érvényesülnek. Ehelyett a lehetőség helyet a Google Tag Manager használatát javasoljuk, ami lehetővé teszi a megrendelésre vonatkozó információk kezelését.
A robots.txt szekcióba általában olyan direktívák kerülnek beillesztésre, melyekkel a kereső robotok a webáruházának kiválasztott oldalaihoz történő hozzáférését korlátozhatja. A beillesztett szöveg a robots.txt fájl végére kerül.
HTML kód hosszúsága
Mind a négy szekcióba (Fejléc, Footer, Köszönet oldal és robots.txt) legfeljebb 8192 karakter hosszúságú valid HTML kód illeszthető be. A határérték átlépése után az elvégzett módosítás nem menthető el.
Amennyiben hosszabb kódot akar elhelyezni, az ügyfél FTP-jén keresztül kell betölteni a fájlt a kóddal, és a kódok adott részére kell hivatkozni. Részletes információkat a betöltésnek erről a módjáról az FTP bejegyzésben talál.
Fájlok kóddal történő beillesztésének szabályai
Általános útmutatás
JavaScript esetén a hosszabb kóddal rendelkező fájlra történő hivatkozás így nézhet ki: <script src="/user/documents/modification.js" type="text/javascript"></script>
CSS esetén pedig így: <link href="/user/documents/style.css" rel="stylesheet" />
Olyan fájl szerkesztésénél, amit be szeretne tölteni és hivatkozni akar rá, győződjön meg arról, hogy a szerkesztőjében be van-e állítva az UTF-8 kódolás. Ezzel megakadályozza a karakterek � formában történő megjelenését.
Fájlverziók
?v=VERZIÓSZÁM fájlhoz történő hozzáadásával az aktuális fájl beolvasódik. Például az aktuális JavaScript negyedik verziójához így írja hozzá a hivatkozást: <script src="/user/documents/modification.js?v4" type="text/javascript"></script>
Az új CSS vagy JavaScriptu hangolásánál a DEBUG_TIMESTAMP placeholdert is használhatja, mellyel elérheti az aktuális fájl betöltését az oldal minden egyes frissítésekor:
<script src="/user/documents/modification.js?v=#DEBUG_TIMESTAMP#"></script>
A DEBUG_TIMESTAMP működőképességéhez debugTimestamp cookie létrehozására van szükség. Adminisztrákorként bejelentkezve adja meg a konzolban a következőket:
shoptet.cookie.create('debugTimestamp', 1, {days: 1});
JS fájlok
Ne használja a JavaScript fájlban a document.write() jelzést, mivel blokkolja a script sima betöltődését. Amennyiben szerveren generálja a CSS vagy a JavaScript fájlt (pl.: PHP scripttel), javasoljuk a fájl előre történő létrehozását és pendrive-ra mentését, hogy a mentett parancsfájl (stílus) közvetlenül megjelenjen a kérés feldolgozásakor és ne késleltesse a generációt.
JavaScriptu (JS) fájl beillesztésekor a fájlban csak maga a JavaScript lehet. Azaz csak az, ami a <script>``</script> jelek között van. Csak ezek a jelek önmagukban; még HTML megjegyzés sem lehet a fájlban.
Ne használjon lebutított JavaScriptet. A Google az ilyen kódokat tartalmazó webáruházakat gyanúsnak tartja, és nem hivatkozik rájuk a hirdetésekben.
Javaslat a gyors betöltődéshez
Az FTP tárhelyről történő gyorsabb betöltődéshez javasoljuk az URL cím CDN prefix-szel együtt történő kitöltését.
<script src="https://cdn.myshoptet.com/usr/www.domain-nev.hu/user/documents/common.js" type="text/javascript"></script>
<link href="https://cdn.myshoptet.com/us/www.domain-nev.hu/user/documents/style.css?v=1" rel="stylesheet" />
Javaslat a gyors betöltődéshez (partnerek számára)
A partnerek sorába tartozó kódolóknak a CSS és JS fájlok tárhelyeként a saját partner webáruházukon az FTP /user/documents/ használatát javasoljuk. Ezzel biztosítja a fájl kézbesítésének optimális gyorsaságát, azonban egyben korlátozza a más hosting providertől való függőséget. Az URL, beleértve a CDN prefixet is, használatát javasoljuk, ami biztosítja, hogy nem következik be CORS miatti probléma.
<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" />
Megjegyzés a kódban
A HTML kód áttekinthetősége érdekében javasoljuk, hogy helyezzen bele információkat tartalmazó megjegyzéseket. Ezeket a megjegyzéseket csak az adminisztrátorban a HTML szerkesztőbe helyezze el. A beillesztett CSS a JS (JavaScript) fájlokban ne használjon megjegyzést.
A megjegyzésnek köszönhetően jobban el tud igazodni abban, hogy a kód adott része mire szolgál, a kód hol kezdődik és végződik stb. Ezeket a megjegyzéseket a kereső figyelmen kívül hagyja, azaz csak azt látja, hogy ki a kód szerkesztője. Az ilyen megjegyzést <!--``--> taggel helyezze be.
Vagyis például:
<!-- kód címe -->
<sctipt></sctipt>
<!-- kód szerzője -->
