Farveskemaer

Du kan definere forskellige farveskemaer i dine temaindstillinger og anvende farveskemaerne på forskellige afsnit i hele din webshop med en farveskemavælger. Et farveskema er et sæt farver. Dit tema har en række standardfarveskemaer, som du kan ændre når som helst i temaeditoren. Du kan tilføje farverne på dit brand for at sikre en sammenhængende applikation af din farvepalet på tværs af din webshop.

Temaindstillinger for farveskema

Farveskemaer er en temaindstilling, der grupperer elementer og deres respektive farver på en visuelt repræsentativ måde. Du kan tildele forskellige farver til forskellige elementer i et sammenhængende farveskema, der kan anvendes i hele dit tema, hvor der er en tilgængelig farveskemavælger. Du kan have op til 21 farveskemaer. Du kan også se en forhåndsvisning af, hvordan dine farver vises, i skemaets forhåndsvisning.

Indstilling	Beskrivelse
Baggrund	Farven anvendes på baggrunden i nogle afsnit og på baggrunden på oversigtsknappen.
Baggrundsgraduering	En farvegraduering anvendes på baggrunden i nogle afsnit. Baggrundgradueringerne erstatter baggrunden, hvor det er muligt.
Tekst	Farven anvendes på afsnittet eller blokteksten.
Udfyldt knapbaggrund	Farven anvendes på baggrunden for den primære knap.
Udfyldt knaptekst	Farven anvendes på teksten på den primære knap.
Rammeknap	Farve anvendes på den sekundære knaps tekst og kant.
Skygge	Farven anvendes på skyggerne.

Administrer dit farveskema

Din butiks farveskema og farveindstillinger er angivet i dine temaindstillinger. Brug farvevælgeren til at vælge en ny farve eller indtast værdien af farven i tekstfeltet. Farvefeltet accepterer følgende farvenavne og -værdier:

• farvenavne, såsom red, black eller blue
• RGB-farvekoder
• heksadecimale farveværdier

Fremgangsmåde:

1. Gå til Webshop > Temaer i din Shopify-administrator.
2. Klik på Tilpas ud for det tema, du vil tilpasse.
3. Klik på tandhjulskikonet, og klik på Farver.
4. I afsnittet Skemaer skal du klikke på et eksisterende skema eller klikke på Tilføj skema for at tilføje et nyt farveskema.
5. Klik på farveprøven for den farvetype for indhold, du vil ændre.
6. For at indstille din farve skal du indtaste en hex-farvekode eller vælge farven fra farvevælgeren. Hvis du vil angive farven til gennemsigtig, skal du slette hex-koden fra tekstfeltet.
7. Klik på Gem.

Anvender dit farveskema

Når du har defineret dit farveskema i dine temaindstillinger, kan du tildele et farveskema ved hjælp af farveskemavælgeren i dit temas afsnit og blokke. Farveskemavælgeren er kun tilgængelig i visse afsnit, blokke og generelle temaindstillinger.

Gradueringer

Du kan opsætte en graduering af farver i nogle temaer for at skabe visuelt spændende baggrunde. Indstillingen color_background bruges til at tilpasse CSS-baggrundens egenskaber.

Tip

Få mere at vide om gradueringer og CSS-baggrunde i Mozillas dokumentation for lineære gradueringer og CSS-baggrunde.

Du kan bruge gradueringsvælgeren til at vælge gradueringens farver, type, vinkel, placering og gennemsigtighed. Du kan se en forhåndsvisning af de indstillinger, du vælger i gradueringsvælgeren, i realtid i temaeditoren. Du kan også oprette en gradueringsbaggrund ved hjælp af CSS-kode, som omfatter en valideringskontrol.

Opsæt gradueringer

1. Gå til Webshop > Temaer i din Shopify-administrator.
2. Klik på Tilpas ud for det tema, du vil tilpasse.
3. Klik på tandhjulskikonet, og klik på Farver.
4. Klik på et eksisterende skema, som du vil redigere, i afsnittet Skemaer.
5. Klik på indstillingen for gradueringsfarven, som f.eks. Baggrundsgraduering.
6. Hvis du ikke tidligere har opsat en graduering, vises der flere forudindstillede valgmuligheder, som du kan vælge mellem. Vælg en hvilken som helst forudindstillet graduering for at åbne panelet med valgmuligheder.
7. Vælg dine gradueringsmuligheder:

• Vælg mellem en lineær eller radial graduering. Brug knapperne til at vælge din foretrukne gradueringstype.
• Du kan indstille vinklen på din graduering med pil op og ned. Hvis du klikker på op- eller ned-pilen øges eller mindskes vinklens hældning med 5.
• Brug skyderen til at vælge din graduerings placering, eller angiv en numerisk værdi i feltet.
• Du kan angive en specifik hex-kode for en farve eller vælge en farve ved hjælp af skyderen. Dine senest valgte farver vises nederst i panelet med gradueringsmuligheder.
• Hvis du gerne vil gøre din graduering uigennemsigtig, kan du bruge skyderen til højre til at justere gradueringens gennemsigtighed. Du kan også angive et procenttal i feltet ud for farvens hex-kode.

1. Klik på Gem.

Angiv gradueringer ved hjælp af CSS

Du kan bruge de fleste CSS-værdier for background-egenskaber til at angive en baggrundsfarve. Du kan bruge dette felt til uigennemsigtige farver (f.eks. #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) og hsla(0, 0%, 0%, 1) skaber alle en uigennemsigtig sort baggrund). Du kan også bruge feltet til gradueringer (f.eks. linear-gradient(red, green), radial-gradient(red, green) eller conic-gradient(red, green)). Du kan også gentage gradueringer.

Fremgangsmåde:

1. Gå til Webshop > Temaer i din Shopify-administrator.
2. Klik på Tilpas ud for det tema, du vil tilpasse.
3. Klik på tandhjulskikonet, og klik på Farver.
4. Klik på et eksisterende skema, som du vil redigere, i afsnittet Skemaer.
5. Klik på den graduering, du vil redigere.
6. Klik på pilen ud for Graduering, og vælg derefter CSS.
7. Skriv eller indsæt din gradueringskode i feltet CSS-kode. Temaeditorens forhåndsvisning viser din graduering på den rigtige placering.
8. Klik på Gem.

Fjern en graduering

1. Gå til Webshop > Temaer i din Shopify-administrator.
2. Klik på Tilpas ud for det tema, du vil tilpasse.
3. Klik på tandhjulskikonet, og klik på Farver.
4. Klik på et eksisterende skema, som du vil redigere, i afsnittet Skemaer.
5. Klik på den graduering, du vil fjerne.
6. Klik på Fjern graduering
7. Klik på Gem.