Amikor egy Shopify sablont nézegetsz, a legjobb formájában látod - előre betöltött képekkel, betűtípusokkal és színekkel, amelyek igazán mutatóssá teszik. Ez remek módja annak, hogy megismerd egy sablon teljes potenciálját.
Miután azonban telepítetted a boltodba, nem fog késznek tűnni mindaddig, amíg bele nem vágsz a Shopify testreszabásba a saját dizájn-döntéseiddel. A testreszabás az, ami egy alapértelmezett sablonból menő webáruházzá alakítja a boltodat - olyanná, amely bizalmat épít, növeli a konverziókat, és emlékezetes vásárlási élményt teremt.
A Shopify új Horizon keretrendszerével a sablonok modulárisabbak, mint valaha, így gyorsabban juthatsz el az alapbeállítástól a teljes mértékben a saját márkádra szabott megjelenésig. Ez az útmutató részletesen bemutatja a Shopify sablon testreszabását - mi az, hogyan működik, és mit tehetsz a márkád népszerűsítéséért és az eladások növeléséért 2026-ban.
Mi az a Shopify testreszabás?
A Shopify testreszabás az a folyamat, amelynek során a webáruházadat úgy alakítod, hogy az egyedien tükrözze a márkádat. Alapállapotban a Shopify sablonok professzionális, kész dizájnt kínálnak. A testreszabás azonban lehetővé teszi, hogy ezt a dizájnt a márkaidentitásodhoz igazítsd, és személyre szabott vásárlási élményt hozz létre.
Ha jól csinálod, segít növelni a konverziókat. A Baymard Institute kutatása szerint azok a márkák, amelyek testreszabják a fizetési folyamatukat, akár 35%-kal is növelhetik a konverzióikat.
Ez jelenthet apró módosításokat - mint például betűtípusok és színek cseréje -, de akár nagyobb változtatásokat is, mint például szekciók átrendezése, egyedi tartalom hozzáadása, vagy valami teljesen új felépítése a nulláról. A Shopify legújabb dizájnfrissítéseivel minden eddiginél könnyebb testreszabni a boltodat, egyetlen sor kód nélkül.
A Shopify testreszabás típusai
A Shopify testreszabásnak különböző szintjei léteznek, attól függően, milyen megjelenést szeretnél elérni, és milyen technikai tudással rendelkezel. Egyes bolttulajdonosok csak a színeket szeretnék módosítani és néhány alkalmazást integrálni, mások viszont teljesen új funkciókat szeretnének.
Íme, mire van lehetőséged:
- Gyors sablonmódosítások. Mindennapi beállítások, mint például betűtípusok és logók cseréje, bannerek és képek szerkesztése, valamint annak kiválasztása, hogy megjelenjenek-e olyan elemek, mint a készletszint vagy promóciós jelvények. Például használhatsz egy előre beállított stílust a Shopify Sablon Áruházból, és frissítheted a kiemelő színeket, hogy illeszkedjenek a legújabb kollekciódhoz.
- Blokkalapú elrendezés-módosítások. A modern Shopify sablonok modulárisak - „blokkokból" épülnek fel, amelyeket bárhová húzhatsz az oldalon. Képgalériákat és véleményeket rendezhetsz tetszőleges sorrendbe, elrejthetsz vagy megjeleníthetsz blokkokat, és kód nélkül formálhatod az egyes oldalak dizájnját.
- AI-támogatott testreszabás. A Shopify 2025 nyári frissítése (amely a Horizon sablonokba van beépítve) lehetővé teszi, hogy szöveges utasítással azonnal dizájnblokkokat generálj. Például beírod, hogy: „adj hozzá egy visszaszámlálót a termékgaléria alá", és a Shopify azonnal létrehozza.
- Haladó testreszabás. Nagyobb kontrollhoz egy Shopify fejlesztő egyedi Liquid kóddal és szkriptekkel, API-kkal és metamezőkkel bővítheti a bolt meglévő funkcionalitását, egyedi elrendezéseket és funkciókat építve.
Shopify testreszabás: bízz meg fejlesztőt vagy csináld magad?
A Shopify sablon használatának egyik előnye, hogy számos strukturális dizájndöntés már készen vár. Nem kell aggódnod az oldalelrendezések miatt, vagy azon, hová kerüljön egy-egy kép egy összetett weboldal-építőben.
Ahhoz viszont, hogy a boltod valóban tükrözze a márkádat, hozzá kell adnod a saját egyéni jegyeidet. Gondolj rá úgy, mint egy lakás berendezésére - az alapok megvannak, de te választod ki a színeket és a dekorációt.
Bízz meg egy Shopify fejlesztőt
Ha új vagy a webdizájn világában, a rengeteg választási lehetőség nyomasztó lehet. Bármilyen színt megváltoztathatsz, elrendezéseket cserélhetsz, vagy elemeket frissíthetsz egyetlen kattintással - de eldönteni, mi működik a legjobban, nem mindig egyszerű.
Összetettebb funkciók és dizájn esetén gyakran költséghatékonyabb egy szakértőt megbízni, mint egyedül botladozni - különösen, ha figyelembe veszed a többi fontos feladatodat.
A Shopify Experts piactér segít tapasztalt webdizájnerekkel és fejlesztőkkel kapcsolatba lépni, akik kiválóan ismerik a platformot. Segíthetnek a döntésekben, vagy akár el is végzik helyetted a dizájnmunkát.
Szabd testre magad a Shopify sablonod
Bizonyos esetekben a „csináld magad" megközelítés a célravezető. Lehet, hogy szűkös a büdzsé, vagy már rendelkezel a szükséges technikai és dizájnkészségekkel. Az is lehet, hogy egyelőre egyszerű funkcionalitásra van szükséged, és később tervezel bővíteni.
Bármi is az ok, a Shopify sablonszerkesztője felhasználóbarát, és lehetővé teszi a webáruházad megjelenésének testreszabását kódolási vagy dizájnismeretek nélkül. Olyan eszközökkel, mint a Sections Everywhere, a Shopify alkalmazásbeágyazások és az oldalsablonok, néhány kattintással vonzó elemeket adhatsz a weboldaladhoz.
A Basic vagy magasabb előfizetési csomaggal létrehozhatod és testreszabhatod a boltod megjelenését a Shopify beépített sablonszerkesztőjével.
5 módszer a Shopify boltod egyedivé tételére
- Találd meg a tökéletes sablont a Shopify Sablon Áruházban
- Szerkeszd a sablonbeállításokat a boltod megjelenésének módosításához
- Hozz létre sablonokat
- Szabd testre a boltodat Shopify alkalmazásokkal
- Használj Shopify alkalmazásbeágyazásokat további szekciók hozzáadásához
Ez az öt megközelítés rugalmas eszköztárat ad a testreszabáshoz.
1. Találd meg a tökéletes sablont a Shopify Sablon Áruházban
Bár a Shopify alapértelmezetten a Debut vagy a Dawn sablont állítja be - attól függően, hogy az Online Store 2.0-t használod-e -, nem kell ezeknél maradnod. A Shopify Sablon Áruház több száz lehetőséget kínál, és a megfelelő sablon kiválasztása az elején időt takarít meg, ha speciális funkciókra van szükséged.

