Fargepaletter

Du kan definere ulike fargeoppsett i temainnstillingene og bruke fargeoppsett i ulike seksjoner i nettbutikken med en fargetemavelger. Et fargeoppsett er et sett med farger. Temaet har et sett med standardfargeoppsett, som du når som helst kan endre i temaredigeringsprogrammet. Du kan legge til merkevarefarger for å sikre konsekvent bruk av fargepaletten i hele nettbutikken.

Temainnstillinger for fargevalg

Fargeoppsett er en temainnstilling som grupperer elementer og deres respektive farger på en visuelt representabel måte. Du kan tilordne ulike farger til ulike elementer i et enhetlig fargeoppsett som kan brukes på tvers av temaet der en fargetemavelger er tilgjengelig. Du kan ha opptil 21 fargevalg. Du kan også forhåndsvise hvordan fargene dine vises i forhåndsvisningen av skjemaet.

Innstilling	Beskrivelse
Bakgrunn	Fargen brukes i bakgrunnen av noen seksjoner, og på bakgrunnen til knapper med omriss.
Bakgrunn med fargeovergang	En fargeovergang brukes i bakgrunnen av noen seksjoner. Bakgrunnsoverganger erstatter bakgrunnen der det er mulig.
Tekst	Fargen brukes på seksjons- eller blokktekst.
Fylt knappebakgrunn	Fargen brukes på bakgrunnen i primærknapper.
Fylt knappetikett	Fargen brukes på teksten i primærknapper.
Omriss rundt knapp	Fargen brukes på tekst og ramme i sekundærknapper.
Skygge	Fargen brukes på skygger.

Administrer fargepaletten

Butikkens fargeoppsett og fargealternativer angis i temainnstillingene. For helfarger kan du bruke fargevelgeren til å velge en ny farge, eller angi fargeverdien i tekstfeltet. Fargefeltet godtar følgende fargenavn og verdier:

• fargenavn, som red, black eller blue
• RGB-fargekoder
• heksadesimale fargeverdier

Steg:

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Klikk på Tilpass ved siden av temaet du vil tilpasse.
3. Klikk på tannhjul-ikonet, og klikk deretter på Farger.
4. Klikk på et eksisterende oppsett i seksjonen Oppsett, eller klikk på Legg til oppsett for å legge til et nytt fargeoppsett.
5. Klikk på fargeprøven for innholdstypefargen du ønsker å endre.
6. For å angi farge må du oppgi en hexfargekode, eller velge fargen fra fargevelgeren. For å angi fargen til gjennomsiktig, må du slette hex-kodeverdien fra tekstfeltet.
7. Klikk på Lagre.

Legge til fargevalget ditt

Når du har definert fargevalget i temainnstillingene, kan du tilordne et fargevalg med fargevelgeren i temaets seksjoner og blokker. Fargetemavelgeren er bare tilgjengelig i enkelte seksjoner, blokker og generelle temainnstillinger.

Fargeoverganger

Du kan konfigurere en fargeovergang med farger i noen temaer for å skape visuelt interessante bakgrunner. Innstillingen color_background brukes til å tilpasse CSS-bakgrunnsegenskapen.

Tips

For å finne ut mer om fargeoverganger og CSS-bakgrunner, kan du se Mozillas dokumentasjon for lineære fargeoverganger og CSS-bakgrunn.

Fargeovergangvelgeren lar deg velge farger, overgangsstil, vinkel, posisjon og gjennomsiktighet for fargeovergangen. Alternativene som velges i fargeovergangvelgeren forhåndsvises i sanntid i temaredigeringsprogrammet. Du kan også opprette en fargeovergangsbakgrunn med CSS-kode, som inkluderer en valideringskontroll.

Konfigurer fargeoverganger

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Klikk på Tilpass ved siden av temaet du vil tilpasse.
3. Klikk på tannhjul-ikonet, og klikk deretter på Farger.
4. Klikk på et eksisterende oppsett du vil redigere i seksjonen Oppsett.
5. Klikk på alternativet for fargeoverganger, som Bakgrunnsovergang.
6. Hvis du ikke har konfigurert en fargeovergang fra før, vises noen forhåndsinnstilte alternativer du kan velge blant. Velg en forhåndsinnstilt fargeovergang for å åpne alternativpanelet.
7. Velg alternativer for fargeovergangen:

• Velg mellom en lineær eller radial fargeovergang. Bruk knappene til å velge foretrukken fargeovergangsstil.
• Angi vinkelen på fargeovergangen med pil opp og ned. Ved å klikke på pil opp eller ned økes eller reduseres vinkelprosenten med fem.
• Bruk glidebryteren for å velge plassering av fargeovergangen, eller angi en numerisk verdi i feltet.
• Angi en bestemt fargehexkode, eller bruk glidebryteren for å velge en nyanse. Nylig valgte farger vises nederst i panelet for fargeovergangsalternativer.
• Hvis du vil gjøre fargeovergangen ugjennomsiktig, bruker du glidebryteren til høyre for å velge gjennomsiktighet på fargeovergangen. Du kan også angi en prosentverdi i feltet ved siden av hexfargekoden.

1. Klikk på Lagre.

Bruk CSS til å angi fargeoverganger

De fleste background-egenskapsverdier i CSS kan brukes for å angi en bakgrunnsfarge. Du kan bruke dette feltet til helfarger (for eksempel #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) og hsla(0, 0%, 0%, 1), som alle gir en helsort bakgrunn), eller til fargeoverganger (for eksempel linear-gradient(red, green), radial-gradient(red, green) eller conic-gradient(red, green)). Fargeoverganger kan også gjentas.

Steg:

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Klikk på Tilpass ved siden av temaet du vil tilpasse.
3. Klikk på tannhjul-ikonet, og klikk deretter på Farger.
4. Klikk på et eksisterende oppsett du vil redigere i seksjonen Oppsett.
5. Klikk på fargeovergangen du vil redigere.
6. Klikk på pilen ved siden av Fargeovergang, og velg deretter CSS.
7. I feltet CSS-kode skriver du inn eller limer inn fargeovergangskoden din. Forhåndsvisningen i temaredigeringsprogrammet viser fargeovergangen på riktig sted.
8. Klikk på Lagre.

Fjern en fargeovergang

1. Fra Shopify-administrator går du til Nettbutikk > Temaer.
2. Klikk på Tilpass ved siden av temaet du vil tilpasse.
3. Klikk på tannhjul-ikonet, og klikk deretter på Farger.
4. Klikk på et eksisterende oppsett du vil redigere i seksjonen Oppsett.
5. Klikk på fargeovergangen du vil fjerne.
6. Klikk på Fjern fargeovergang.
7. Klikk på Lagre.