TheShopbuilders - Logo
Begin direct
Handleiding

Eigen CSS

In het tabblad CSS van de Designopties kun je eigen CSS-regels toevoegen aan je webshop. CSS (Cascading Style Sheets) is de taal waarmee de vormgeving van een website wordt beschreven. Met eigen CSS kun je specifieke elementen fine-tunen die niet via de standaard designopties aan te passen zijn, zoals de hoogte van het logo, een extra marge onder een titel of het verbergen van een bepaald icoon.

Waar vind je de CSS-optie?

  1. Open de Designopties.
  2. Klik in het linker menu op het tabblad CSS.
  3. Je ziet een tekstvak Custom CSS waarin je eigen CSS-code kunt typen of plakken.
  4. De wijzigingen worden automatisch opgeslagen. Klik op Publiceer om ze live te zetten.

Wanneer gebruik je eigen CSS?

De meeste vormgeving kun je al regelen via de andere tabbladen van de Designopties (Algemeen, Kleuren, Lettertypes, enzovoort). Gebruik eigen CSS pas als een aanpassing niet via de gewone opties mogelijk is. Denk bijvoorbeeld aan:

  • De maximale hoogte van je logo instellen.
  • Een bepaald icoon of knop verbergen.
  • Extra witruimte toevoegen rondom een specifiek element.
  • Kleine kleuraccenten die niet via de kleurenpicker instelbaar zijn.
  • Het uiterlijk van een specifieke productweergave verfijnen.

Voorbeelden

Hieronder een paar veelgebruikte voorbeelden die je direct kunt plakken en aanpassen:

/* Logo maximale hoogte */
#site_logo img { max-height: 60px; }

/* Titels in vet zetten */
h1, h2 { font-weight: 700; }

/* Verlanglijst-icoon verbergen */
.s_actions .s_button_wishlist { display: none; }

Tips en voorzorgen

  • Test altijd na een wijziging. Controleer je webshop op desktop, tablet én mobiel nadat je CSS hebt toegevoegd of aangepast.
  • Gebruik één regel per aanpassing. Schrijf overzichtelijke code met een korte opmerking erboven (tussen /* */), zodat je later nog weet waarvoor een regel dient.
  • Geen CSS kennis? Neem contact op met TheShopBuilders of je webbouwer. Verkeerd geschreven CSS kan de weergave van je site verstoren.
  • Back-up. Kopieer je CSS-code naar een apart tekstbestand voordat je grote wijzigingen maakt. Zo kun je altijd terug naar een werkende versie.

Hulp nodig?

Loop je vast met een CSS-aanpassing? Neem gerust contact op met TheShopBuilders. We helpen je graag met maatwerk CSS-oplossingen.