A Shopify sablonoknak két fő kategóriája van: ingyenes és fizetős.
- Ingyenes sablonok. Ideálisak új vagy kisebb boltok számára, amelyek indulásra vagy az e-kereskedelemmel való kísérletezésre készülnek. Nincs további egyszeri vagy ismétlődő költség, de gyakran korlátozottabb testreszabási lehetőségeket kínálnak. Több mint 20 ingyenes sablon közül választhatsz.
- Fizetős sablonok. Növekvő vállalkozásoknak ideálisak, amelyeknek több funkcióra van szükségük. A Shopify több mint 800 fizetős sablont kínál, 50-100 000 Ft közötti egyszeri díjjal. Bár nagyobb kezdeti befektetést igényelnek, a fizetős sablonok több grafikai dizájnfunkciót, e-kereskedelmi eszközt és robusztus funkciót kínálnak a webáruházad további testreszabásához.

Shopify egyedi sablonok vs. előre elkészített sablonok
Amikor Shopify boltot hozol létre vagy újratervezed a meglévőt, az egyik legnagyobb döntés az, hogy előre elkészített sablonnal indulsz, vagy egyedi sablonba fektetsz. Mindkettőnek megvannak az előnyei, de végső soron a büdzsédtől, az időkerettől és attól függ, mennyi kontrollt szeretnél a végeredmény felett.
Az előre elkészített sablonok a Shopify Sablon Áruházban már készen várnak. Csak telepítened kell őket, majd a sablonszerkesztőben végezheted el a módosításokat. Jellemzően 50-100 000 Ft közötti egyszeri költséggel járnak. Mivel már megtervezett dizájnról van szó, gyorsabban indulhatsz - napok vagy hetek alatt, attól függően, mennyit szeretnél finomítani rajta.
A karbantartás is egyszerűbb, mert a sablon fejlesztője gondoskodik a frissítésekről és hibajavításokról. A kompromisszum a rugalmasság: a sablon keretrendszeréhez vagy kötve.
Az előre elkészített sablonok ideálisak:
- Kis- és közepes vállalkozásoknak, amelyek igényes dizájnt szeretnének nagy befektetés nélkül
- Márkáknak, amelyek gyorsan szeretnének elkezdeni értékesíteni
- Bolttulajdonosoknak, akik a beépített támogatást és frissítéseket részesítik előnyben
A Horizonnak köszönhetően a mai előre elkészített sablonok rugalmasabbak, és gyakran olyan szintű testreszabást kínálnak, amelyhez korábban egyedi fejlesztés kellett.
A „Pitch" beállítás a Horizonban
Az egyedi sablonokat ezzel szemben kifejezetten a márkádhoz tervezik és kódolják, ami teljes kreatív kontrollt biztosít. A költségek néhány százezertől akár több millió forintig terjedhetnek, az összetettségtől függően.
Az indulás is jóval tovább tart, mivel egy teljes egyedi fejlesztés heteket vagy hónapokat vehet igénybe. Ugyanakkor korlátlan rugalmasságot kapsz, és minden elrendezést és funkciót pontosan úgy alakíthatsz, ahogy szeretnéd.
Szükséged lesz egy fejlesztőre (házon belül vagy szabadúszóként), aki a frissítéseket, hibajavításokat és új funkciókat kezeli, mivel nem kapsz automatikus sablonfrissítéseket, mint az előre elkészített megoldásoknál.
Az egyedi sablonok ideálisak:
- Bejáratott márkáknak, amelyeknek egyedi megjelenésre vagy haladó funkcionalitásra van szükségük
- Boltoknak, amelyek egyedi vásárlói útvonalakat vagy speciális funkciókat igényelnek
- Vállalkozásoknak, amelyek rendelkeznek a büdzsével és csapattal az egyedi kód hosszú távú karbantartásához
Íme egy gyors összehasonlítás:
|
Előre elkészített sablonok |
Egyedi sablonok |
|
|---|---|---|
|
Költség |
50-100 ezer Ft (egyszeri) |
1,5 millió Ft + (a projekttől függően) |
|
Indulásig szükséges idő |
Napok vagy hetek |
Hetek vagy hónapok |
|
Rugalmasság |
A sablon keretrendszerére korlátozva |
Korlátlan |
|
Karbantartás |
A sablon fejlesztője végzi |
Fejlesztőre van szükséged |
|
Teljesítmény |
A Shopify által sebességre ellenőrizve |
Kiváló, ha jól kódolt, de változó |
|
Támogatás |
Sablon fejlesztő + Shopify |
Csak a saját fejlesztőd/ügynökséged |
2. Szerkeszd a sablonbeállításokat a boltod megjelenésének módosításához
Miután megismerted a sablonod általános szerkezetét és funkcionalitását, a sablon testreszabásának dizájnaspektusaira összpontosíthatsz. A Shopify testreszabásnak ez a része biztosítja, hogy a webáruházad illeszkedjen a vizuális márkaidentitásodhoz.
A Shopify sablon testreszabásához navigálj a sablonszerkesztőhöz az irányítópultodról: Admin > Online bolt > Sablonok > Testreszabás.
A fő területek, amelyekre összpontosítanod érdemes:
Színpaletta
Ha már rendelkezel márkairányelvekkel, igazítsd a Shopify sablonbeállításokat ezekhez. Ha nincs, használhatod a logód színeit.
A nulláról indulsz? A márkaszínek kiválasztása ijesztő feladat lehet. Jól mutatnak együtt? Az élénk vagy a visszafogott színek illenek jobban a márkádhoz? Keress inspirációt az általad forgalmazott terméktípusokban. Például ha fabútorokat vagy bőrárukat árulsz, a természetes színek - mint a barna, bézs és narancs - remek kiindulópontot jelenthetnek.
Használhatsz online színpaletta-eszközöket is, amelyek közül sok kínál példákat más emberek vagy márkák által készített remek színkombinációkra.
Egy színpaletta példa hexadecimális kódokkal, amelyek egérrel való rámutatáskor jelennek meg - a Color Hunt jóvoltából.
Miután kiválasztottad a termékeidhez és vállalkozásodhoz illő színeket, mentsd el a hexadecimális kódokat. Ezt a hat betűből és számból álló kombinációt online platformokon és dizájneszközökben használhatod, hogy mindenhol pontosan ugyanazt a színt kapd.
Valahogy így néz ki:
- #FFFFFF (fehér)
- #2D2D2D (nagyon sötét szürke)
- #50B83C (zöld)
Betűtípusok
A betűtípusok szintén erős márkaépítő elemek. A legjobb e-kereskedelmi boltok közül sok különböző betűtípusok kombinációját használja, tehát nem kell egyetlen betűtípusnál vagy stílusnál maradnod. Keress olyan betűtípusokat, amelyek kiegészítik egymást és jól működnek együtt anélkül, hogy ismétlődőnek hatnának.
Általában két-három betűtípusnál érdemes maradni. Ennél több esetén fennáll a veszélye, hogy felhígítod a márkádat, és elvonod a figyelmet magáról a tartalomról. Bár csábító a kreativitás, törekedj az olvashatóság, a következetesség és az érthetőség közötti egyensúlyra.
Válassz egymást kiegészítő betűtípusokat
A tökéletes betűtípus-kombinációk megtalálásának leggyorsabb módja, ha ugyanazon betűcsaládon belül választasz stílusokat, mint például a Helvetica vagy a Times New Roman. A betűcsaládok több variációval rendelkeznek - különböző vastagságokkal és stílusokkal -, amelyek már eleve jól működnek együtt.
Egy vastagabb betűtípus lehet például a félkövér verzió a címsorokhoz, míg egy stílusvariáció lehet a nagybetűs verzió az alcímekhez.
Példa egy betűtípus többféle használatára - a Canva betűtípus-párosítási útmutatója alapján.
Válassz egymással kompatibilis betűstílusokat
Ha még sosem dolgoztál betűtípusokkal, íme egy gyors áttekintés a betűstílusokról. Néhány alapvető szövegstílust fogsz találni.
- Talpas (serif). Ezek a betűtípusok - mint a Times New Roman és a Georgia - kis „talpacskákkal" rendelkeznek a betűk végén.
- Talpatlan (sans serif). Ezek a betűtípusok - mint az Arial és a Helvetica - nem rendelkeznek talpacskákkal.
- Kézírásos (script). Ide tartozik minden, ami kalligráfiára vagy kézírásra emlékeztet.
- Rögzített szélességű (monospace). Ezeknél a betűtípusoknál egyenlő távolság van a betűk között, gyakran láthatók programkódban. Jó példa a Roboto Mono.
Különböző betűstílusokból származó betűtípusokat párosíthatsz, hogy erős kontrasztot érj el közöttük.
A kontraszton alapuló betűstílus-kombinálás kiváló a hierarchia kialakításához. A kontrasztos betűstílusok egyértelművé teszik, melyek a címsorok és alcímek, és melyik a törzsszöveg.
A hierarchia a legfontosabb információkhoz vezeti a vásárlóidat.
Használd tudatosan a betűméreteket
Használd tudatosan a betűméretet, hogy kiemeld a fontosat, és végigvezesd a felhasználókat a weboldaladon. Minél fontosabb a tartalom, annál nagyobb legyen a betűméret.
Miután kiválasztottad a törzsszöveg és a címsorok betűméretét, tartsd magad hozzá, hogy a vásárlóid könnyen megkülönböztethessék a címsorokat a bekezdésektől. A következetesség könnyebben olvashatóvá és navigálhatóvá teszi a boltodat - és kevesebb akadály gyorsabb értékesítést jelent.
3. Hozz létre sablonokat
Bár csábító lehet új betűtípusokkal és színekkel kísérletezni a különböző oldalakon, ne feledd, hogy a következetesség a márkaépítés alapköve. A vásárlóknak könnyen be kell tudniuk azonosítani a boltodat és könnyedén kell tudniuk navigálni benne, és egy alapvető betűtípus-, szín- és stíluskészlethez való ragaszkodás sokat segít ebben.
Éppen ezért hasznosak az oldalsablonok és szekciók a Shopify sablon testreszabásánál.
Az oldalsablonok olyan elemekhez hasznosak, amelyeket gyakran újrahasználsz - mint például blogbejegyzések, landing oldalak, értékesítési tölcsérek vagy akár termékoldalak. Ha sablonnal indulsz, fenntarthatod a következetességet, és csökkentheted a kreatív energiát - és időt -, amelyet az egyes oldalak létrehozása igényel.
A szekciók kisebb, sablonszerű tartalomblokkok - mint például egy kapcsolatfelvételi űrlap, cselekvésre ösztönzés vagy hírlevél-feliratkozás -, amelyeket több oldalon is elhelyezhetsz. A szekció tartalmát csak egyszer kell frissítened, és a változtatások automatikusan megjelennek mindenhol, ahol az adott szekciót használod.
Szekciók létrehozásához és szerkesztéséhez nyisd meg a sablonszerkesztőt, és kattints a „+ Szekció hozzáadása" gombra. Válassz egy új szekciót a listából, vagy keresd meg a szerkeszteni kívánt szekciót. Használd a ⋮⋮ ikont a szekció húzásához és átrendezéséhez, hogy megváltoztasd a szekciók sorrendjét és elrendezését az oldalon. Ha végeztél, kattints a Mentés gombra.
4. Szabd testre a boltodat Shopify alkalmazásokkal
A Shopify App Store több mint 8000 alkalmazást kínál, amelyek a dizájnmódosításoktól a haladó funkcionalitásig mindent lefednek. Alkalmazásokat találsz olyan fő kategóriákban, mint a boltdizájn, marketing és konverzió, rendelések és szállítás, értékesítési csatornák, boltkezelés, termékértékesítés és termékkeresés.
Csak a boltdizájn kategórián belül is több alkategóriát találsz tartalomhoz, dizájnelemekhez, képekhez és médiához, navigációhoz, weboldaloptimalizáláshoz és még sok máshoz. Minden azon múlik, hogy azonosítsd, mit szeretnél testreszabni, majd megtaláld azt az alkalmazást, amely megfelel az igényeidnek.
Íme néhány egyedi módosítás, amelyet boltdizájn alkalmazásokkal végezhetsz el:
- Keresősáv módosítása. Javítsd a keresést, szűrést és termékajánlásokat; adj hozzá vizuális keresést; és fejleszd az általános keresési élményt olyan alkalmazásokkal, mint a Shopify Search & Discovery.
- Termékajánlások hozzáadása. Javasolj hasonló termékeket az átlagos rendelési érték növeléséhez. Nézd meg, hogyan csinálja a Thousand alkalmazás.
- Vásárlói vélemények beépítése. Az olyan alkalmazások, mint az Okendo és a Judge.me, segítenek a konverziók optimalizálásában társadalmi bizonyítékok - vásárlói vélemények - révén.
- Landing oldal sablonok készítése. Robusztusabb landing oldal testreszabáshoz és sablonokhoz használj olyan alkalmazást, mint a Shogun, amely könnyen használható drag-and-drop szerkesztővel rendelkezik.
- Pénztár testreszabása. Igazítsd a fizetési élményt a vizuális márkádhoz, és optimalizáld a súrlódás csökkentése és az eladások növelése érdekében. Az olyan alkalmazások, mint a Skip To Checkout és a Zipify One Click Upsell, pontosan ebben segítenek. A Basic csomagtól felfelé minden előfizetési csomag támogatja az alap pénztárat. A haladó vagy teljes pénztár-testreszabás - mint például az elrendezés vagy viselkedés módosítása - csak Shopify Plus előfizetéssel érhető el.
5. Használj Shopify alkalmazásbeágyazásokat további szekciók hozzáadásához
A Shopify alkalmazásbeágyazások olyan alkalmazás által biztosított elemek, amelyek a webáruházad felületén lebegnek (mint például egy csevegőbuborék), vagy kódot adnak a boltodhoz anélkül, hogy a vásárlók számára láthatóak lennének. Lehetővé teszik a funkcionalitás bővítését az oldal dizájnjának zsúfolása nélkül.
Az Ora Organic Shopify kereskedő például egy Gorgias-alapú élő csevegés alkalmazásbeágyazást használ, amely lehetővé teszi a felhasználók számára, hogy az ügyfélszolgálattal kommunikáljanak, miközben zavartalanul folytatják a böngészést.

