28/02/2023
Shopify temaer tilbyder en utrolig fleksibilitet, når det kommer til at tilpasse din online butiks udseende og funktionalitet. Bag kulisserne er det især to filer, der styrer denne proces: settings_schema.json og settings_data.json. At forstå forskellen mellem disse filer og deres respektive roller er afgørende for enhver, der ønsker at mestre tema tilpasning på Shopify. Denne artikel dykker ned i disse filer, forklarer deres formål og viser, hvordan du kan udnytte dem til at skabe en skræddersyet oplevelse for dine kunder.

- Hvad er Shopify Tema Indstillinger?
- settings_schema.json vs. settings_data.json: Hovedforskellene
- Dybere Dyk i settings_data.json
- Overvinde Præsentationsværdier med Tema Styles og Bevare Indhold
- Hvordan Sektionsdata Gemmes i settings_data.json
- Håndtering af Flere Butikker med Én Tema Brug af Presets
- Potentielle Faldgruber ved Sporing af Ændringer
- Konklusion: Udnyt Tema Styles og Presets Kreativt
- Ofte Stillede Spørgsmål (FAQ)
Hvad er Shopify Tema Indstillinger?
Tema indstillinger, også kendt som tema muligheder, giver en forhandler mulighed for at tilpasse udseendet og følelsen af deres online butik uden at skulle dykke ned i kompleks kode. Disse indstillinger er forudbestemt af temaudvikleren, der bygger temaet. De er struktureret og gemt i config mappen inde i settings_schema.json filen. Tema indstillinger styrer organiseringen og indholdet af menuen i temaeditoren, hvilket gør det nemt for forhandlere at foretage ændringer.
Når du navigerer i Shopify admin, vil du finde disse indstillinger under "Online Store" -> "Themes" -> "Customize". Her kan du ændre alt fra farver og typografi til layout og specifikke sektioners indhold, alt sammen baseret på hvad udvikleren har defineret i settings_schema.json.
settings_schema.json vs. settings_data.json: Hovedforskellene
De to filer, settings_schema.json og settings_data.json, arbejder hånd i hånd, men tjener forskellige formål:
| Fil | Formål | Indhold |
|---|---|---|
| settings_schema.json | Definerer strukturen og tilgængelige indstillinger i temaeditoren. | Beskriver de forskellige inputfelter (tekstfelter, farvevælgere, dropdowns osv.) og deres konfiguration. |
| settings_data.json | Gemmer de aktuelle værdier for tema indstillingerne og definerer tema styles (presets). | Indeholder en current sektion med de aktive indstillinger og en presets sektion med foruddefinerede tema styles. |
settings_schema.json: Skabelonen for dine Indstillinger
settings_schema.json filen er essensen af, hvordan din tema editor er organiseret. Den dikterer, hvilke muligheder en forhandler har, når de tilpasser temaet. Tænk på det som en skabelon, der definerer alle de tilgængelige felter og deres typer. Når en temaudvikler opretter et nyt tema, definerer de i denne fil, hvilke indstillinger der skal være tilgængelige, såsom:
- Farvepaletter: Mulighed for at vælge primære, sekundære og accentfarver.
- Typografi: Valg af skrifttyper til overskrifter og brødtekst.
- Layout muligheder: Indstillinger for bredde, margener og padding.
- Billedvalg: Mulighed for at uploade logoer, ikoner og baggrundsbilleder.
- Tekstfelter: Til at indtaste overskrifter, beskrivelser og call-to-action tekster.
Filformatet er strengt defineret af Shopify, hvilket sikrer, at temaeditoren kan parse og vise indstillingerne korrekt. Hvert felt defineres med et unikt 'id', en 'label' (det navn, der vises i editoren) og en 'type' (f.eks. 'text', 'color', 'select', 'checkbox').
settings_data.json: Gemmer Dine Valg og Styles
Hvor settings_schema.json definerer, hvad der er muligt, gemmer settings_data.json de faktiske valg, der er foretaget. Denne fil indeholder to hovedobjekter:
- current: Dette objekt indeholder data for de tema indstillinger, der er aktuelt gemt og anvendt i temaeditoren. Det er disse værdier, som din online butik rent faktisk bruger.
- presets: Dette objekt indeholder data for forskellige "tema styles", også kendt som presets. En preset er en samling af foruddefinerede indstillinger, der kan anvendes med et enkelt klik.
Når en forhandler vælger en preset, opdaterer Shopify simpelthen værdierne i current objektet for at matche dem, der er defineret i den valgte preset. Dette er en utrolig effektiv måde at tilbyde forskellige designtemaer eller "looks" til en butik.
Dybere Dyk i settings_data.json
Lad os tage et nærmere kig på settings_data.json. I de fleste gratis temaer fra Shopify Theme Store vil du finde denne fil opdelt i to sektioner: current og presets.
Current: Dine Aktuelle Indstillinger
current objektet indeholder de indstillinger, der er aktive i din butik lige nu. Når du ændrer en indstilling i temaeditoren, er det disse værdier, der bliver opdateret. Et tema bruger altid kun data fra current objektet for at vise sig selv.
Theme Styles (Presets): Foruddefinerede Designs
I temaer som Debut, indeholder presets objektet data for forskellige tema styles, f.eks. "Default" og "Light". Disse kan nemt vælges og anvendes via temaeditoren. Når en preset anvendes, kopieres dens indstillinger til current objektet.
Det er vigtigt at bemærke, at ikke alle inputtyper bliver overskrevet af en tema style. Shopify betragter visse inputtyper som "præsentationsværdier", der kan ændres, mens andre, som ofte indeholder indhold, bevares.
Overvinde Præsentationsværdier med Tema Styles og Bevare Indhold
En af de mest værdifulde funktioner ved presets er, hvordan Shopify håndterer opdateringen af indhold. Forestil dig, at du som forhandler har brugt meget tid på at tilpasse dit logo, ændre billeder på forsiden og indtaste produktbeskrivelser. Hvis du derefter beslutter dig for at skifte fra "Default" tema stilen til "Light", ville det være en katastrofe, hvis alt dit indhold blev slettet og skulle genindtastes.
Shopify løser dette ved kun at overskrive værdier, der betragtes som præsentationsmæssige. Indholdsværdier bliver derimod ikke overskrevet af en tema style. Dette sikrer en problemfri overgang mellem forskellige designvisninger uden tab af vigtig information.
Inputtyper, der Bliver Overskrevet (Præsentationsværdier)
Følgende inputtyper er typisk betragtet som præsentationsmæssige og vil blive overskrevet, når en tema style anvendes:
- color: Farvevælgere.
- font_size: Skriftstørrelser.
- font_family: Skrifttyper.
- range: Værdier inden for et bestemt interval (f.eks. bredde, højde).
- checkbox: Afkrydsningsfelter, der viser eller skjuler elementer.
- select: Valg fra dropdown-menuer, der styrer layout eller visuelle valg.
Disse typer er designet til at ændre temaets visuelle udtryk, såsom farver, skrifttyper eller layoutindstillinger. Selvom de fleste inputtyper er ensartede, kan den specifikke implementering afhænge af, hvordan temaet er bygget.
Inputtyper, der Bevares (Indholdsværdier)
Inputtyper, der typisk indeholder brugergenereret indhold, bevares, når en tema style anvendes. Disse kan omfatte:
- text: Tekstfelter til f.eks. overskrifter eller beskrivelser.
- textarea: Større tekstfelter til længere indhold.
- url: URL-felter til links.
- html: HTML-blokke til brugerdefineret indhold.
- image_picker: Billedvælgere, der bruges til specifikke billeder som logoer eller bannere.
Det er dog vigtigt at huske, at "præsentationsmæssig" kan være subjektivt. Hvis en udvikler bruger et tekstfelt til at gemme en farvekode, vil det sandsynligvis blive overskrevet som en præsentationsværdi. Omvendt, hvis et billede bruges som en del af et layout, der ændres med en preset, kan det også blive overskrevet.
Hvordan Sektionsdata Gemmes i settings_data.json
Når du arbejder med sektioner i dit tema (en central del af Online Store 2.0), vil du også se et sections objekt i både current og presets. Dette objekt genereres automatisk, hvis dit tema bruger sektionsfiler, og giver forhandlere mulighed for at tilføje sektioner dynamisk via temaeditoren.
Dynamiske sektioner kan få pæne, brugerdefinerede ID'er, hvis de er foruddefineret i settings_data.json. Hvis de tilføjes dynamisk, og filen automatisk genererer et current objekt, får de automatisk genererede ID'er.
Disse ID'er gemmes derefter i et content_for_index array, som definerer rækkefølgen af sektionerne på forsiden. Dette array i current opdateres, når en bruger ændrer rækkefølgen i temaeditoren. Du kan også manuelt justere rækkefølgen ved at flytte rundt på værdierne i dette array.
Håndtering af Flere Butikker med Én Tema Brug af Presets
Presets tilbyder en smart løsning til at administrere et enkelt tilpasset tema på tværs af flere forskellige online butikker. Hver preset i settings_data.json filen kan repræsentere en specifik butik.
Forestil dig et firma med flere datterselskaber, der hver har deres egen URL og varelager, men som deler et fælles tema. I stedet for at vedligeholde separate temaer for hver gren, kan man bruge presets. Hver preset kan navngives efter forretningsgrenen (f.eks. "greenhouse-nurseries", "greenhouse-grocery", "greenhouse-living") og indeholde specifikke tema indstillinger for den pågældende butik.
Dette giver en centraliseret styring, hvor ét tema kan bruges på tværs af alle butikker, hver med sin unikke konfiguration. Da settings_schema.json ikke overskriver presets, kan du gemme enhver form for information i en preset, selv hvis den ikke direkte mapper til en tema indstilling i settings_schema.json.
Potentielle Faldgruber ved Sporing af Ændringer
Når du redigerer eller ændrer settings_data.json filen, er det afgørende at have en klar strategi for, hvordan du sporer ændringer og integrerer det med din eksisterende udviklings workflow.
Da denne fil opdateres af temaeditoren, er det almindeligt, at den bliver markeret som "ikke sporet" i version control (f.eks. via .gitignore eller config.yml). Hvis filen ikke spores, kan direkte ændringer i filen nemt blive overskrevet af temaeditoren, eller omvendt, hvis ændringerne ikke trækkes ned fra din butik og committes/spores, før du starter på en ny funktion.
Det er derfor vigtigt at implementere en proces, hvor settings_data.json filen regelmæssigt synkroniseres med dit lokale udviklingsmiljø og versionskontrolsystemet.
Konklusion: Udnyt Tema Styles og Presets Kreativt
At bygge Shopify temaer, især dynamiske og fleksible, kan være en udfordring. Men oprettelsen af tema styles med presets behøver ikke at være kompliceret. Ved at forstå de fundamentale forskelle mellem settings_schema.json og settings_data.json, og hvordan tema styles er bygget ved hjælp af presets, kan du frigøre et enormt potentiale for tilpasning.
Vær kreativ med, hvordan du bruger tema styles og presets i dine næste projekter. Mulighederne er begrænsede kun af din fantasi og din evne til at bygge!
Ofte Stillede Spørgsmål (FAQ)
Hvad er formålet med settings_schema.json?
settings_schema.json definerer alle de tilgængelige indstillinger og deres struktur i Shopify temaeditoren. Det er "skabelonen" for, hvad en forhandler kan tilpasse.
Hvad gemmer settings_data.json?
settings_data.json gemmer de aktuelle værdier for de valgte tema indstillinger (i current objektet) og definerer foruddefinerede tema styles eller "presets" (i presets objektet).
Kan jeg tilføje mine egne presets?
Ja, du kan definere dine egne presets i settings_data.json filen for at tilbyde brugerdefinerede designpakker til dine kunder.
Hvilke indstillinger bliver ikke påvirket af presets?
Indstillinger, der betragtes som indhold (f.eks. tekst, billeder, URL'er), bliver typisk ikke overskrevet af presets, mens præsentationsmæssige indstillinger (farver, skrifttyper, layout) normalt bliver det.
Hvordan påvirker Online Store 2.0 disse filer?
Online Store 2.0 introducerer sektioner, der også administreres via settings_data.json, hvilket giver endnu mere fleksibilitet i, hvordan indhold og layout kan organiseres og tilpasses.
Hvis du vil læse andre artikler, der ligner Shopify Tema Indstillinger: En Dybdegående Guide, kan du besøge kategorien Teknologi.
