[Premium]{class="badge positive" title="See what's included in Target Premium."}

Een ontwerp aanpassen met Snelheid

Gebruik de open-source ontwerptaal van de Snelheid om aanbevelingen aan te passen in Adobe Target Recommendations.

Overzicht van snelheid section_C431ACA940BC4210954C7AEFF6D03EA5

Informatie over snelheid vindt u op https://velocity.apache.org.

Alle logica van de Snelheid, syntaxis, etc. kunnen voor een aanbevelingsontwerp worden gebruikt. Dit betekent dat u for lussen, indien instructies, en andere code die Snelheid gebruiken eerder dan JavaScript.

Entiteitskenmerken verzonden naar Recommendations in de productPage mbox of de CSV-upload kan worden weergegeven in een ontwerp, met uitzondering van de kenmerken "multi-value". Elk type kenmerk kan worden verzonden; echter Target geeft geen kenmerken door van het type "multi-value" als een array waarover een sjabloon kan doorlopen (bijvoorbeeld entityN.categoriesList).

Naar deze waarden wordt verwezen met de volgende syntaxis:

$entityN.variable

Kenmerknamen van entiteiten moeten de snelheidshorthand-notatie volgen, die bestaat uit een regelafstand $ teken, gevolgd door een VTL-id (Velocity Template Language). De VTL-id moet beginnen met een alfabetisch teken (a-z of A-Z).

Namen van kenmerken van snelheidsentiteiten zijn beperkt tot de volgende typen tekens:

  • Alfabetisch (a-z, A-Z)
  • Numeriek (0-9)
  • Afbreekstreepje ( - )
  • Onderstrepingsteken ( _ )

De volgende kenmerken zijn beschikbaar als snelheidsarrays. Als zodanig kunnen ze worden herhaald of via index naar ze worden verwezen.

  • entities
  • entityN.categoriesList

Bijvoorbeeld:

#foreach ($category in $entity1.categoriesList)
<br/>$category
#end

of

#if ($entities[0].categoriesList.size() >= 3 )
$entities[0].categoriesList[2]
#end

Voor meer informatie over de variabelen van de Snelheid (attributen), zie https://velocity.apache.org/engine/releases/velocity-1.7/user-guide.html#variables.

Als u een profielmanuscript in uw ontwerp gebruikt, moet $ voorafgaand aan de manuscriptnaam met een beschermd zijn \ (backslash). Bijvoorbeeld:

\${user.script_name}

NOTE
Het maximumaantal entiteiten waarnaar in een ontwerp kan worden verwezen, hard-gecodeerd of via lussen, is 99. De lengte van het sjabloonscript kan maximaal 65.000 tekens bevatten.

Als u bijvoorbeeld een ontwerp wilt dat iets dergelijks weergeeft:

snelheid_voorbeeldafbeelding

u kunt de volgende code gebruiken:

<table style="border:1px solid #CCCCCC;">
<tr>
<td colspan="3" style="font-size: 130%; border-bottom:1px solid
#CCCCCC;"> You May Also Like... </td>
</tr>
<tr>
<td style="border-right:1px solid #CCCCCC;">
<div class="search_content_inner" style="border-bottom:0px;">
<div class="search_title"><a href="$entity1.pageUrl"
style="color: rgb(112, 161, 0); font-weight: bold;">
$entity1.id</a></div>
By $entity1.message <a href="?x14=brand;q14=$entity1.message">
(More)</a><br/>
sku: $entity1.prodId<br/> Price: $$entity1.value
<br/><br/>
</div>
</td>
<td style="border-right:1px solid #CCCCCC; padding-left:10px;">
<div class="search_content_inner" style="border-bottom:0px;">
<div class="search_title"><a href="$entity2.pageUrl"
style="color: rgb(112, 161, 0); font-weight: bold;">
$entity2.id</a></div>
By $entity2.message <a href="?x14=brand;q14=$entity2.message">
(More)</a><br/>
sku: $entity2.prodId<br/>
Price: $$entity2.value
<br/><br/>
</div>
</td>
<td style="padding-left:10px;">
<div class="search_content_inner" style="border-bottom:0px;">
<div class="search_title"><a href="$entity3.pageUrl"
style="color: rgb(112, 161, 0); font-weight: bold;">
$entity3.id</a></div>
By $entity3.message <a href="?x14=brand;q14=$entity3.message">
(More)</a><br/>
sku: $entity3.prodId<br/> Price: $$entity3.value
<br/><br/>
</div>
</td>
</tr>
</table>
NOTE
Als u na de waarde van een kenmerk tekst wilt toevoegen vóór een tag die aangeeft dat de naam van het kenmerk is voltooid, kunt u dit doen met een formele notatie om de naam van het kenmerk in te sluiten. Bijvoorbeeld: ${entity1.thumbnailUrl}.gif.

