Sådan matcher du widgetten med dit temas farver

Bundlex kan matche din bundle-widget med din butiks udseende med få klik. Panelet Farveforudindstillinger til widget læser farveskemaerne i dit Shopify-tema og foreslår færdige farvekombinationer, så dine tilbud føles som en naturlig del af siden i stedet for noget, der er sat ovenpå.

Hvor finder du farveforudindstillinger

Åbn en bundle i editoren, og gå til fanen Stil. Panelet Farveforudindstillinger til widget ligger over de detaljerede indstillinger under Widgetstil. Brug forudindstillinger til at indstille alt på én gang, og finjuster derefter individuelle elementfarver i sektionen Widgetstil nedenfor, hvis du ønsker det.

Vælg en primærfarve

Rækken Primærfarve er udgangspunktet for hele paletten. Du kan indstille den på fire måder:

• Foreslåede farveprøver - de farvede farveprøver hentes direkte fra farveskemaerne i dit Shopify-tema, f.eks. knapfarver, tekst, baggrunde og lignende. Klik på en for at anvende den.
• Standardfarver - den mørkegrå farveprøve efter dit temas farveprøver gendanner widgettens standardfarver i sort og hvid.
• Brugerdefineret farve - klik på farveprøven med plusikonet for at åbne en farvevælger og vælge en vilkårlig hex-værdi. Tryk på Enter, når du har indtastet hex-værdien, og kontrollér, at forhåndsvisningen ændres.
• Tilfældig farve - klik på opdateringsfarveprøven for at vælge en tilfældig farve, hvis du bare vil udforske mulighederne.

Uanset hvad du vælger, genopbygger Bundlex straks resten af widgettens farver omkring den og anvender resultatet på den aktive forhåndsvisning.

Vælg en accentfarve (sekundær farve)

Den sekundære farve er den accent, der bruges til badges, aktive tilstande og fremhævelser. Bundlex genererer den automatisk, så den harmonerer med din primærfarve, og tilbyder flere harmonimuligheder som farveprøver, du kan klikke dig igennem.

Hvis du hellere selv vil indstille accenten, har du de samme to tilsidesættelser som i rækken for primærfarven:

• Brugerdefineret accentfarve - plusfarveprøven åbner en vælger, hvor du kan angive en præcis hex-værdi.
• Tilfældig harmonifarve - opdateringsfarveprøven vælger en kontrastfarve fra farvehjulet, som stadig fungerer sammen med din primærfarve.

Til/fra-knap for gennemsigtige tilbud

Ved siden af primærfarven finder du en Transparent-knap, der styrer baggrunden for ikke-valgte tilbudskort:

• Fra - baggrunde for ikke-valgte tilbud får en ensfarvet baggrund, en lys tone af dine farver, når den kommer fra en forudindstilling, så hvert niveau fremstår som sit eget kort.
• Til - baggrunde for ikke-valgte tilbud forbliver gennemsigtige, hvilket giver et renere og fladere udseende, der går i ét med siden.

Når du skifter knappen, ændres kun gennemsigtigheden af baggrunden for det ikke-valgte tilbud. Baggrunde for valgte tilbud og hover, tekst-, badge- og kantfarver forbliver uændrede. Når du slår den fra, bliver baggrunden helt uigennemsigtig igen. Farveprøver, du klikker på, mens den er slået til, anvender den gennemsigtige version af den pågældende forudindstilling.

Forslaget "Anvend hjørneradius"

Farver er ikke det eneste, Bundlex kan hente fra dit tema. Hvis det registrerer, at dit temas hjørneradius adskiller sig fra widgettens aktuelle hjørner, vises et banner med Anvend hjørneradius og teksten "Match widgettens hjørner med dit tema."

1. Klik på Anvend i banneret for at anvende dit temas hjørneradius på widgettens tilbudskort, tilbudsbilleder og mersalgsbilleder.
2. Eller luk det med luk-ikonet, hvis du foretrækker dine nuværende hjørner.

Forslaget kan mangle, fordi der ikke er registreret nogen forskel, temaet ikke angiver en brugbar radius, eller du har afvist det. Du kan stadig indstille hjørnerne selv under Widgetstil.

Finjuster individuelle elementer

Når du har valgt din palet, skal du udvide et element under Widgetstil. Tilbudskort giver dig mulighed for at justere hjørneradius, afstand samt valgte, hover- og ikke-valgte tilstande separat. I dette eksempel indstillede vi kortets radius til 8 pixels. Anvend først forudindstillinger, og foretag derefter disse sidste justeringer, fordi valg af en anden forudindstilling kan erstatte individuelle farvevalg.

Gem, og kontrollér din storefront

Klik på Gem. Test en aktiv rabat på den målrettede produktside. Vælg hvert tilbud, kontrollér tekstens og badgets kontrast, vælg varianter, og brug Læg i kurv. Kontrollér siden på computer og mobil, da editorens forhåndsvisning ikke kan vise alle temabaggrunde eller skærmstørrelser.

Vores eksempel bruger de samme regler for mængderabatter: To Ivory Small-tasker har en varesubtotal på $43.20 efter 10 % rabat. Styling ændrer præsentationen, men ikke rabatberegningen. Kontrollér kurv og checkout som en del af din endelige gennemgang.

Sådan genereres forslag

Bundlex læser dit temas farveindstillinger og udleder matchende nuancer. De temabaserede forslag kan gentages med de samme temaindstillinger. Kontrollerne Tilfældig farve og Tilfældig harmoni genererer med vilje nye valg.

Tips

• Forudindstillinger er et hurtigt udgangspunkt. Når du har anvendt en, kan du stadig justere farven på hvert enkelt element i Widgetstil.
• Hvis der ikke vises foreslåede farveprøver, kunne Bundlex ikke læse farveværdier fra dit aktive tema. Du kan stadig bruge de brugerdefinerede og tilfældige indstillinger.
• Brug den aktive forhåndsvisning til at kontrollere kontrasten, især når knappen Transparent er slået til, så badges og tekst forbliver læselige på din sidebaggrund.