Thema-instellingen

Je kunt de themainstellingen aanpassen in het zijbalkmenu van de themabewerker gebruiken om wijzigingen aan te brengen in de typografie, kleuren, links naar sociale media en de winkelwagenpagina van je webshop. Wijzigingen aan de thema-instellingen gelden voor je hele webshop.

Secties en blokken hebben ook instellingen die je kunt aanpassen om individuele secties van je thema aan te passen. Meer informatie over secties en blokken.

Je kunt een logo voor je bedrijf aan je webshop toevoegen. Het logo wordt op de volgende plaatsen weergegeven:

  • de koptekst op al je pagina's;
  • je wachtwoordpagina.

Je logo aanpassen

Logoafbeeldingen hebben een maximale breedte van 300 px.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Logo.

  5. Voeg je afbeelding toe bij het onderdeel Logo of gebruik een gratis afbeelding:

    • Klik op Afbeelding selecteren en voeg een nieuwe of bestaande afbeelding toe:

      • Als je een afbeelding wil gebruiken die je al naar het Shopify-beheercentrum hebt geüpload, selecteer je de afbeelding en klik je op Gereed.
      • Als je een afbeelding van je lokale computer wil gebruiken, klik je op Afbeeldingen toevoegen. Selecteer een afbeelding, voeg deze toe en klik op Gereed.
    • Klik op Gratis afbeeldingen ontdekken als je een gratis afbeelding wil gebruiken. Zoek een afbeelding, klik erop en klik op Selecteren.

  6. Optioneel: Voeg alt-tekst toe aan je logoafbeelding:

    1. Klik bij Logo op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Klik op Opslaan.
  7. Optioneel: Schuif bij Breedte van logo op desktop de schuifregelaar naar de gewenste pixelbreedte.

  8. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Logo.

  7. Voeg je afbeelding toe bij het onderdeel Logo of gebruik een gratis afbeelding:

    • Als je de afbeelding wil toevoegen, tik je op Afbeelding selecteren en voeg je een nieuwe of bestaande afbeelding toe:

      • Als je een afbeelding wil gebruiken die je al naar het Shopify-beheercentrum hebt geüpload, selecteer je de afbeelding en tik je op Gereed.
      • Als je een afbeelding van je lokale apparaat wil gebruiken, tik je op Afbeeldingen toevoegen. Selecteer een afbeelding van je lokale apparaat, tik erop en tik dan op Gereed.
    • Als je een gratis afbeelding wil gebruiken, tik je op Gratis afbeeldingen ontdekken. Zoek een afbeelding, tik erop en tik dan op Gereed.

  8. Optioneel: Voeg alt-tekst toe aan je logoafbeelding:

    1. Tik bij Logo op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Tik op .
  9. Optioneel: Schuif bij Breedte van logo op desktop de schuifregelaar naar de gewenste pixelbreedte.

  10. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Logo.

  7. Voeg je afbeelding toe bij het onderdeel Logo of gebruik een gratis afbeelding:

    • Als je de afbeelding wil toevoegen, tik je op Afbeelding selecteren en voeg je een nieuwe of bestaande afbeelding toe:

      • Als je een afbeelding wil gebruiken die je al naar het Shopify-beheercentrum hebt geüpload, selecteer je de afbeelding en tik je op Gereed.
      • Als je een afbeelding van je lokale apparaat wil gebruiken, tik je op Afbeeldingen toevoegen. Selecteer een afbeelding van je lokale apparaat, tik erop en tik dan op Gereed.
    • Als je een gratis afbeelding wil gebruiken, tik je op Gratis afbeeldingen ontdekken. Zoek een afbeelding, tik erop en tik dan op Gereed.

  8. Optioneel: Voeg alt-tekst toe aan je logoafbeelding:

    1. Tik bij Logo op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Tik op .
  9. Optioneel: Schuif bij Breedte van logo op desktop de schuifregelaar naar de gewenste pixelbreedte.

  10. Tik op .

Een favicon toevoegen

Je kunt een pictogram voor favorieten (een favicon) toevoegen, waarmee je de branding van je webshop kunt promoten. Favicons worden op de volgende plaatsen weergegeven:

  • op het tabblad van je webbrowser
  • de geschiedenis van je webbrowser
  • als pictogrammen op je bureaublad
  • op een bladwijzer naast de naam van je webshop.