U kunt ook algorithm.name en algorithm.dayCount als entiteitattributen in ontwerpen, zodat kan één ontwerp worden gebruikt om veelvoudige criteria te testen, en de criteria kunnen de naam dynamisch in het ontwerp worden getoond. Dit toont de bezoeker die hij of zij kijkt naar "topverkopers" of "mensen die dit bekeken hebben die dat gekocht hebben." U kunt deze kenmerken zelfs gebruiken om de dayCount (aantal dagen dat de criteria worden gebruikt, zoals "hoogste verkopers in de afgelopen twee dagen", enz.

Werken met getallen in snelheidssjablonen

Door gebrek, behandelen de malplaatjes van de Snelheid alle entiteitattributen als koordwaarden. Mogelijk wilt u een entiteitskenmerk behandelen als een numerieke waarde om een wiskundige bewerking uit te voeren of deze te vergelijken met een andere numerieke waarde. Voer de volgende stappen uit om een entiteitskenmerk als een numerieke waarde te behandelen:

  1. Declareer een dummyvariabele en initialiseer deze naar een willekeurig geheel getal of een dubbele waarde.
  2. Zorg ervoor dat het entiteitskenmerk dat u wilt gebruiken niet leeg is (vereist voor Target Recommendations' sjabloonparser om de sjabloon te valideren en op te slaan).
  3. Geef het entiteitskenmerk door aan de parseInt of parseDouble op de dummyvariabele die u in stap 1 hebt gemaakt om van de tekenreeks een geheel getal of dubbele waarde te maken.
  4. Voer de wiskundige bewerking of vergelijking uit op de nieuwe numerieke waarde.

Voorbeeld: Een kortingsprijs berekenen

Stel dat je de weergegeven prijs van een object met $0,99 wilt verlagen om een korting toe te passen. U kunt de volgende methode gebruiken om dit resultaat te bereiken:

#set( $double = 0.1 )

#if( $entity1.get('priceBeforeDiscount') != '' )
    #set( $discountedPrice = $double.parseDouble($entity1.get('priceBeforeDiscount')) - 0.99 )
    Item price: $$discountedPrice
#else
    Item price unavailable
#end

Voorbeeld: Het aantal sterren dat moet worden weergegeven op basis van de waardering van een item

Stel dat u een geschikt aantal sterren wilt weergeven op basis van de numerieke gemiddelde klantbeoordeling van een item. U kunt de volgende methode gebruiken om dit resultaat te bereiken:

#set( $double = 0.1 )

#if( $entity1.get('rating') != '' )
    #set( $rating = $double.parseDouble($entity1.get('rating')) )
    #if( $rating >= 4.5 )
        <img src="5_stars.jpg">
    #elseif( $rating >= 3.5 )
        <img src="4_stars.jpg">
    #elseif( $rating >= 2.5 )
        <img src="3_stars.jpg">
    #elseif( $rating >= 1.5 )
        <img src="2_stars.jpg">
    #else
        <img src="1_star.jpg">
    #end
#else
    <img src="no_rating_default.jpg">
#end

Voorbeeld: De tijd in uren en minuten berekenen op basis van de lengte van een item in minuten

Stel dat u de lengte van een film in minuten opslaat, maar de lengte in uren en minuten wilt weergeven. U kunt de volgende methode gebruiken om dit resultaat te bereiken:

#if( $entity1.get('length_minutes') )
#set( $Integer = 1 )
#set( $nbr = $Integer.parseInt($entity1.get('length_minutes')) )
#set( $hrs = $nbr / 60)
#set( $mins = $nbr % 60)
#end

Een sleutelitem weergeven met aanbevolen producten section_7F8D8C0CCCB0403FB9904B32D9E5EDDE

U kunt uw ontwerp aanpassen om uw belangrijkste punt naast andere geadviseerde producten te tonen. U kunt bijvoorbeeld het huidige item ter referentie naast de aanbevelingen weergeven.

Hiervoor maakt u een kolom in uw ontwerp die gebruikmaakt van de $key kenmerk waarop u uw aanbeveling baseert in plaats van de $entity kenmerk. De code voor uw sleutelkolom kan er bijvoorbeeld als volgt uitzien:

<div class="at-table-column">
   <a href="$key.pageURL">
      <img src=$key.thumbnailUrl" class="at-thumbnail"/>
      <br/><h3>$key.name</h3>
      <br/><p class="at-light">$key.message</p>
      <br/><p class="at-light">$key.value</p>
   </a>
</div>

Het resultaat is een ontwerp als het volgende, waarbij in één kolom het sleutelitem wordt weergegeven.

rec_key-afbeelding

Wanneer u uw Recommendations activiteit, als het sleutelitem uit het profiel van de bezoeker wordt gehaald, zoals "laatst gekocht item", Target geeft een willekeurig product weer in de Visual Experience Composer (VEC). Dit komt omdat er geen profiel beschikbaar is terwijl u de activiteit ontwerpt. Wanneer bezoekers de pagina bekijken, zullen zij het verwachte belangrijkste punt zien.

Vervangingen in een tekenreekswaarde uitvoeren section_01F8C993C79F42978ED00E39956FA8CA

U kunt uw ontwerp wijzigen om waarden binnen een tekenreeks te vervangen. Zo vervangt u het decimaalteken dat in de Verenigde Staten wordt gebruikt door het komma-scheidingsteken dat in Europa en andere landen wordt gebruikt.

De volgende code toont één regel in een voorbeeld van een voorwaardelijke verkoopprijs:

<span class="price">$entity1.value.replace(".", ",") &euro;</span><br>

De volgende code is een volledig voorwaardelijk voorbeeld van een verkoopprijs:

<div class="price">
    #if($entity1.hasSalesprice==true)
    <span class="old">Statt <s>$entity1.salesprice.replace(".", ",") &euro;</s></span><br>
    <span style="font-size: 10px; float: left;">jetzt nur</span> $entity1.value.replace(".", ",") &euro;<br> #else
    <span class="price">$entity1.value.replace(".", ",") &euro;</span><br> #end
    <span style="font-weight:normal; font-size:10px;">
                                        $entity1.vatclassDisplay
                                        <br/>
                                        $entity1.delivery
                                        <br>
                                    </span>

De sjabloongrootte aanpassen en blanco waarden controleren default

Gebruikend een manuscript van de Snelheid om voor het dynamische rangschikken van de entiteitvertoning te controleren, past het volgende malplaatje een 1-aan-vele resultaat aan vermijden creërend lege HTML elementen wanneer er niet genoeg passende die entiteiten van zijn teruggekeerd Recommendations. Dit script is het meest geschikt voor scenario's waarin back-upaanbevelingen geen nut zouden hebben en Partial Template Rendering is ingeschakeld.

Het volgende HTML-fragment vervangt het bestaande HTML-gedeelte in het standaardontwerp van 4 x 2 (de CSS is hier niet opgenomen omwille van de beknoptheid):

  • Als er een vijfde entiteit bestaat, voegt het script een afsluitende div in en wordt een nieuwe rij geopend met <div class="at-table-row">.
  • Met 4x2, zullen de maximumgetoonde resultaten acht zijn, maar dit kon voor kleinere of grotere lijsten worden aangepast door te wijzigen $count <=8.
  • Houd er rekening mee dat de logica de entiteiten op meerdere rijen niet in evenwicht brengt. Bijvoorbeeld, als er vijf of zes te tonen entiteiten zijn, zal het dynamisch niet drie op bovenkant en twee op de bodem (of drie op bovenkant en drie op de bodem) worden. In de bovenste rij worden vier items weergegeven voordat een tweede rij wordt gestart.
<div class="at-table">
  <div class="at-table-row">
    #set($count=1)
    #foreach($e in $entities)
        #if($e.id != "" && $count < $entities.size() && $count <=8)
            #if($count==5)
                </div>
                <div class="at-table-row">
            #end
            <div class="at-table-column">
                <a href="$e.pageUrl"><img src="$e.thumbnailUrl" class="at-thumbnail" />
                    <br/>
                    <h3>$e.name</h3>
                    <br/>
                    <p class="at-light">$e.message</p>
                    <br/>
                    <p class="at-light">$$e.value</p>
                </a>
            </div>
            #set($count = $count + 1)
        #end
    #end
  </div>
</div>
recommendation-more-help
3d9ad939-5908-4b30-aac1-a4ad253cd654