Designa en banderoll
Bakgrund, färger, avstånd, stängningsknappen och hur du gör hela banderollen till en länk.
Panelen Design är penselikonen i byggarens sidofält. Den omfattar allt om hur banderollen ser ut, förutom själva elementen.
Designinställningarna gäller hela banderollen, inte ett enskilt element.
Utseende och bakgrund
Section titled “Utseende och bakgrund”Tre bakgrundsstilar:
| Stil | Vad du anger |
|---|---|
| Solid | En färg |
| Gradient | En från-färg, en till-färg och en vinkel |
| Image | En bild som täcker banderollen |
Färger
Section titled “Färger”| Inställning | Vad den omfattar |
|---|---|
| Font | Typsnittet. Låt det vara temats typsnitt om inte banderollen behöver ett eget. |
| Text | Banderollens textfärg |
| Accent | Knappar, rabattkoder och nedräkningen – om inte något av dem har fått en egen färg |
Accent är den som är värd att förstå. Ange den en gång så följer knappen, kodens kontur och timern efter. Ge ett element en egen färg så slutar det elementet att följa.
Stängningsknapp och länk
Section titled “Stängningsknapp och länk”Två separata saker, båda om vad som händer när en besökare interagerar med banderollen.
Stängningsknapp
Section titled “Stängningsknapp”Slå på den så visas ett × i banderollens ände. Ange dess färg och dess färg vid hovring.
När en besökare har stängt banderollen förblir den stängd för hen – appen minns det i webbläsaren, så den dyker inte upp igen på nästa sida.
Hela banderollen klickbar
Section titled “Hela banderollen klickbar”Slå på det så öppnar ett klick var som helst på banderollen länken som du anger under den. Open in a new tab lämnar din butik öppen bakom den.
Klick på en knapp eller en rabattkod i banderollen gör fortfarande sitt eget – banderollens länk sväljer dem inte.
Hur elementen radas upp i banderollen.
| Inställning | Vad den gör |
|---|---|
| Alignment | Vänster, centrerad, höger eller utspridd |
| Gap between elements | Utrymmet mellan varje element |
| Wrap on small screens | På: raden bryts till en ny rad när utrymmet tar slut. Av: den trycks ihop i stället, vilket kan klippa långa meddelanden. |
Avstånd
Section titled “Avstånd”Vertical padding är hur hög banderollen är. Horizontal padding är marginalen i varje ände.
En tunn banderoll läses som en notis, en hög som en del av sidan. De flesta meddelandebanderoller vill ha den tunna änden.
Anpassad CSS
Section titled “Anpassad CSS”Längst ned i panelen tar Custom CSS (Developer Zone) regler som bara gäller i den här banderollen. De kan inte påverka resten av ditt tema.
Använd den för sådant som panelerna inte täcker – en textskugga, ett teckenavstånd, en annan kantlinje på ett element.