Menu

Tilpas din shop med din egen HTML/CSS

Du kan tilføje dine egne billeder, tekster, links og andre HTML-elementer.

Under Shopindstillinger > Spreadshop > Flere indstillinger > HTML/CSS finder du tre felter, du har til rådighed, hvis du ønsker at anvende din egen HTML/CSS i din shop ( Bemærk: Menupunktet "SpreadShop" kan kun ses af brugere, som har oprettet deres Spreadshirt-konto før den 30.9.2015):

  • Shop Header
  • Shop Footer
  • CSS Stylesheet

I header- eller footerområdet kan du indtaste det HTML, som du ønsker. For at være sikker på, at din shop virker, vil vi teste din HTML. På https://validator.w3.org/#validate_by_input er det muligt for dig selv at teste, om din HTML fungerer korrekt. Vær opmærksom på, at JavaScript af sikkerhedsmæssige årsager ikke kan anvendes, og at vi i givet fald fjerner det.

Herunder finder du et udvalg af CSS-klasser, som kan være anvendelige for din shop. De skal gøre designet af din shop endnu lettere. Naturligvis kan yderligere klassificeringer tilføjes og tilpasses:

Hvad vil du gerne tilpasse? CSS-klassificering
Baggrundsbillede eller -farve .customPageBackground
Sidehoved .customHeader
Sidefod med impressum og forretningsbetingelser .customFooter
Tæller i indkøbskurven eller på huskelisten .customCounter
Notifikationer .customNotification
Fejlmeldinger .customNotification.sprd-error
Overskrifter, f.eks. i indkøbskurven .customHeadline
Valg-elementer (størrelse, farve) .customSelector
Valgt option i valg-elementerne .customSelector .sprd-active.sprd-item
Kategori-udvalg (ikke-mobil) .customFilterItem, .customSubfilterItem
Hover-effekt i kategori-udvalg (ikke-mobil) .customSubfilterItem:hover
Kun smartphones og ikke tablets eller desktop-pc'er @media screen and (max-width: 767px) .customSelector.sprd-open
Forskellige knapper .customButton
Standard-knapper .customButton.sprd-default
.customButton.sprd-default:hover
.customButton.sprd-default:active
Vigtige knapper som f.eks. „Køb” .customButton.sprd-primary
.customButton.sprd-primary.hover
.customButton.sprd-primary:active
Sekundære knapper som f.eks. „Læg i indkøbskurv” (på huskelisten) .customButton.sprd-secondary
.customButton.sprd-secondary:hover
.customButton.sprd-secondary:active
Lightbox .customLightbox
Søgefelt på mobile enheder, dropdown-menuer på desktop-pc'er .customFilter
Animerede billeder på skærmen .sprd-loadable.sprd-loading, .sprd-loader

Hjalp denne artikel dig?