> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 📍 Hoe een aangepaste positie voor de valutaomvormer instellen

> ℹ️ **Note:** Dit artikel is automatisch vertaald met behulp van AI en kan onjuistheden bevatten. Als er iets mis is, neem dan contact op met ons ondersteuningsteam.

Met de functie Custom Position kunt u de Currency Converter precies plaatsen waar u het wilt op uw storefront.

In plaats van het gebruik van de standaard drijvende of header posities, kunt u de Currency Converter aan een specifiek element in uw Shopify thema met een CSS selector.

Dit geeft u meer flexibiliteit en helpt de Currency Converter te mengen natuurlijk in het ontwerp van uw winkel. 🎯

---

# **⚠️ Voordat u begint**

Controleer voordat u een aangepaste positie instelt:

*   Hoppy Currency Converter is geïnstalleerd en geconfigureerd
*   Het insluiten van de App is ingeschakeld
*   Aan boord is voltooid
*   Je weet waar je zou willen dat de valuta Converter te verschijnen

💡 Gemeenschappelijke locaties omvatten navigatiebalken, headers, zijbalken, utility menu's, en aangepaste storefront secties.

---

# **✅ Stap 1: Weergaveinstellingen openen**

Open de **Hoppy Currency Converter** app van uw Shopify Admin.

Dan:

→ Naar **Instellingen**

→ Klik **Beeldscherm**

Zoek:

*   Bureaubladpositie
*   Mobiele positie

U kunt een aangepaste positie apart instellen voor desktop- en mobiele apparaten.

---

# **✅ Stap 2: Selecteer aangepaste positie**

Onder **Positiestijl**, zie je de beschikbare plaatsing opties.

### **Beschikbare positiestijlen**

#### **Zwevend**

Toont de valuta Converter als een drijvende widget op de storefront.

---

#### **Kop**

Plaatst de valuta converter in de winkel header.

---

#### **Eigen positie**

Plaatst de Currency Converter in een specifiek element geselecteerd door u.

Selecteer:

→ **Eigen positie**

Eenmaal geselecteerd, worden extra instellingen automatisch beschikbaar.

---

# **✅ Stap 3: Voer het doelelement in**

Binnen de **Aangepast element** veld, voer de CSS-selector in van het element waar de valutaomvormer moet verschijnen.

### **Ondersteunde selectietypes**

#### **Klasseselectie**

Begint met een periode (`.`)

### **Voorbeeld**

`.header-actions`

---

#### **ID-selectie**

Begint met een hash (`#`)

### **Voorbeeld**

`#currency-wrapper`

---

#### **Elementselectie**

Gebruikt de HTML-elementnaam direct.

### **Voorbeeld**

`header`

---

# **🔍 Een selectie zoeken**

Als u niet zeker weet welke selector u moet gebruiken:

1.  Open je winkel.
2.  Klik met de rechtermuisknop op het gebied waar u de valuta converter wilt.
3.  Klik **Controleren**.
4.  Zoek het HTML-element.
5.  Rechtsklik op het element.
6.  Selecteren **Kopiëren → Kopiëren-selector**.
7.  Plak de gekopieerde selectie in de **Aangepast element** veld.

### **Voorbeeld**

`#block-template--166120#######__banner_bckcpm-video_CLEttT > div.media-with-text__content.rounded.text-custom > div > a`

⚠️ Vermijd tijdelijk gebruik Shopify\-gegenereerde ID's, aangezien deze kunnen veranderen na thema-updates.

Waar mogelijk wordt het gebruik van stabiele klassenamen aanbevolen.

---

# **✅ Stap 4: Plaatsing kiezen**

Na het invoeren van de selectie, kies hoe de valuta Converter moet worden ingevoegd ten opzichte van dat element.

### **Beschikbare plaatsingsopties**

---

## **Voor**

Plaatst de Currency Converter onmiddellijk voor het geselecteerde element.

### **Voorbeeld**

Als het gericht is op een karpictogram:

→ De Valuta Converter lijkt aan de linkerkant van de winkelwagen pictogram.

---

## **Na**

Plaatst de Currency Converter onmiddellijk na het geselecteerde element.

### **Voorbeeld**

Indien gericht op een logo:

→ De Currency Converter lijkt rechts van het logo.

---

## **Voegen**

Plaatst de Currency Converter in het geselecteerde element, aan het einde.

### **Voorbeeld**

Bij het richten op een navigatiecontainer:

→ De valuta Converter verschijnt na alle bestaande navigatie-items.

💡 Dit is vaak de beste startoptie voor de meeste thema's.

---

## **Prepend**

Plaatst de Currency Converter in het geselecteerde element, aan het begin.

