Een maattabel in een pop-up toevoegen aan je productpagina's
Metavelden helpen je om de functionaliteit en het uiterlijk van de Shopify-winkel aanpassen door je gespecialiseerde informatie op te laten slaan die gewoonlijk niet wordt vastgelegd in het Shopify-beheercentrum. Je kunt metavelden intern gebruiken in het Shopify-beheercentrum en je kunt er ook voor kiezen om ze weer te geven in de webshop.
Met metavelden kun je een paginareferentie toevoegen aan een pop-upblok met een link op je productpagina's. Wanneer er op de link wordt geklikt, verschijnt een pop-up die de content van je pagina laat zien. Je kunt afbeeldingen en andere media toevoegen met behulp van de RTF-editor voor je pagina's.
Hieronder zie je enkele voorbeelden van pop-upinformatie die je aan je productpagina's kunt toevoegen:
- Maattabellen
- Verzorgingsinstructies
- Montage-instructies
- Productspecificaties
- Veelgestelde vragen
Dit is een tutorial in vier stappen waarin je kennismaakt met metavelden die naar pagina's verwijzen, waarin je een productmetaveld voor een paginaverwijzing en een template voor een productpagina voor je webshop maakt, een nieuwe pagina toevoegt en de template voor de productpagina op specifieke producten toepast. Je kunt deze tutorial gebruiken om elke gewenste content in de pop-up te maken. In deze hele tutorial wordt het voorbeeld van de maattabel gebruikt.
Voor deze tutorial heb je een Online Store 2.0-thema noldig. Als je een vintage thema gebruikt of als je metaveldtypen wil toevoegen die niet worden ondersteund door het thema, kun je de themacode bewerken of een Shopify-partner inhuren om je te helpen.
Op deze pagina
Stap 1: Een productmetaveld aanmaken voor een pagina
Maak eerst een metavelddefinitie voor de paginareferentie voor je productpagina's. Het productmetaveld heeft een link naar een specifieke pagina en kan voor elk product worden aangepast. Als je geen paginareferentie toevoegt aan een product dat dezelfde template gebruikt, wordt de tekst van de pop-uplink nog steeds weergegeven alsof er content is. Om de pop-uplink alleen voor specifieke producten weer te geven, kun je een producttemplate aanmaken en die alleen toepassen op relevante producten.
Met de metavelden paginareferentie kun je verschillende productgegevens weergeven door verschillende pagina's voor verschillende soorten producten te maken. Je kunt bijvoorbeeld twee verschillende maattabelpagina's maken voor twee verschillende leeftijdsgroepen, zoals een maattabel voor peuters en een maattabel voor baby's, en vervolgens kun je de paginareferentie voor peutermaten alleen toevoegen aan producten die bestemd zijn voor peuters.
Je moet een metavelddefinitie maken voor een paginareferentie om deze te verbinden met het pop-upblok in je themabewerker. Webshoptoegang is standaard geselecteerd als je je metavelddefinitie aanmaakt.
Stappen:
Desktop
Ga vanuit het Shopify-beheercentrum naar Instellingen > Aangepaste gegevens.
Klik in de sectie Metavelddefinities op Producten.
Klik op Definitie toevoegen.
Voer Maattabel in het veld Naam in.
Klik op ⊕ Type selecteren.
Selecteer Pagina in het vervolgkeuzemenu. Eén pagina is standaard geselecteerd.
Klik op Opslaan.
iPhone
- Tik in de Shopify-app op ... > Instellingen.
- Tik op Aangepaste gegevens.
- Tik in de sectie Metavelddefinities op Producten.
- Tik op +.
- Voer Maattabel in het veld Naam in.
- Tik op + Type selecteren.
- Tik om Pagina te selecteren in de vervolgkeuzelijst. Eén pagina is standaard geselecteerd.
- Tik op Opslaan.
Android
- Tik in de Shopify-app op ☰ > Instellingen.
- Tik op Aangepaste gegevens.
- Tik in de sectie Metavelddefinities op Producten.
- Tik op +.
- Voer Maattabel in het veld Naam in.
- Tik op + Type selecteren.
- Tik om Pagina te selecteren in de vervolgkeuzelijst. Eén pagina is standaard geselecteerd.
- Tik op ✓ om op te slaan.
Stap 2: Een template aanmaken voor je productpagina
Voor deze tutorial heb je een Online Store 2.0-thema noldig. Als je een vintage thema gebruikt of als je metaveldtypen wil toevoegen die niet worden ondersteund door het thema, kun je de themacode bewerken of een Shopify-partner inhuren om je te helpen.
Nadat je een sectie of blok hebt toegevoegd, kun je een metaveld selecteren door op het pictogram van de dynamische bron te klikken:
Maak een nieuwe template voor de productpagina als je de pop-uplink voor de maattabel niet aan al je producten wil toevoegen. In de stappen maak je een nieuwe template voor de productpagina, maar je kunt ook een bestaande template voor de productpagina kiezen om in plaats daarvan aan te passen.
Stappen:
Desktop
- Ga in het Shopify-beheercentrum naar Webshop > Thema's.
- Klik op Aanpassen naast het thema dat je wilt aanpassen.
- Klik in de vervolgkeuzelijst Homepage bovenaan de editor op Producten en dan op ⊕ Template aanmaken om een nieuwe template aan te maken en aan te passen.
- Ga in de navigatiezijbalk Secties naar de blokken Template > Productgegevens en klik dan op ⊕ Blok toevoegen
- Klik op Pop-up.
- Voer Maattabel in het veld Link-label in. Dit is de tekst die laat zien waar een klant op klikt voor de pop-uppagina-content.
- Klik naast Pagina op het pictogram voor dynamische bron en klik vervolgens om het metaveld paginareferentie dat je hebt gemaakt te selecteren.
- Klik op Opslaan.
iPhone
- Tik in de Shopify-app op ... > Webshop.
- Tik op Alle thema's beheren.
- Tik op Aanpassen naast het thema dat je wil aanpassen.
- Tik in het vervolgkeuzelijst Homepage bovenaan de editor op Producten en vervolgens op ⊕ Template aanmaken om een nieuwe template te maken en aan te passen.
- Ga in de navigatiezijbalk Secties naar de blokken Template > Productgegevens en tik dan op ⊕ Blok toevoegen
- Tik op Pop-up.
- Voer Maattabel in het veld Link-label in. Dit is de tekst die laat zien waar een klant op klikt voor de pop-uppagina-content.
- Tik naast Pagina op het pictogram voor dynamische bron, en tik vervolgens om het metaveld paginareferentie dat je hebt aangemaakt te selecteren.
- Tik op Opslaan.
Android
- Tik in de Shopify-app op ☰ > Webshop.
- Tik op Alle thema's beheren.
- Tik op Aanpassen naast het thema dat je wil aanpassen.
- Tik in het vervolgkeuzelijst Homepage bovenaan de editor op Producten en vervolgens op ⊕ Template aanmaken om een nieuwe template te maken en aan te passen.
- Ga in de navigatiezijbalk Secties naar de blokken Template > Productgegevens en tik dan op ⊕ Blok toevoegen
- Tik op Pop-up.
- Voer Maattabel in het veld Link-label in. Dit is de tekst die laat zien waar een klant op klikt voor de pop-uppagina-content.
- Tik naast Pagina op het pictogram voor dynamische bron, en tik vervolgens om het metaveld paginareferentie dat je hebt aangemaakt te selecteren.
- Tik op ✓ om je thema op te slaan.
Stap 3: Een pagina met je maattabel toevoegen
Maak een pagina met de content voor de maattabel waarnaar het metaveld verwijst. Als je al een pagina hebt gemaakt, kun je verder met stap 4.
Stappen:
Desktop
- Ga in het Shopify-beheercentrum naar Webshop > Pagina's.
- Klik op Pagina toevoegen.
- Voer Maattabel in het veld Titel in en voeg de maattabelgegevens bij Content toe.
- Stel in de sectie Zichtbaarheid de pagina in als Zichtbaar.
- Klik op Opslaan.
iPhone
- Tik in de Shopify-app op ... > Webshop.
- Tik op Pagina's.
- Tik op Pagina toevoegen.
- Voer Maattabel in het veld Titel in en voeg de maattabelgegevens bij Content toe.
- Stel in de sectie Zichtbaarheid de pagina in als Zichtbaar.
- Tik op Opslaan.
Android
- Tik in de Shopify-app op ☰ > Webshop.
- Tik op Pagina's.
- Tik op Pagina toevoegen.
- Voer Maattabel in het veld Titel in en voeg de maattabelgegevens bij Content toe.
- Stel in de sectie Zichtbaarheid de pagina in als Zichtbaar.
- Tik op ✓ om op te slaan.
Je kunt in het metaveld zoveel maattabelpagina's maken als je nodig hebt om naar te verwijzen. Je kunt echter maar één link naar de pagina in het productmetaveld zetten.
Stap 4: De pagina refereren en de producttemplate toepassen op specifieke producten
Wanneer je een paginaverwijzing aan een specifiek product toevoegt, wordt de informatie op die pagina alleen met dat product weergegeven. Als je de paginaverwijzing leeg laat voor een product dat die producttemplate gebruikt, wordt de linktekst nog steeds als een link weergegeven. De pop-up is echter leeg en heeft geen paginaverwijzing, wat verwarring kan veroorzaken voor je klanten. Je kunt een andere template voor productpagina's gebruiken voor specifieke producttypen met een maattabel, zoals kleding of schoenen, en een producttemplate voor andere producttypen, zoals speelgoed of sieraden en andere accessoires.
Meer informatie over templates.
Stappen:
Desktop
- Ga vanaf je Shopify-beheercentrum naar Producten.
- Klik op het product waar je een paginareferentie aan toe wil voegen.
- Klik in de sectie Productmetavelden op de paginaverwijzing Maattabel, klik daarna op Pagina's selecteren en selecteer de pagina Maattabel.
- Selecteer in de sectie Thema-template de template voor de productpagina Maattabel die je in stap 2 hebt gemaakt.
- Klik op Opslaan.
iPhone
- Ga vanuit de Shopify-app naar Producten > Alle producten.
- Tik op het product waar je een paginareferentie aan toe wil voegen.
- Tik in de sectie Productmetavelden op de paginaverwijzing Maattabel, tik daarna op Pagina's selecteren en selecteer de pagina Maattabel.
- Selecteer in de sectie Thema-template de template voor de productpagina Maattabel die je in stap 2 hebt gemaakt.
- Tik op Opslaan.
Android
- Ga vanuit de Shopify-app naar Producten > Alle producten.
- Tik op het product waar je een paginareferentie aan toe wil voegen.
- Tik in de sectie Productmetavelden op de paginaverwijzing Maattabel, tik daarna op Pagina's selecteren en selecteer de pagina Maattabel.
- Selecteer in de sectie Thema-template de template voor de productpagina Maattabel die je in stap 2 hebt gemaakt.
- Tik op ✓ om op te slaan.
Je kunt deze stappen voor zoveel producten herhalen als je nodig hebt.