Meer informatie over favicons.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema waarvoor je een favicon wil toevoegen en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Logo of Favicon, afhankelijk van de versie van je thema.

  5. Klik in de sectie Favicon-afbeelding op Afbeelding selecteren en voeg een nieuwe of bestaande afbeelding toe:

    • Als je een afbeelding wil selecteren die je al naar het Shopify-beheercentrum hebt geüpload, kun je de afbeelding zoeken of vinden en deze vervolgens selecteren met het selectievakje.
    • Als je een afbeelding wil selecteren vanaf je computer, klik je op Afbeeldingen toevoegen, open je de afbeelding vanaf je computer en selecteer je deze vervolgens met het selectievakje.
  6. Klik op Gereed.

  7. Optioneel: Voeg alt-tekst aan je favicon-afbeelding toe:

    1. Klik in de sectie Favicon-afbeelding op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Klik op Opslaan.
  8. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema waarvoor je een favicon wil toevoegen en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Logo of Favicon, afhankelijk van de versie van je thema.

  7. Tik in de sectie Favicon-afbeelding op Afbeelding selecteren en voeg een nieuwe of bestaande afbeelding toe:

    • Als je een afbeelding wil selecteren die je al naar het Shopify-beheercentrum hebt geüpload, kun je de afbeelding zoeken of vinden en deze vervolgens selecteren met het selectievakje.
    • Als je een afbeelding wil selecteren vanaf je apparaat, tik je op Afbeeldingen toevoegen, open je de afbeelding vanaf je apparaat en selecteer je deze vervolgens met het selectievakje.
  8. Tik op Gereed.

  9. Alternatieve tekst aan je favicon-afbeelding toevoegen:

    1. Tik in de sectie Favicon-afbeelding op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Tik op .
  10. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema waarvoor je een favicon wil toevoegen en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Logo of Favicon, afhankelijk van de versie van je thema.

  7. Tik in de sectie Favicon-afbeelding op Afbeelding selecteren en voeg een nieuwe of bestaande afbeelding toe:

    • Als je een afbeelding wil selecteren die je al naar het Shopify-beheercentrum hebt geüpload, kun je de afbeelding zoeken of vinden en deze vervolgens selecteren met het selectievakje.
    • Als je een afbeelding wil selecteren vanaf je apparaat, tik je op Afbeeldingen toevoegen, open je de afbeelding vanaf je apparaat en selecteer je deze vervolgens met het selectievakje.
  8. Tik op Gereed.

  9. Alternatieve tekst aan je favicon-afbeelding toevoegen:

    1. Tik in de sectie Favicon-afbeelding op Bewerken.
    2. Typ in het veld Alt-tekst een korte beschrijving van de afbeelding.
    3. Tik op .
  10. Tik op .

Kleuren

Je kunt in de thema-instellingen verschillende kleurenschema's aanmaken en deze op verschillende secties in je webshop toepassen met een kleurenschemakiezer. Een kleurenschema is een set kleuren. Je thema heeft een set standaard kleurenschema's die je op elk moment kunt wijzigen in de themabewerker. Je kunt merkkleuren toevoegen voor een samenhangende toepassing van het kleurenpalet in je webshop.

Templates hebben geen individuele kleurinstellingen om ervoor te zorgen dat het ontwerp van je webshop overal op je website samenhangend is. Een template is eigenlijk een soort hoofdpagina of de hoofdcontent voor een winkel. Als je verschillende kleurenschema's in je winkel hebt, kan dat verwarrend werken voor klanten en kunnen ze je winkel verlaten zonder iets te kopen.

Je kunt tot 21 unieke kleurenschema's aanmaken en aanpassen en deze toepassen op verschillende secties in je webshop.

Kleurschema's

Kleurenschema's zijn een thema-instelling waarbij losse elementen en de bijbehorende kleuren op een visueel aantrekkelijke manier bij elkaar worden gegroepeerd. Je kunt verschillende kleuren toepassen op verschillende elementen in een samenhangend kleurenschema dat je kunt toepassen op het hele thema als er een kleurenschemakiezer beschikbaar is. Je kunt maximaal 21 kleurenschema's aanmaken. Je kunt ook van tevoren zien hoe je kleuren worden weergegeven in het voorbeeld van het schema.

Lijst met verschillende instellingen die je kunt toepassen op kleurschema's in de themabewerker.
InstellingenBeschrijving
AchtergrondDe kleur wordt toegepast op de achtergrond van sommige secties en op de achtergrond van de contourknop.
Kleurverloop achtergrondEen kleurverloop wordt toegepast op de achtergrond van een aantal secties. De achtergrond wordt waar mogelijk vervangen door kleurverlopen.
TekstDe kleur wordt toegepast op de sectie- of bloktekst.
Effen knopachtergrondDe kleur wordt toegepast op de achtergrond van de primaire knop.
Effen knoplabelDe kleur wordt toegepast op de tekst van de primaire knop.
Knop OmlijnenDe kleur wordt toegepast op de secundaire knoptekst en -rand.
SchaduwDe kleur wordt toegepast op de schaduwen.

