Dodajte gradilnik zapestnic na vašo Shopify

Avtor Camille G. · Posodobljeno oktober 2026 · Čas branja ≈ 7 min

Ali prodajate naramnice iz drago

Preden začneš

Gradnik je gostovan na naših strežnikih in se pojavi v vaši trgovini. Vedno imate najnovejšo različico, brez kaj bi morali posodobiti na vaši strani. Potrebujete dve stvari:

• tvoj identifikator, poslano s strani Loch Ness, ko je vaš graditelj nastavljen (na primer my-shop);
• an Tema Online Store 2.0, ki pokriva vse nedavne Shopify teme, vključno z Dawn.

Vaše ime, logotip, barve, meni, cene, valuta in izbor kamnin so vezani na vaš identifikator. Spreminjate jih iz svoje odjemalske oblasti, in se posodobijo povsod naenkrat, brez da bi se ponovno dotaknili Shopifyja.

Katero možnost bi moral izbrati?

Lahko jih kombinirate. Številne spletne trgovine uporabljajo namensko stran in jo povežejo s povezavo v glavni meni.

Možnost 1: povezava v vašem meniju ali že pripravljen gumb

Brez kakršnega koli okvira se graditelj odpre v polno stran, v vaših barvah. To mu daje največ prostora, še posebej na telefonih.

1. Dodaj to v meni. V svojem Shopify administratorju pojdite na Spletna trgovina → Navigacija, odprite glavni meni in kliknite Dodaj predmet menija.
2. Poimenuj ga in prilepi naslov. Ga poimenuj, na primer "Oblikuj svojo zapestnico", nato pa prilepite ta naslov v polje Povezava:

https://lochness-paris.com/pwa/en/?client=YOUR-IDENTIFIER

Če želite prikazati gumb na svojem domači strani ali v opisu izdelka, uporabite gotov gumb iz vašega območja odjemalca. Že uporablja vaše barve.

Možnost 2: namenjena stran "Oblikuj svojo zapestnico"

1. Ustvari stran. V svoji administraciji pojdi na Spletna trgovina → Strani → Dodaj stran. Dajte mu naslov ("Oblikuj svojo zapestnico") in shranite.
2. Ustvari predlogo strani. Pojdi na Spletna trgovina → Teme → Prilagodi. V spustnem meniju na vrhu urejevalnika izberite Strani, nato Ustvari predlogo. Imenujte ga, na primer bracelet-builder.
3. Dodajte odsek Custom Liquid. V tej predlogi kliknite Dodaj razdelek in izberi Prilagodljiva tekočina.
4. Prilepite kodo. Prilepite kodo spodaj v polje Custom Liquid in shranite.
5. Dodelite predlogo. Vrni se na Spletna trgovina → Strani, odprite svojo stran in izberite bracelet-builder v Predloga polje. Shrani.
6. Dodaj to v meni. V Spletna trgovina → Navigacija, dodajte postavko menija, ki kaže na to stran.

<iframe src="https://lochness-paris.com/pwa/en/?client=YOUR-IDENTIFIER" style="width:100%;height:860px;border:0" loading="lazy" title="Bracelet builder"></iframe>
<p style="margin:6px 0 0;font:12px/1.4 Arial,sans-serif;text-align:center;color:#6b6b6b">Bracelet builder by <a href="https://lochness-paris.com/sl" style="color:inherit">Loch Ness&reg;</a></p>

Na računalniku razvijalec prikazuje dva stolpca: naramnico na eni strani, kamne na drugi. Na telefonu se samodejno preklopi na mobilni postavitev.

Možnost 3: plavajočo gumbo na vsaki strani

V kotu vaše trgovine se pojavi majhen okrogel gumb. En klik odpre gradnik v panelu, ne da bi zapustili stran. Gradnik se naloži samo ob prvem kliku, zato vaša trgovina ostane hitra.

1. Odpri urejevalnik teme. Pojdi na Spletna trgovina → Teme → Prilagodi.
2. Dodajte odsek Custom Liquid v nogo. V Noga območje levega panela, kliknite Dodaj razdelek in izberi Prilagodljiva tekočina. Razdelek v nogi se pojavlja na vsaki strani.
3. Prilepite spodnji kod in shranite.
4. Vključi gumb. V svojem območju za stranke vključite plavajoči gumb in izberite njegov tekst ter stran (levo ali desno). Lahko ga kadarkoli izklopite, ne da bi se dotaknili Shopifyja.

<script src="https://lochness-paris.com/pwa/widget.php?client=YOUR-IDENTIFIER&lang=en" async></script>
<p data-ln-credit style="margin:6px 0 0;font:12px/1.4 Arial,sans-serif;text-align:center;color:#6b6b6b">Bracelet builder by <a href="https://lochness-paris.com/sl" style="color:inherit">Loch Ness&reg;</a></p>

Če vaša tema ne dopušča oddelkov v nogi, prilepite isto kodo v Spletna trgovina → Teme → … → Ureja kodo, in the layout/theme.liquid datoteka, tik pred </body>.

Možnost 4: kompakten gradilnik (stolpec ali stran proizvoda)

Ta različica vedno uporablja mobilno postavitev v ozkem okvirju. Primerna je za stransko vrstico, stran z izdelkom naramnice ali blok "poskusi to" na domači strani. Dodaj jo v Prilagodljiva tekočina razdelka ali bloka, kot v možnosti 2.

<iframe src="https://lochness-paris.com/pwa/en/?client=YOUR-IDENTIFIER&layout=mobile" style="width:420px;max-width:100%;height:780px;border:0;border-radius:16px" loading="lazy" title="Bracelet builder"></iframe>
<p style="margin:6px 0 0;font:12px/1.4 Arial,sans-serif;text-align:center;color:#6b6b6b">Bracelet builder by <a href="https://lochness-paris.com/sl" style="color:inherit">Loch Ness&reg;</a></p>

Več jezikov v vašem trgovini

Gradbenik obstaja v Angleščina, francoščina, španščina in madžarščina (in še mnogo več na zahtevo). Če želite spremeniti jezik, zamenjajte /en/ v naslovu s /fr/, /es/ ali /hu/, in lang=en s prilagoditvijo kode za lebdeči gumb. Če vaša trgovina uporablja Shopify Markets z več jeziki, dodajte en razdelek Custom Liquid za vsako jezikovno različico ali nas vprašajte: vaš področje odjemalca vsebuje kode za vsak jezik.

Preverite, da je vse delujoče

• Graditelj prikazuje vaše ime in barve. Če vidite barve Loch Nessa, je verjetno napačno napisana oznaka v kodi.
• Preizkusite na svojem telefonu, ne samo v predogledu urejevalnika.
• Naredi načrt testa in ga pošlji. Preverite, da prejavi naročila pri e-poštni naslov, nastavljen za vašo trgovino.
• Za plavajočo gumb, počakajte do 5 minut po vklopu v območju svojega odjemalca: sprememba se pojavi v toliko časa.

Pogosto zastavljena vprašanja

Viri

Shopify — Tekoča referenca · Shopify — Skupini razdelkov (glava in noga) · MDN Web Docs — Element iframe

Napisal Camille G., ustanovitelj Loch Ness. Od 2013 do 2023 sem zasnoval simbolno nakit za svojo lastno znamko, od takrat pa se celodbno ukvarjam z gradnjo spletnih aplikacij in orodij. Sam sem kodiral ta konstruktor zapestnic. My story · GitHub · ORCID