Farger

I innstillingene for nettbutikken din finner du et sted der du kan velge farger. Dette er som å lage en fargepalett som butikken din skal bruke.

Velg farger:

• Du kan bestemme hvilke farger knappene, tekstene og bakgrunnene i butikken skal ha.

• For eksempel kan du bestemme at alle knappene skal være blå.

Se endringene:

• Når du endrer en farge, kan du se hvordan det ser ut med en gang i en forhåndsvisning.

• Dette gjør at du kan prøve deg frem og finne de fargene du liker best.

Kort sagt, fargeinnstillingene lar deg tilpasse utseendet på nettbutikken din ved å velge og lagre farger.

Avansert modus

Sørg for at “avansert modus” er påslått for å få tilgang til alle innstillinger og farger.

Variabler

Fargene i temainnstillingene lagres som CSS-variabler, slik at de kan gjenbrukes overalt i designbyggeren men også gjennom tilpasset kode.

Hva er en variabel?

En CSS-variabel, også kjent som en "CSS custom property", er en måte å lagre verdier som kan gjenbrukes i CSS-koden din. Tenk på det som en beholder for en verdi, som en farge, en størrelse eller et skrift.

Bruk av farger og variabler

Nå man legger til en blokk som inneholder fargeinnstillinger vil den som standard benytte den fargen som er satt opp i temainnstillinger.

For eksempel; tekstfarge i en blokk vil automatisk linkes til tekstfarge i globale innstillinger.

Dette indikeres på fargevelgeren i blokken med teksten Linked to global color og et ikon som indikerer at linken er aktiv. Om du ønsker å endre til en farge som ikke er satt opp i temainnstillingene kan du selv skrive inn fargekode i feltet. Ikonet til høyre vil da endre seg og indikerer at linken til den globale fargen er brutt, slik:

Gjenopprett link

Om du har endret farge manuelt slik at linken ble brutt, men ønsker å gjenopprette linken kan du klikke på ikonet. Feltet vil da linkes til den globale farger og feltet oppdateres til Linked to global color i tillegg til at ikonet oppdateres.

Bruke andre variabler

I tillegg til å bruke den globale fargen for feltet kan du koble feltet til andre fargevariabler fra temainnstillingene. Du kan for eksempel koble tekstfarge til fargevariablen for primærfarge.

• Finn feltet du vil endre farge for

• Klikk på knappen for å endre farge

• Velg blant variablene som vises i bunnen (hold musepekeren over for å se hvilket felt fargen tilhører)

Når man velger en annen variabel enn den som er global vil feltet fortsatt vise link-ikonet , men nå vil navnet på variabelen vises i feltet. Eksempel: var(—primary-color)

Linken til global farge kan gjenopprettes på samme måte som over.