### **Voorbeeld**

Bij het richten op een navigatiecontainer:

→ De Valuta Converter verschijnt voor alle bestaande navigatie-items.

---

# **✅ Stap 5: Uw wijzigingen opslaan**

Zodra de keuze- en plaatsingsoptie is ingesteld:

→ Klik **Opslaan**

De Currency Converter zal nu proberen te renderen in de geselecteerde locatie.

---

# **✅ Stap 6: Controleer de plaatsing**

Bezoek uw winkel en bevestig dat de valuta Converter verschijnt op de gewenste locatie.

Indien niet blijkt:

*   Controleer of de selectie juist is
*   Bevestig het element bestaat op de pagina
*   Probeer een andere plaatsingsoptie
*   Pagina vernieuwen

💡 Een harde verfrissen is vaak nuttig na het maken van plaatsing wijzigingen.

---

# **🛠️ Alternatieve methode: handmatige plaatsing**

Als het gebruik van een CSS selector is niet geschikt voor uw thema, kunt u handmatig plaats de valuta Converter met behulp van de code knipsel.

Deze methode is nuttig wanneer:

*   U wilt volledige controle over waar de valuta Converter verschijnt.
*   Uw thema bevat geen geschikt element om te richten met **Eigen positie**.
*   Je bent comfortabel het maken van kleine thema aanpassingen.

### **Stap 1: Kopieer de Valuta Converter Code Snippet**

Open de **Hoppy Currency Converter** app van uw Shopify Admin.

Dan:

→ Naar **Geavanceerd**

Zoeken:

→ **Valuta Converter Box Plaatsing**

Kopieer de meegeleverde code knipsel van onze app of hieronder:

`<div class="futureblink-currency-box"></div>`

Dit is het knipsel dat u plaatst waar u wilt dat de valuta Converter te verschijnen.

---

### **Stap 2: Voeg het Snippet toe aan uw thema**

#### **Optie A: Gebruik van een aangepaste vloeistofblok**

Van de Shopify Thema-editor:

→ Navigeer naar de sectie waar u wilt dat de valuta Converter te verschijnen.

→ Klik op de **➕ Blok toevoegen** Button.

→ Zoek en voeg een **Aangepast vloeibaar** Blok.

→ Plak de Valuta Converter Code Snippet in de Custom Liquid blok.

→ Klik **Opslaan**.

---

#### **Optie B: Themabestanden bewerken**

Voor geavanceerde storefront aanpassing, kunt u ook dezelfde code knipsel direct aan uw Shopify themabestanden.

Ga naar:

**Online Store → Thema's**

→ Klik op de **Wat?** menu naast **Thema bewerken**

→ selecteren **Code bewerken**

Zoek de juiste `.liquid` bestand voor de sectie waar u wilt dat de valuta Converter verschijnen, plak dan de valuta Converter Code Snippet op de gewenste locatie.

⚠️ **Belangrijk:**

Deze methode is bedoeld voor handelaren comfortabel bewerken Shopify themacode. Wij raden het dupliceren van uw thema voor het maken van wijzigingen, omdat onjuiste wijzigingen van invloed kunnen zijn op uw storefront layout of functionaliteit.

---

### **Selectie moet bestaan op de pagina**

Als het geselecteerde element alleen bestaat op bepaalde pagina's, zal de Currency Converter alleen op die pagina's verschijnen.

Het gebruik van globale header of navigatie selectoren biedt meestal de beste resultaten.

---

### **Verborgen elementen De converter verbergen**

Als het geselecteerde element wordt verborgen door het thema op bepaalde apparaten, zal de Valuta Converter ook worden verborgen.

Test altijd zowel desktop als mobiele lay-outs.

---

### **Je kunt altijd terug wisselen**

Indien aangepaste positie niet langer nodig is:

→ Terug naar **Instellingen tonen**

→ Wijziging **Positiestijl** terug naar:

*   Zwevend
*   Kop

Er is geen extra configuratie vereist.

---

# **🎉 Eindresultaat**

Eenmaal succesvol geconfigureerd:

✅ De valuta converter verschijnt precies waar u het wilt

✅ Bureaublad en mobiele lay-outs kunnen verschillende plaatsingen gebruiken

✅ Het widget past natuurlijk in uw storefront ontwerp

✅ Plaatsing kan worden aangepast zonder het bewerken van themabestanden

✅ Geavanceerde handelaren kunnen de converter handmatig plaatsen met behulp van Custom Liquid of Thema bestanden voor volledige controle

Met behulp van Custom Position helpt het creëren van een meer naadloze en professionele storefront ervaring, terwijl het houden van de Currency Converter gemakkelijk toegankelijk voor shoppers. 🎯