Az alkalmazásbeágyazásokat a sablonszerkesztőn keresztül kezelheted, és bármely sablonverzióval működnek.
A szekciókhoz hasonlóan az alkalmazásbeágyazásokat is csak egyszer kell beállítanod. Így bármilyen változtatást végzel az alkalmazásbeágyazáson, az automatikusan megjelenik minden oldalon, ahol a beágyazás szerepel.
A Shopify alkalmazásbeágyazások testreszabásához kattints az „Alkalmazásbeágyazások" menüpontra a sablonszerkesztőben. Válaszd ki a kezelni kívánt alkalmazásbeágyazást (vagy kattints a keresősávra, és írj be egy kulcsszót a telepített alkalmazások közötti kereséshez). Kattints a kapcsolóra az állapot módosításához (aktiválás vagy deaktiválás). Az alkalmazásbeágyazás beállításainak megtekintéséhez kattints a kibontás ikonra (▸) a részletek módosításához.
A Shopify sablonszerkesztő használata
A Shopify sablonszerkesztő a fő dizájnmunkaterületed. Itt módosíthatod a boltod megjelenését és elrendezését kód érintése nélkül.
Íme néhány hasznos tipp a hatékony használatához:
- Kezdd a kezdőlappal. A legtöbb vásárló ide érkezik először, és ez adja meg az alaphangot a bolt többi részéhez. Építsd ki a főbannert, a kiemelt termékeket és a cselekvésre ösztönzést, mielőtt a kisebb oldalakra térnél.
- Gondolkodj mobilban először. Az e-kereskedelmi weboldalforgalom több mint fele telefonról érkezik. Mindig nézd meg mobilon a végeredményt közzététel előtt.
- Duplikáld a sablonod kísérletezés előtt. A Themes > Actions > Duplicate menüben készíts biztonsági másolatot, mielőtt változtatásokat tesztelnél.
- Támaszkodj az előbeállításokra. Sok sablon (köztük a Horizon) több kidolgozott előbeállítással érkezik, amelyeket kiindulópontként használhatsz, majd a szerkesztőben finomíthatsz.
- Figyelj a fájlméretekre. A Shopify 50 megabájtos korlátot szab a sablonfeltöltésekre és 20 megabájtos korlátot az egyes fájlokra. Képeknél törekedj 1 megabájt alatti méretre (ideálisan 500 kilobájt vagy kevesebb), és tartsd magad az ajánlott formátumokhoz (JPEG fotókhoz, PNG átlátszó grafikákhoz, SVG logókhoz és ikonokhoz).
Minden oldalon részletesen szerkesztheted az egyes szekciókat, testreszabva például a képbannert, a gombokat és a láblécet.
A sablonszerkesztő elérése
A szerkesztőbe való belépés egyszerű:
- Jelentkezz be a Shopify admin felületre.
- Navigálj az Online bolt > Sablonok menüpontra.
- Az aktuális sablonod alatt kattints a Testreszabás gombra.
Ezzel megnyílik a sablonszerkesztő, ahol a jobb oldalon a webáruházad élő előnézetét látod, a bal oldalon pedig a szerkeszthető szekciók oldalsávját.