Je kleurschema beheren

Het kleurenschema en de kleuropties van je winkel zijn ingesteld binnen je thema-instellingen. Gebruik de kleurenkiezer voor effen kleuren om een nieuwe kleur te selecteren of om de waarde van de kleur in het tekstveld in te voeren. De volgende kleurnamen en -waarden worden geaccepteerd in het kleurveld:

  • Kleurnamen zoals red, black of blue
  • RGB-kleurcodes.
  • Hexadecimale kleurwaarden.

Stappen:

  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Klik op Aanpassen naast het thema dat je wilt aanpassen.

  3. Klik op het pictogram Instellingen en klik vervolgens op Kleuren.

  4. Klik in de sectie Schema's op een bestaand schema of klik op Schema toevoegen om een nieuw kleurenschema toe te voegen.

  5. Klik op het kleurstaal voor de contenttype-kleur die je wilt wijzigen.

  6. Voer een hexadecimale kleurcode in of gebruik de kleurenkiezer om de kleur in te stellen. Verwijder de hex-code uit het tekstveld om de kleur in te stellen op transparant.

  7. Klik op Opslaan.

Je kleurenschema toepassen

Nadat je een kleurenschema hebt gedefinieerd bij de instellingen van het thema, kun je met de kleurenschemakiezer een kleurenschema toewijzen in de secties en blokken van je thema. De kleurenschemakiezer is alleen beschikbaar in bepaalde secties, blokken en algemene thema-instellingen.

Kleurenschemakiezer

Verlopen

In sommige thema's kun je voor een visueel interessante achtergrond een kleurverloop instellen. De instelling color_background wordt gebruikt om de achtergrondeigenschap van CSS aan te passen.

Met de kleurverloopkiezer kun je de kleuren, verloopstijl, hoek, positie en doorzichtigheid van het verloop selecteren. In de themabewerker wordt in realtime een voorbeeld weergegeven van de opties die je selecteert in de kleurverloopkiezer. Je kunt ook een kleurverloop achtergrond maken met behulp van CSS-code, die een validatiechecker bevat.

Kleurverloop instellen

  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Klik op Aanpassen naast het thema dat je wilt aanpassen.

  3. Klik op het pictogram Instellingen en klik vervolgens op Kleuren.

  4. Klik in de sectie Schema's op een bestaand schema dat je wilt bewerken.

  5. Klik op de optie kleurverloopstaal, zoals Achtergrondverloop.

  6. Als je nog nooit een kleurverloop hebt ingesteld, kun je kiezen uit enkele vooraf ingestelde opties. Selecteer een vooraf ingesteld verloop om het optiepaneel te openen.

  7. Selecteer je kleurverloopopties:

    • Kies tussen een lineair of een radiaal kleurverloop. Je kunt met de knoppen de gewenste kleurverloopstijl selecteren.
    • Stel de hoek van het kleurverloop in met de pijl omhoog en omlaag. Klik op de pijl omhoog of omlaag om het hoekpercentage telkens met vijf te verhogen of te verlagen.
    • Met de schuifregelaar selecteer je de Positie van het kleurverloop. Je kunt ook een numerieke waarde in het veld invoeren.
    • Voer een specifieke hex-kleurcode in of gebruik de kleurschuifregelaar om een tint te kiezen. Recent geselecteerde kleuren worden onder aan het paneel met verloopopties weergegeven.
    • Gebruik de schuifregelaar aan de rechterkant om de transparantie van het kleurverloop te selecteren als je het doorzichtig wilt maken. Je kunt ook een percentage invoeren in het veld naast de hex-kleurcode.
  8. Klik op Opslaan.

Kleurverloopkiezer in de themabewerker

Gebruik CSS om kleurverlopen in te stellen

