Muligheder

Generelt #

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

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

Enhver mængde af Element-blokke kan baseres på et enkelt Design, eller du kan oprette separate Designs til hver Element.

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

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

Hver Element-bloks Settings-side er opdelt i fire sektioner, som du kan tilgå 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 nogen Filters, for eksempel hvis du kun vil vise produkter over eller under en bestemt pris eller fra et specifikt brand.

Vælg design #

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

Indsæt på website #

Element-blokke er knyttet til en embedcode, som gør det muligt at vise dem på alle sider, hvor du har indsat Clerk.js. Du kan enten blot indsætte embedcode der, hvor du ønsker, dette Element skal vises, eller bruge vores injection-funktion.

Bemærk, at embed codes muligvis skal bruge variabler som product IDs, category IDs eller email, afhængigt af logikken.

Brug af embedded code #

Embed code er et lille kodestykke, 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 skulle tilføje embed code manuelt. Det gøres ved at vælge Using injection:

URL-målretning #

Brug URL-målretning til præcist at styre, hvor et Element vises. Tilføj så mange URLs, du har brug for, og vælg, hvordan side-stien skal matche dem:

Herunder er en beskrivelse af de forskellige injection-muligheder:

Flere IDs #

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

Hvis selektoren matcher flere produkt-ID’er, samler Clerk alle matchede værdier og slår dem sammen til én liste.

Dette er nyttigt på sider som indkøbskurve, hvor hver linjevare indeholder et produkt-ID-element.

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

Med selektoren .product-id læser Clerk alle værdier ovenfor som én produkt-ID-liste.

Læse 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-selektor eller attribut på siden, vælg Clerk.js context fra Read ID from dropdown. Clerk.io vil så bruge den værdi, der er sat for den ID-type i context på den aktuelle side.

Dette er den nemmeste løsning, når platformen allerede sætter context automatisk — ingen ekstra konfiguration er nødvendig på siden.

Platforme med context indbygget i udvidelsen #

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

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

Platforme med context i den manuelle Clerk.js-script #

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

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

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

Headlines #

Det er nemt at styre overskrifter med standardopsætningen i Element.

På siden Edit Element, klik på Select Design for at se inputfeltet Headline:

Ændr teksten i Headline-boksen og klik Save.

Ændringen vil være synlig med det samme, når du opdaterer din webshop.

Dynamiske tekstfelt-tags #

Vores standarddesigns bruger tags til at sætte forskellige overskrifter for hvert Element.

Disse tags kan bruges i ethvert tekstfelt i Design Editor-designs og overalt i code designs.

Tags har syntaksen {{ variable }} og kan have et hvilket som helst navn, du vælger.

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

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

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

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

Alt, hvad du skriver i HTML Section med {{ variable }}-syntaksen kan bruges som inputfelt fra Element.

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

Fjernelse af duplikerede produkter #

Brug af denne funktion medfører, at flere Clerk.io recommendations indlæses efter hinanden i stedet for samtidig, hvilket kan gøre siden lidt langsommere.

Sørg for, at kompromiset i loadtid er det værd for at undgå dubletter.

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

Den ene er at bruge Exclude Duplicates-indstillingen i Inject Element-sektionen, hvor du vælger det Clerk-element, du vil udelukke dubletter fra – enten ved at vælge det fra listen eller ved at angive en CSS-selektor.

Den anden mulighed er at tilføje attributten data-exclude-from på den Clerk-blok, du vil fjerne dubletter fra. Value-delen af attributten skal være en CSS-selektor for den anden blok, der skal undgås dubletter fra.

I eksemplet nedenfor udelukker .clerk2-elementet alle produkter, der findes i .clerk1-elementet, og .clerk3-elementet udelukker alle produkter, der findes 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 udelukkelsen til kun at tage højde for de første n produkter (en smart løsning, hvis du har et element med 20 produkter, men kun fire er synlige ad gangen).

Dette gøres med :limit(n)-option (hvor n er det første antal produkter, du vil udelukke).

Her er det samme eksempel som før, men hvor udelukkelsen kun gælder 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 produkt-ID’er, som du ikke ønsker vist i blokken.

For eksempel:

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

Sidevisningsindsigt #

På listerne under Search > Elements og Recommendations > Elements, hold musen over det grønne Yes/No-mærke i kolonnen Seen in last 24h for at få et hurtigt indblik.

Popup-vinduet viser for de seneste 7 dage:

• Top 10 sider, hvor elementet blev vist
• Individuelle visningstællinger pr. side
• Samlede visninger på tværs af alle sider
• Direkte links til siderne

Brug dette til at verificere placering og identificere, hvilke sider der giver mest eksponering for hvert element. Hvis et element ikke har haft visninger for nylig, viser mærket No, og popup’en vil være tom.