Tagalys Recs Examples

example: Regina Chocolate: 183631697

Alpine.store('tagalysRecs').getRecs({
            productId: '12345',
            targetMarkupId: 'my-recs-div',
            view: 'tagalys-recs',
            onComplete: () => alert('My recs are loaded'),
            limit: 8,
            })
        

• productId product ID to base the recs off
• targetMarkupId The ID of a div on the current page where you want the recs to be injected
• view Takes a value of 'tagalys-recs' or 'recs-alt', these are templates/search..liquid templates - new ones can be created to achieve alternate rec layouts
• onComplete (optional) Default is null. Option to do something after recs loaded (might be used for skeleton state)
• recommendationId (optional) Default is 'e3f4dab0ad3a47afc06a' - Tagalys ID for how it chooses recs
• limit (optional) Default is 4 - How many products to show

Vertical Recs

Used for vertical recs (but parent class makes this a horizontal grid here)

Uses view: templates/search.tagslys-recs.liquid

Show 4 products

Alternate layout example (full card)

Uses view: templates/search.recs-alt.liquid

Full product card

Show 6 products

Intersect example

Uses view: templates/search.recs-alt.liquid

Full product card

Show 4 products

Uses 6701201129544 rather than input (Windsor handbag)