De meeste CSS- background -eigenschappen kunnen worden gebruikt om een achtergrondkleur in te stellen. Je kunt dit veld gebruiken voor effen kleuren (bijvoorbeeld #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) en hsla(0, 0%, 0%, 1) produceren allemaal een effen zwarte achtergrond) of voor verlopen (bijvoorbeeld linear-gradient(red, green), radial-gradient(red, green) of conic-gradient(red, green)). Verlopen kunnen ook worden herhaald.

Stappen:

  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Klik op Aanpassen naast het thema dat je wilt aanpassen.

  3. Klik op het pictogram Instellingen en klik vervolgens op Kleuren.

  4. Klik in de sectie Schema's op een bestaand schema dat je wilt bewerken.

  5. Klik op het kleurverloop dat je wilt bewerken.

  6. Klik op de pijl naast Verloop en selecteer vervolgens CSS.

  7. Typ of plak je kleurverloopcode in het veld CSS-code. Je kleurverloop wordt dan in het voorbeeld van de themabewerker op de juiste locatie weergegeven.

  8. Klik op Opslaan.

Het Gradient CSS-codeveld in de themabewerker

Een kleurverloop verwijderen

  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Klik op Aanpassen naast het thema dat je wilt aanpassen.

  3. Klik op het pictogram Instellingen en klik vervolgens op Kleuren.

  4. Klik in de sectie Schema's op een bestaand schema dat je wilt bewerken.

  5. Klik op het kleurverloop dat je wilt verwijderen.

  6. Klik op Kleurverloop verwijderen.

  7. Klik op Opslaan.

Typografie

Je kunt de tekenstijl en -grootte voor de tekst in je webshop instellen. Je kunt een systeemlettertype of een aangepast lettertype kiezen.

Denk erover na om systeemlettertypen in je winkel te gebruiken, omdat deze al zijn geïnstalleerd op de computer van gebruikers. Als je systeemlettertypen gebruikt, hoeven klanten geen nieuwe lettertypen naar hun computer te downloaden, wat de laadsnelheid van je winkel kan vertragen. Het lettertype dat op de computer van de klant wordt weergegeven, is afhankelijk van hun besturingssysteem.

Je lettertypen aanpassen

Raadpleeg de lettertypenbibliotheek van Shopify voor een lijst met beschikbare lettertypen.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Typografie.

  5. Als je een ander lettertype voor de kop- of hoofdtekst van je winkel wil gebruiken, klik je op Wijzigen in de sectie Kopteksten of Hoofdtekst.

  6. Klik op de naam van het lettertype dat je wil gebruiken en daarna op Selecteren.

  7. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Typografie.

  7. Als je een ander lettertype voor de koptekst of de hoofdtekst van je winkel wil gebruiken, tik je op Wijzigen in de sectie Kopteksten of Hoofdtekst.

  8. Tik op de naam van het lettertype dat je wil gebruiken en daarna op Gereed.

  9. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Typografie.

  7. Als je een ander lettertype voor de koptekst of de hoofdtekst van je winkel wil gebruiken, tik je op Wijzigen in de sectie Kopteksten of Hoofdtekst.

  8. Tik op de naam van het lettertype dat je wil gebruiken en daarna op Gereed.

  9. Tik op .

De grootte van je lettertypen aanpassen

Je kunt de standaardgrootte van je lettertype voor je kop- en hoofdtekst instellen in de thema-instelling Typografie.

De minimale lettergrootte is 100% en de maximale lettergrootte is 150%. Elke schaalvergroting vergroot de lettergrootte met 5%. De standaard instelling is 100%.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Typografie.

  5. Als je de standaard lettergrootte voor Koptekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  6. Als je de standaard lettergrootte voor Hoofdtekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  7. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Typografie.

  7. Als je de standaard lettergrootte voor Koptekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  8. Als je de standaard lettergrootte voor Hoofdtekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  9. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Typografie.

  7. Als je de standaard lettergrootte voor Koptekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  8. Als je de standaard lettergrootte voor Hoofdtekst wil wijzigen, gebruik je de Schaal lettertypegrootte om de standaardgrootte te selecteren.

  9. Tik op .

Opmaak

Je kunt de maximale breedte instellen waarin je webshop wordt weergegeven en de verticale en horizontale ruimte tussen secties instellen.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Indeling.

  5. Schuif de schuifregelaar bij Paginabreedte naar een paginabreedte tussen 1000 en 1600 pixels. De standaardinstelling is 1600 px.

  6. Optioneel: Voeg verticale Ruimte tussen templatesecties op je pagina's toe met de schuifregelaar voor het bereik. Je kunt maximaal 100 px tussen secties toevoegen.

  7. Optioneel: Als je een Grid-indeling hebt, gebruik je de schuifregelaars voor Horizontale ruimte en Verticale ruimte om ruimte tussen de grid-content op je pagina's in te voegen. Als je horizontale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de rijen toegevoegd. Als je verticale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de kolommen toegevoegd.

  8. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Opmaak.

  7. Schuif de schuifregelaar bij Paginabreedte naar een paginabreedte tussen 1000 en 1600 pixels. De standaardinstelling is 1600 px.

  8. Optioneel: Voeg verticale Ruimte tussen templatesecties op je pagina's toe met de schuifregelaar voor het bereik. Je kunt maximaal 100 px tussen secties toevoegen.

  9. Optioneel: Als je een Grid-indeling hebt, gebruik je de schuifregelaars voor Horizontale ruimte en Verticale ruimte om ruimte tussen de grid-content op je pagina's in te voegen. Als je horizontale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de rijen toegevoegd. Als je verticale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de kolommen toegevoegd.

  10. Tik op Opslaan.

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Opmaak.

  7. Schuif de schuifregelaar bij Paginabreedte naar een paginabreedte tussen 1000 en 1600 pixels. De standaardinstelling is 1600 px.

  8. Optioneel: Voeg verticale Ruimte tussen templatesecties op je pagina's toe met de schuifregelaar voor het bereik. Je kunt maximaal 100 px tussen secties toevoegen.

  9. Optioneel: Als je een Grid-indeling hebt, gebruik je de schuifregelaars voor Horizontale ruimte en Verticale ruimte om ruimte tussen de grid-content op je pagina's in te voegen. Als je horizontale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de rijen toegevoegd. Als je verticale ruimte toevoegt, worden er maximaal 40 pixels aan ruimte aan de kolommen toegevoegd.

  10. Tik op .

Animaties

Met animaties kun je beweging en visuele interesse toevoegen aan je webshop. Je kunt een fade-inanimatie activeren die de secties van je winkel onthult bij het scrollen, en een effect voor kaarten en knoppen als je er met de muis over beweegt.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Animaties.

  5. Optioneel: Selecteer Secties onthullen bij het scrollen om een animatie te activeren die de secties van je webshop onthult bij het scrollen.

  6. Optioneel: Je kunt een animatie met zweef-effect aan je kaarten en knoppen toevoegen. Selecteer hiervoor een van de volgende opties onder de instelling Zweef-effect:

    • Verticale lift: wanneer een klant over een kaart of knop beweegt, schuift het element omhoog.
    • 3D-lift: wanneer een klant over een kaart of knop beweegt, schuift het element naar voren, waardoor het een 3D-effect krijgt. Er is ook een subtiele glans die over het element beweegt, wat het een extra dimensie geeft.
  7. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Animaties.

  7. Optioneel: Selecteer Secties onthullen bij het scrollen om een animatie te activeren die de secties van je webshop onthult bij het scrollen.

  8. Optioneel: Je kunt een animatie met zweef-effect aan je kaarten en knoppen toevoegen. Selecteer hiervoor een van de volgende opties onder de instelling Zweef-effect:

    • Verticale lift: wanneer een klant over een kaart of knop beweegt, schuift het element omhoog.
    • 3D-lift: wanneer een klant over een kaart of knop beweegt, schuift het element naar voren, waardoor het een 3D-effect krijgt. Er is ook een subtiele glans die over het element beweegt, wat het een extra dimensie geeft.
  9. Tik op Opslaan.

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Animaties.

  7. Optioneel: Selecteer Secties onthullen bij het scrollen om een animatie te activeren die de secties van je webshop onthult bij het scrollen.

  8. Optioneel: Je kunt een animatie met zweef-effect aan je kaarten en knoppen toevoegen. Selecteer hiervoor een van de volgende opties onder de instelling Zweef-effect:

    • Verticale lift: wanneer een klant over een kaart of knop beweegt, schuift het element omhoog.
    • 3D-lift: wanneer een klant over een kaart of knop beweegt, schuift het element naar voren, waardoor het een 3D-effect krijgt. Er is ook een subtiele glans die over het element beweegt, wat het een extra dimensie geeft.
  9. Tik op .

Aanpassingsinstellingen visuele elementen

Je kunt het uiterlijk van elementen van je thema, zoals knoppen, productkaarten en varianten, aanpassen via de pagina Thema-instellingen. Elke optie bevat de relevante instellingen voor dat element.

Je kunt instellingen aanpassen voor de volgende elementen van je thema:

  • Knoppen: knoppen zijn onder andere knoppen voor call to action in secties zoals een diavoorstelling of afbeelding met tekst, maar ook de knoppen in een contactformulier, op je productpagina's en winkelwagenpagina's.

  • Variantopties: met variantopties kun je de varianten van een product op een productpagina of een sectie voor uitgelichte producten weergeven. Klanten kunnen de gewenste variant selecteren om het product aan hun winkelwagen toe te voegen zonder van productpagina te wijzigen. Je kunt zelf instellen hoe de variantopties in je webshop worden weergegeven.

  • Invoervelden: Invoervelden bestaat uit interactieve onderdelen waar klanteninvoer wordt verwacht. Denk aan een hoeveelheidskiezer, een aanmeldingsformulier voor het ontvangen van e-mail of notities voor winkelwagens. Je kunt het uiterlijk van de invoervelden van je webshop aanpassen.

  • Met de instellingen voor productkaarten, collectiekaarten en blogkaarten kun je de stijl van elk type kaart aanpassen wanneer ze worden weergegeven in paginasecties. - productkaart: productkaarten geven informatie weer over je producten in gebieden van je thema waar meerdere producten worden weergegeven, zoals verzamelsjablonen, collectiesecties en zoekresultaten. - Collectiekaarten: collectiekaarten geven informatie weer over je collecties in delen van je thema die collecties vermelden, zoals een verzamellijstsjabloon of sectie. - Blogkaarten: blogkaarten tonen informatie over je blogposts in delen van je thema waar meerdere producten staan, zoals blogtemplates, blogsecties en zoekresultaten.

  • Content-containers: Containers worden gebruikt voor het tekstelement van contentsecties, zoals het tekstvak in een diavoorstelling, een afbeeldingsbanner of de kolommen in secties met meerdere kolommen. Je kunt het uiterlijk van content-containers voor je webshop aanpassen.

  • Media: Media bestaat uit het visuele onderdeel van secties. Denk aan productmedia of de afbeelding in Afbeelding met tekst-secties. Je kunt randen en schaduwen aan je media toevoegen.

  • Vervolgkeuzelijsten en pop-ups: je kunt het uiterlijk van vervolgkeuzemenu's, modale pop-upvensters en pop-ups voor winkelwagentjes in je webshop aanpassen.

  • Panelen: Panelen zijn verborgen, interactieve containers die worden weergegeven wanneer je erop tikt of klikt, zoals een uitklapbaar menu of opties voor collectiefilters. Je kunt de randen en schaduws van de panelen in je webshop aanpassen.

  • Badges: de badges Uitverkoop and Uitverkocht worden automatisch toegevoegd aan je productafbeeldingen wanneer je de prijs verlaagt of wanneer de voorraad 0 bereikt. Je kunt de positie, vorm en kleur van je badges Uitverkoop en Uitverkocht afzonderlijk aanpassen in je thema-instellingen. De badges Pagina en Blog worden weergegeven in relevante zoekresultaten. Je kunt de positie en vorm van deze badges aanpassen, maar je kunt de kleur van de badges Pagina en Blog niet veranderen.

  • Merkgegevens: Je kunt informatie over je merk opnemen in je webshop. Voer eerst de volgende stappen uit en voeg daarna het blok Merkinformatie toe aan de voettekst van je webshop.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Klik op Aanpassen naast het thema dat je wilt bewerken.

  3. Klik op het pictogram Instellingen.

  4. Klik op een element om de instellingen te openen.

  5. Pas een van de beschikbare instellingen aan. Je kunt de wijzigingen bekijken door naar verschillende gebieden van je thema te navigeren in het voorbeeldvenster.

  6. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Aanpassen naast het thema dat je wil bewerken.

  4. Tik op het pictogram Instellingen.

  5. Tik5 op een element om de instellingen te openen.

  6. Pas een van de beschikbare instellingen aan. Je kunt de wijzigingen bekijken door naar verschillende gebieden van je thema te navigeren in het voorbeeldvenster.

  7. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Aanpassen naast het thema dat je wil bewerken.

  4. Tik op het pictogram Instellingen.

  5. Tik5 op een element om de instellingen te openen.

  6. Pas een van de beschikbare instellingen aan. Je kunt de wijzigingen bekijken door naar verschillende gebieden van je thema te navigeren in het voorbeeldvenster.

  7. Tik op .

Social media

Je kunt links naar je socialmedia-accounts toevoegen die worden weergegeven in de voettekst van je webshop.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Social media.

  5. Als je links naar je socialmedia-accounts wil toevoegen, typ je de webadressen voor je accounts in de desbetreffende velden voor Socialmedia-accounts. Voer volledige links in, zoals https://instagram.com/shopify of https://tiktok.com/@shopify.

  6. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Social media.

  7. Als je links naar je socialmedia-accounts wil toevoegen, typ je de webadressen voor je accounts in de desbetreffende velden voor Socialmedia-accounts. Voer volledige links in, zoals https://instagram.com/shopify of https://tiktok.com/@shopify.

  8. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Social media.

  7. Als je links naar je socialmedia-accounts wil toevoegen, typ je de webadressen voor je accounts in de desbetreffende velden voor Socialmedia-accounts. Voer volledige links in, zoals https://instagram.com/shopify of https://tiktok.com/@shopify.

  8. Tik op .

Zoekgedrag

Je webshop bevat voorspellende zoekopdrachten, waarbij suggesties worden weergegeven wanneer klanten in het zoekveld beginnen te typen. Met zoeksuggesties kunnen klanten hun zoekopdrachten formuleren en verfijnen en nieuwe manieren ontdekken om je webshop te verkennen. Klanten kunnen ook door zoeksuggesties bladeren om overeenkomsten te vinden zonder de huidige pagina te verlaten om een afzonderlijke lijst met zoekresultaten te bekijken.

Raadpleeg voorspelbaar zoeken voor meer informatie over het werken met zoeksuggesties.

Je kunt de manier waarop je klanten zoeksuggesties te zien krijgen aanpassen.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Zoekgedrag.

  5. Als je zoeksuggesties wil activeren of deactiveren, vink je Zoeksuggesties inschakelen aan of uit.

  6. Optioneel: Vink de optie Productverkoper weergeven aan of uit om de productverkoper in de zoeksuggesties te laten weergeven of verbergen.

  7. Optioneel: Als je de productprijs in zoeksuggesties wil weergeven of verbergen, vink je Productprijs weergeven aan of uit.

  8. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Zoekgedrag.

  7. Als je zoeksuggesties wil activeren of deactiveren, vink je Zoeksuggesties inschakelen aan of uit.

  8. Optioneel: Vink de optie Productverkoper weergeven aan of uit om de productverkoper in de zoeksuggesties te laten weergeven of verbergen.

  9. Optioneel: Als je de productprijs in zoeksuggesties wil weergeven of verbergen, vink je Productprijs weergeven aan of uit.

  10. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Zoekgedrag.

  7. Als je zoeksuggesties wil activeren of deactiveren, vink je Zoeksuggesties inschakelen aan of uit.

  8. Optioneel: Vink de optie Productverkoper weergeven aan of uit om de productverkoper in de zoeksuggesties te laten weergeven of verbergen.

  9. Optioneel: Als je de productprijs in zoeksuggesties wil weergeven of verbergen, vink je Productprijs weergeven aan of uit.

  10. Tik op .

Valuta-indeling

Je kunt de valutacode bij de prijzen op je producten weergeven.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Valuta-indeling.

  5. Als je valutacodes wil weergeven, selecteer je Valutacodes weergeven.

  6. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Valutanotatie.

  7. Als je valutacodes wil weergeven, selecteer je Valutacodes weergeven.

  8. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Valutanotatie.

  7. Als je valutacodes wil weergeven, selecteer je Valutacodes weergeven.

  8. Tik op .

Winkelwagen

Je kunt de stijl van de winkelwagen in je webshop wijzigen. Wanneer een klant een product uit je winkel aan de winkelwagen toevoegt, kan deze worden weergegeven als een lade, een pagina of een pop-upmelding. Gebruik de optie voor een lade of pop-upmelding om de klant op de productpagina te houden. Gebruik de optie voor een pagina om de klant naar de winkelwagenpagina te sturen. Wanneer de winkelwagen van de klant leeg is, kun je een uitgelichte collectie weergeven in de winkelwagenoptie.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Winkelwagen.

  5. Via de vervolgkeuzelijst Type winkelwagen kun je de winkelwagenstijl Lade, Pagina of Pop-upmelding selecteren.

  6. Optioneel: Selecteer Verkoper weergeven om de verkopers van de artikelen in de winkelwagen van een klant weer te geven.

  7. Optioneel: Je kunt klanten een tekstvak aanbieden waarin ze speciale verzoeken kunnen invoeren of extra informatie bij een bestelling kunnen toevoegen. Selecteer dan Notitie voor winkelwagen inschakelen.

  8. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je een collectie weergeven in de winkelwagenoptie wanneer deze leeg is:

    1. Klik bij Winkelwagenoptie op Collectie selecteren.
    2. Klik op de naam van de collectie die je wil weergeven en klik op Selecteren.
  9. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je het kleurschema van de winkelwagenoptie wijzigen. Voer de volgende stappen uit:

    1. Klik in het onderdeel Winkelwagenoptie > Kleurschema op Wijzigen.
    2. Selecteer een kleurschema dat je wil gebruiken voor je winkelwagenoptie.
  10. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Winkelwagen.

  7. Selecteer het gewenste Type winkelwagen uit de opties Lade, Pagina of Pop-upmelding.

  8. Optioneel: Selecteer Verkoper weergeven om de verkopers van de artikelen in de winkelwagen van een klant weer te geven.

  9. Optioneel: Je kunt klanten een tekstvak aanbieden waarin ze speciale verzoeken kunnen invoeren of extra informatie bij een bestelling kunnen toevoegen. Selecteer dan Notitie voor winkelwagen inschakelen.

  10. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je een collectie weergeven in de winkelwagenoptie wanneer deze leeg is:

    1. Tik in het onderdeel Winkelwagenoptie op Collectie selecteren.
    2. Tik op de naam van de collectie die je wil weergeven en tik op Gereed.
  11. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je het kleurschema van de winkelwagenoptie wijzigen. Voer de volgende stappen uit:

    1. Tik bij Winkelwagenoptie > Kleurschema op Wijzigen.
    2. Selecteer een kleurschema dat je wil gebruiken voor de winkelwagenoptie en tik op Gereed.
  12. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Winkelwagen.

  7. Selecteer het gewenste Type winkelwagen uit de opties Lade, Pagina of Pop-upmelding.

  8. Optioneel: Selecteer Verkoper weergeven om de verkopers van de artikelen in de winkelwagen van een klant weer te geven.

  9. Optioneel: Je kunt klanten een tekstvak aanbieden waarin ze speciale verzoeken kunnen invoeren of extra informatie bij een bestelling kunnen toevoegen. Selecteer dan Notitie voor winkelwagen inschakelen.

  10. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je een collectie weergeven in de winkelwagenoptie wanneer deze leeg is:

    1. Tik in het onderdeel Winkelwagenoptie op Collectie selecteren.
    2. Tik op de naam van de collectie die je wil weergeven en tik op Gereed.
  11. Optioneel: Als je Lade selecteert als Type winkelwagen, kun je het kleurschema van de winkelwagenoptie wijzigen. Voer de volgende stappen uit:

    1. Tik bij Winkelwagenoptie > Kleurschema op Wijzigen.
    2. Selecteer een kleurschema dat je wil gebruiken voor de winkelwagenoptie en tik op Gereed.
  12. Tik op .

Aangepaste CSS

In de sectie Aangepaste CSS kun je je eigen CSS-code invoeren, bijvoorbeeld als je het uiterlijk van de knoppen van je webshop volgens andere dan de beschikbare standaardinstellingen wil aanpassen of als je bepaalde tekstelementen je eigen unieke stijl wil geven.

Aangepaste CSS in de thema-instellingen geldt voor alle pagina's in je webshop, behalve de checkout.

Meer informatie over het toevoegen van aangepaste CSS aan je thema.

Themastijl

Een themastijl is een collectie van instellingen gekozen door een thema-ontwerper. Je kunt een themastijl toepassen op je winkel om het een afgewerkte look-and-feel te geven. Op alle thema's is standaard een themastijl toegepast. Welke andere opties voor de themastijl beschikbaar zijn, hangt af van het thema dat je gebruikt.

Wanneer je een thema aanpast, vervang je de instellingen voor de themastijl door je eigen thema. Wanneer je een themastijl toevoegt aan je thema, verander je je huidige instellingen, zoals kleuren en de vormgeving van je teksten.

Stappen:

Desktop
  1. Ga in het Shopify-beheercentrum naar webshop > Thema's.

  2. Zoek het thema dat je wilt bewerken en klik vervolgens op Aanpassen.

  3. Klik op het pictogram Thema-instellingen instellingen.

  4. Klik op Themastijl.

  5. Selecteer de themastijl die je wil gebruiken en klik op Stijl wijzigen.

  6. Klik op Opslaan.

iPhone
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op en daarna op Thema-instellingen.

  6. Tik op Themastijl.

  7. Selecteer de themastijl die je wilt gebruiken en tik op Gereed.

  8. Tik op .

Android
  1. Tik in de Shopify-app op het pictogram Menu.

  2. Tik in de sectie Verkoopkanalen op webshop.

  3. Tik op Alle thema's beheren.

  4. Zoek het thema dat je wilt bewerken en tik vervolgens op Aanpassen.

  5. Tik op ... en daarna op Thema-instellingen.

  6. Tik op Themastijl.

  7. Selecteer de themastijl die je wilt gebruiken en tik op Gereed.

  8. Tik op .

Zat het antwoord dat je zocht er niet bij? Wij helpen je graag verder.