Knapp og ikoner

Med Knapper og lenker kan du legge til alle typer lenker (1) i seksjonen. Du kan legge til en knapp/tekstlenke/bildelenke/ikon/skilletegn.

Du kan duplisere (2), redigere (3) eller slette (4) den eksisterende knappen/lenken.

I denne artikkelen:

1. Legg til knapper/lenker
2. Stilknapper/lenker

---

Legg til knapper/lenker

• For å legge til en hvilken som helst type lenke til seksjonen, klikk på + Legg til knapp alternativet.

Alternativet + Legg til knapp gir fire måter å legge til en lenke på. I tillegg til dette kan du også legge til skilletegn for å legge til mellomrom mellom knapper/lenker. Følgende er alternativene:

• Button
• Knappestil
• Tekstlenke
• Bilde
• Ikon
• separator

---

Button

Legg til en knapp i listeelementet.

Du vil kunne oppdatere:

1. Knappetikett – Spesifiser synlig tekst på knappen din. Dette er hva brukerne vil se og klikke på.
2. Knapp Link – Spesifiser URL eller handling knappen skal utløses når man klikker på den.
3. Målvindu – Velg om lenken skal åpnes i samme fane eller ny fane.
4. Knappestil – Velg knappestilen som skal være standard (sett i Knapper og lenker kategorien i Design-delen), Solid, Outline eller en tekstkobling.

• • Misligholde: Følger nettstedets temainnstillinger.
  • Fast: En fet, utfylt knapp.
  • Outline: Gjennomsiktig bakgrunn med en kantlinje.
  • Tekstlink: Enkel, ren tekststil (ingen knappeboks).

5. Knappeform – Sett a tilpasset form for hver enkelt knapp innenfor seksjonen. Dette lar deg overstyre den globale knappeformen som er definert under Designinnstillinger, noe som gir deg mer kontroll over hvordan hver knapp vises. De tilgjengelige formene er Firkantet, Avrundet og Pilleformet.
6. Knappefarge – Tilpass fargeskjemaet til knappen:

• • Misligholde: Arver temainnstillingene.
  • Inverter: Reverserer tekst-/bakgrunnsfargene på knappen.
  • Tilpasset: Lar deg velge spesifikke tekst- og bakgrunnsfarger.

7. Button tekst - Hvis du bruker Tilpasset knappfarge, kan du stille inn tekstfarge (etikettfarge) herfra.
8. Knappbakgrunn – Også tilgjengelig under Tilpasset, angir dette knappens bakgrunnsfarge. Kombiner dette med tekstfarge for maksimal lesbarhet og stil.
9. Knappikon – Legg til et ikon ved siden av knappetiketten. Du kan velge mellom forskjellige ikonalternativer.
10. Layout – Kontroller plasseringen av ikonet i forhold til etiketten. Tilgjengelige layoutalternativer er:

• • Etikett + ikon: Tekst vises først, etterfulgt av ikonet.
  • Ikon + Etikett: Ikonet vises først, deretter teksten.
  • Etikett + ikon (bred): Tekst og ikoner er ordnet med mer margin, egnet for bredere knapper.
  • Ikon + Etikett (Bred): Ikon først, bredere marginlayout.

11. Ikonfarge – Velg fargen på knappikonet. Du kan enten sette den til Button tekst fargen eller Merke farge.

---

Innstillinger for knappestil

Du finner disse innstillingene under Stil-fanen i seksjonene. Disse innstillingene lar deg finjustere utseendet, avstanden og oppsettet til knapper på Pixpa-nettstedet ditt for bedre designkontroll og responsivitet:

1. Knappestørrelse – Velg størrelsen på knappen (f.eks. Liten, Medium, Stor). Dette justerer margen og skriftstørrelsen slik at den passer til designet ditt.
2. Mellomrom mellom knapper – Kontrollerer den horisontale avstanden mellom flere knapper. Du kan bruke vw-enheter (viewport width) for responsiv avstand.
3. Plass over knapper – Legger til vertikal avstand over knappen(e). Dette bidrar til å skille dem fra innholdet ovenfor, målt i %.
4. Tekstlenke – Justerer skriftstørrelsen for tekstlenker på knapper (spesielt nyttig når du bruker en «Tekstlenke»-stil i stedet for en tradisjonell knapp).
5. Bilde som knapp (størrelse) – Hvis du bruker et bilde i stedet for en tradisjonell knapp, definerer denne innstillingen bildets visningsstørrelse (i piksler).
6. Knappbredde – Velg hvor bred knappen skal vises:

• • Misligholde: Standardbredde basert på knappinnhold
  • Stor / Ekstra stor: Bredere knapper for mer vekt
  • Full bredde: Knappen strekker seg over hele beholderbredden

---

Tekstlenke

Legg til en tekstlenke til listeelementet.

Du vil kunne oppdatere:

1. Sett tekstetikett.
2. Spesifiser tekstlink.
3. Målvindu – Velg å åpne siden i samme eller et nytt vindu.

---

Bilde

Legg til et bilde og koble det til en hvilken som helst side.

• Når du har lastet opp bildet, vises det på denne måten. Klikk på lenken for å redigere den.

• Herfra kan du:
  1. Last opp/Endre bildet.
  2. Knapp Link – Spesifiser lenken.
  3. Målvindu – Velg å åpne siden i samme eller et nytt vindu.

---

Sosial ikon

• Legg til et sosialt ikon til listeelementet.

Du kan administrere:

1. Det sosiale ikonet som skal kobles til.
2. Spesifiser din relevante sosiale profilbane.
3. Målvindu – Velg å åpne siden i samme eller et nytt vindu.

---

separator

Med alternativet Skilletegn kan du sette inn avstand mellom knapper eller lenker.

Dette er nyttig for å lage visuell separasjon mellom knapper som er plassert tett inntil hverandre. Du kan legge til en separator fra Knapp og lenker- panelet akkurat som du legger til andre knapper.

• Avstanden mellom knappene styres av Polstring – Topp innstillingen i skilletegnet. Justering av denne verdien øker eller reduserer den vertikale avstanden mellom knapper som er plassert tett sammen.

 

---

Stilalternativer for knapp og lenker

Stilalternativene vil være tilgjengelige under Stil- fanen når du administrerer seksjonen.

Du vil ha flere stilalternativer for knappen og lenkene som følger:

Knapp og lenker

1. Spesifiser Mellomrom mellom knapp/lenker som har blitt lagt til.
2. Spesifiser Plass over knapp/lenker.
3. Velg hover Effect for knappen/lenkene.

Knappestørrelse 

---

Eksempel

For eksempel, anta at du har lagt til en Amazon-sosial lenke i knappen/lenkene , og spesifisert ikonfargen som rød og ikonbakgrunnsfargen som grønn, da vil ikonet vises som vist nedenfor: