Indstillinger

Generelt #

Website Elements gør det nemt at arbejde med Elements til Recommendations og Elements til Search results.

Designs er gemt hos Clerk.io, og du skal kun indsætte en lille embed code på den side, hvor du vil vise produkter. Dette kan gøres ved at bruge sektionen Embedded Code eller sektionen Injection.

Ethvert antal Element-blokke kan baseres på et enkelt Design, eller du kan oprette separate Designs til hver Element.

Du kan se dine eksisterende Elements, og oprette nye, ved at klikke på Search/Recommendations og derefter Element i sidemenuen:

Hver unik Element-blok styres af sine egne indstillinger. Du kan vælge et unikt navn til alle Element-blokke, som også fungerer som dens tracking label.

Hver Element-bloks Settings-side er opdelt i fire sektioner, som du får adgang til ved at klikke på Edit Element.

Navngiv dit element #

Styrer Name og tracking Labels for Element-blokken.

Vælg produktlogik #

Definerer hvilken type produkter, der skal vises i Elementet.

Du kan også styre, om der skal anvendes Filters, hvis du for eksempel kun vil vise produkter over eller under en bestemt pris, eller fra et specifikt brand.

Vælg design #

Dette lader dig vælge, hvor mange produkter der skal vises, og hvilket Design Elementet skal baseres på. Hvis du har en title/headline variabel i dit design, kan du tilføje de titler, der skal vises for Elementet her.

Indsæt på website #

Element-blokke er tilknyttet en embedcode, som gør det muligt at gengive dem på alle sider, hvor du har indsat Clerk.js. Du kan enten blot indsætte embedcode hvor du vil have dette Element vist, eller bruge vores injection-funktion.

Bemærk, at embed codes kan kræve variabler som product IDs, category IDs eller email, afhængigt af logikken.

Brug af embedded code #

Embed code er et lille kodeudsnit, som du kan indsætte på dit website. Det kan findes ved at vælge Using embedded code:

Brug af injection #

Injection er en funktion, der gør det muligt at indsætte element-blokke på dit website uden at tilføje embed code manuelt. Det gøres ved at vælge Using injection:

Herunder er en beskrivelse af de forskellige injection-muligheder:

Flere IDs #

For Product ID CSS selector kan du målrette flere elementer med samme selector.

Hvis selector matcher flere product IDs, samler Clerk alle matchende værdier og samler dem til én liste.

Dette er nyttigt på sider som kurve, hvor hver linje indeholder et produkt ID-element.

<input class="product-id" value="123">
<input class="product-id" value="456">
<input class="product-id" value="789">

Med selector .product-id læser Clerk alle ovenstående værdier som én produkt ID-liste.

Læsning af IDs fra Clerk.js context #

Når en logik kræver et produkt-, kategori- eller side-ID, kan injection-funktionen læse det direkte fra Clerk('context', {...})-kaldet, som Clerk.js bruger til tracking.

I stedet for at pege på en CSS selector eller attribut på siden, vælg Clerk.js context fra Read ID from dropdown. Clerk.io vil derefter bruge den værdi, der er sat for den ID-type i context på den aktuelle side.

Dette er den simpleste mulighed, når platformen allerede automatisk sætter context — ingen ekstra konfiguration nødvendig på selve siden.

Platforme med context indbygget i extension #

Følgende platforme sætter Clerk.js context automatisk som en del af deres officielle Clerk.io extension eller plugin:

• Magento 1
• Magento 2
• WooCommerce
• PrestaShop
• Shopware 6

Platforme med context i det manuelle Clerk.js script #

Følgende platforme inkluderer Clerk('context', {...})-kaldet i deres standard Clerk.js tracking-script, som tilføjes manuelt under opsætning:

• Shopify
• Dandomain
• Lightspeed
• SmartWeb
• ScanNet
• BigCommerce

Hvis din platform ikke er på listen ovenfor, kan du stadig bruge denne funktion ved manuelt at tilføje Clerk('context', {...})-kaldet til dit Clerk.js tracking-script. Se Clerk.js guide for detaljer.

Headlines #

Håndtering af headlines er nemt med standardopsætningen i Element.

På Edit Element-siden, klik på Select Design for at se input-feltet Headline:

Skift teksten i Headline-boksen og klik Save.

Ændringen vises straks, når du opdaterer din webshop.

Dynamiske tekstfelt-tags #

Vores standard designs bruger tags til at sætte forskellige headlines for hvert Element.

Disse tags kan bruges i alle tekstfelter i Design Editor-designs, og hvor som helst i code designs.

Tags har syntaksen {{ variable }} og kan have et vilkårligt navn.

Start med at gå til Designs og klik Edit Design på det, du vil ændre:

På Edit Design-siden, indsæt et headline-tag med {{ headline }} i HTML Section:

Klik Save & Close og du kan nu skrive en Headline fra din Element-fane.

Du kan tilføje lige så mange tekstfelter, du vil, Headline er blot et eksempel.

Alt du skriver i HTML Section med {{ variable }}-syntaks kan bruges som input-felt fra Element.

Disse tags kan også bruges i ethvert tekstfelt i et Design Editor-design

Fjernelse af duplikerede produkter #

Brug af denne funktion tvinger indlæsning af flere Clerk.io recommendations én efter én i stedet for samtidigt, hvilket øger sidens indlæsningstid.

Sørg for at fordelene ved at undgå dubletter opvejer ekstra loadtid.

Clerk.js tilbyder to nemme måder at forhindre dubletter på tværs af flere recommendations-elementer på samme side.

Den ene metode er at bruge Exclude Duplicates-muligheden i Inject Element-sektionen og vælge det Clerk-element, du vil ekskludere dubletter fra – enten ved at vælge det fra listen eller angive en CSS selector.

Den anden metode er at tilføje data-exclude-from-attributten til det Clerk-blok, hvor du vil fjerne dubletter fra. Value af attributten skal være en CSS selector for det andet blok, du vil forhindre dubletter fra.

I eksemplet nedenfor ekskluderer .clerk2-elementet alle produkter, der er i .clerk1-elementet, og .clerk3-elementet ekskluderer produkter, der er i enten .clerk1 eller .clerk2-elementerne.

<span class="clerk clerk1"
  data-template="@clerk-banner-1">
</span>

<span class="clerk clerk2"
  data-exclude-from=".clerk1"
  data-template="@clerk-banner-2">
</span>

<span class="clerk clerk3"
  data-exclude-from=".clerk1,.clerk2"
  data-template="@clerk-banner-3">
</span>

Du kan også begrænse ekskluderingen til kun at gælde for de første n produkter (en smart løsning, hvis du har et element med 20 produkter men kun fire vises ad gangen).

Dette gøres via :limit(n)-muligheden (hvor n er det første antal produkter, du vil ekskludere fra).

Her er det samme eksempel som ovenfor, men hvor ekskluderings-ID’et kun gælder for de første fem produkter.

<span class="clerk clerk1"
  id="clerk1"
  data-template="@clerk-banner-1">
</span>

<span class="clerk clerk2"
  id="clerk2"
  data-exclude-from=".clerk1:limit(5)"
  data-template="@clerk-banner-2">
</span>

<span class="clerk clerk3"
  id="clerk3"
  data-exclude-from=".clerk1:limit(5),.clerk2:limit(5)"
  data-template="@clerk-banner-3">
</span>

Ekskludering af specifikke produkter #

For at undgå at vise bestemte produkter, skal du blot tilføje attributten data-exclude til en eksisterende embedcode.

Dette skal være en liste over de product IDs, du ikke vil vise i blokken.

For eksempel:

<span class="clerk"
  data-template="@clerk-complementary"
  data-exclude="[45654]">
</span>

Page views indsigt #

På listerne under Search > Elements og Recommendations > Elements, svæv over det grønne Yes/No-badge i kolonnen Seen in last 24h for at åbne hurtigt indsigt.

Popup’en viser for de seneste 7 dage:

• Top 10 sider, hvor elementet har optrådt
• Individuelle visninger pr. side
• Samlede visninger på tværs af alle sider
• Direkte links til siderne

Brug dette til at verificere placering og identificere, hvilke sider giver mest eksponering for hvert element. Hvis et element ikke har nogen nylige visninger, vises No-badge og popup’en vil være tom.