A szerkesztő főbb funkciói és eszközei
Miután beléptél a Shopify sablonszerkesztőbe, a következőkkel fogsz dolgozni:
- Szekciók és blokkok (oldalsáv). A Shopify sablonok moduláris szekciókból épülnek fel. Hozzáadhatsz, eltávolíthatsz, átrendezhetsz vagy elrejthetsz szekciókat, és szerkesztheted az egyes blokkokat (mint például gombokat, képeket vagy címsorokat).
- Sablonbeállítások. Globális stílusokat kezelhetsz, mint például betűtípusok, színek, favicon, pénztár-márkajelzés és közösségi média linkek. Amit itt módosítasz, az mindenhol frissül.
- Eszköz-előnézet. Válts asztali, táblagépes és mobil nézet között, hogy megbizonyosodj arról, a dizájnod minden képernyőméreten jól működik.
- Alkalmazásbeágyazások. Sok alkalmazás közvetlenül csatlakoztatható a szerkesztőhöz, így olyan funkciókat helyezhetsz el, mint vélemények, csevegőwidgetek vagy jelvények, közvetlenül a sablonodban.
- Dinamikus források. Termékadatokat, metamezőket vagy más dinamikus adatokat húzhatsz be közvetlenül a blokkjaidba. Például megjeleníthetsz szállítási információkat vagy promóciós üzeneteket egy metamezőhöz kötve.
- Sablon-előbeállítások és stílusok. Egyes sablonok - köztük a Horizon - több előre megtervezett „megjelenéssel" (színpalettákkal, betűtípus-kombinációkkal, elrendezésekkel) rendelkeznek, amelyek között válthatsz a gyors induláshoz.
- Nyelvszerkesztő. Testreszabhatod az alapértelmezett szövegeket, amelyek a sablonodban megjelennek (pl. „Kosárba" > „Vásárlás most").
- Akadálymentesítési és SEO-beállítások (egyes sablonokban). Alt szövegeket, címsorokat és egyéb optimalizálásokat adhatsz hozzá a használhatóság és a keresési láthatóság javítása érdekében.
Haladó Shopify testreszabás fejlesztőknek
Összetett igényű márkák számára a Shopify lehetőséget kínál a sablonszerkesztőn túlmutató megoldásokra, különösen ha tapasztalt Shopify fejlesztővel dolgozol. Ők túlléphetnek az előre megtervezett weboldalsablonok korlátain kód, API-k és haladó testreszabási eszközök segítségével.
A Shopify fejlesztői dokumentációja segít a fejlesztőknek alkalmazásokat építeni, sablonokat kóddal testreszabni, sőt akár headless commerce keretrendszert létrehozni.
Bevezetés a Liquid sablonnyelv használatába
A Liquid a Shopify nyílt forráskódú sablonnyelve, és minden Shopify sablon alapja. Lehetővé teszi a fejlesztők számára, hogy dinamikus oldalakat hozzanak létre a Shopify háttérrendszeréből (pl. termékek, kollekciók, vásárlói adatok) származó tartalom behúzásával és megjelenítésével a front-end sablonban.
A Liquid segítségével:
- Tageket, objektumokat és szűrőket használhatsz dinamikus adatok megjelenítéséhez (pl. {{ product.title }})
- Újrafelhasználható kódrészleteket és elrendezéseket építhetsz a következetes dizájnhoz
- Feltételes logikát hozhatsz létre - például egy jelvény megjelenítése csak akkor, ha a termék akciós
- Bővítheted vagy felülírhatod a sablonfájlokat egyedi kóddal
Például ez az egyszerű kódrészlet bemutatja, hogyan ellenőrizheti a Liquid a készletet és jeleníthet meg különböző elemeket:
{% if product.available %}<button>Add to cart</button>{% else %}<p>Sold out</p>{% endif %}
Metamezők használata egyedi adatokhoz
A metamezők lehetővé teszik egyedi adatok tárolását és megjelenítését, amelyek nem férnek bele a Shopify standard termékmezőibe. Bővítik a boltod funkcionalitását a sablon módosítása nélkül.
Néhány gyakori felhasználási eset:
- Mérettáblázatok vagy ápolási útmutatók hozzáadása a termékoldalakhoz
- „Újra készleten" dátumok vagy előrendelési információk tárolása
- Egyedi ikonok vagy címkék megjelenítése (pl. „Vegán" vagy „Környezetbarát")
- Egyedi tartalommezők létrehozása blogbejegyzésekhez vagy landing oldalakhoz
Így működnek:
- Definiálj egy metamező névteret és kulcsot a Shopify admin felületen (pl. details.material).
- Rendelj értékeket termékekhez, kollekciókhoz vagy más erőforrásokhoz.
- Hívd meg a metamezőt a Liquid sablonokban.
Például az alábbi kód behúz egy egyedi „material" metamezőt és megjeleníti a termékoldalon:
{% if product.metafields.details.material %}<p>Material: {{ product.metafields.details.material }}</p>{% endif %}
A te Shopify-od, a te ízlésednek megfelelően
Minden Shopify sablon magas színvonalú - beépített funkciókkal, amelyek lehetővé teszik a márkák számára kedvezmények nyújtását, termékajánlásokat, e-mail-címek gyűjtését és még sok mást.
Ráadásul minden sablon ingyenes frissítéseket kap, így mindig a legújabb verzió áll rendelkezésedre.
Az online értékesítésre optimalizált sablonok gyorsan töltődnek be, zökkenőmentesen működnek mobilon, és a legjobb fizetési élményt nyújtják - mindezt a meglévő márkád kiegészítéseként. A megfelelő testreszabással a boltod több lesz egy sablonnál: bizalmat épít, és olyan vásárlási élményt teremt, amelyért a vásárlóid visszatérnek.
Shopify bolt testreszabása – GYIK
Lehetővé teszi a Shopify a testreszabást?
Igen, testreszabhatod a Shopify boltodat. Válassz egy sablont, majd navigálj a sablonszerkesztőhöz a beállítások, a pénztár, a weboldal dizájn és egyebek testreszabásához.
Mi az a Shopify testreszabás?
A Shopify testreszabás a Shopify weboldalad front-end vagy back-end részének módosítását jelenti. Ez magában foglalhatja a dizájnt (betűtípusok, színek, elrendezések), a fizetési lehetőségeket és a fizetési folyamatot, a weboldal navigációt és még sok mást.
Hogyan szabhatom testre teljesen a Shopify-t?
A Shopify-t teljesen testreszabhatod, ha egy sablonnal indulsz, és a sablonszerkesztőt használod a dizájnmódosításokhoz. A funkcionalitást Liquid kóddal, metamezőkkel és alkalmazásokkal bővítheted. Teljes kontrollhoz egy Shopify fejlesztő egyedi sablont építhet, vagy API-kat integrálhat személyre szabott vásárlási élmények létrehozásához.
Könnyű testreszabni a Shopify-t?
Igen, a Shopify könnyen testreszabható. Navigálhatsz a sablonszerkesztőhöz, hogy magad végezd el a módosításokat, vagy megbízhatsz egy szakembert a Shopify weboldalad testreszabásával.
Hogyan kaphatok segítséget a Shopify boltom testreszabásához?
A Shopify Experts piactér segít tapasztalt webdizájnerekkel kapcsolatba lépni, akiket megbízhatsz szakértői tanácsadással a Shopify boltodhoz, vagy akár a dizájnmunka elvégzésével.
Hogyan tehetek testreszabhatóvá valamit a Shopify-ban?
Egy termék testreszabhatóvá tételéhez hozzáadhatsz opciókat, mint például szövegmezők, legördülő menük vagy képfeltöltés, a Shopify beépített egyedi mezőivel vagy termék-személyreszabási alkalmazásokkal. A fejlesztők metamezőket vagy egyedi kódot is használhatnak haladóbb testreszabási lehetőségek létrehozásához, mint például gravírozási kérések vagy csomagösszeállítók.
Muszáj testreszabnom a Shopify boltomat?
Nem, indulhatsz egy előre elkészített sablonnal, amely alapállapotban is professzionálisan néz ki. A testreszabás opcionális, de már apró módosítások is (mint például a logód, színeid és betűtípusaid hozzáadása) segíthetnek abban, hogy a boltod jobban illeszkedjen a márkádhoz, és javítsák a vásárlói élményt.

