Skip to main content
RichRelevance

HTML Integration: Add to Cart Page (Legacy)

NOTE This section refers to a legacy feature which is only available to existing customers. New and existing customers looking to add personalization should refer to Add to Cart Page (JSON)

The add to cart page is displayed immediately after a shopper adds a product to their shopping cart. It is a distinct page separate from the cart page, typically offering other products, options, or information relevant to the product just added to the cart. It may be a modal window or an interstitial page before cart.

How To Make This Code Work For You

Follow the sample integration code below, making these changes:

Function Requirement
R3_COMMON.setApiKey('MY_API_KEY'); Replace MY_API_KEY with your site’s API key, a unique identifier for your account.
R3_COMMON.setBaseUrl(RRSERVER_URL);

Set RRSERVER_URL to one of these values.

For initial development:

window.location.protocol+'//integration.richrelevance.com/rrserver/'

For production:

window.location.protocol+'//recs.richrelevance.com/rrserver/'

R3_COMMON.setSessionId('USER_SESSION_ID'); Replace USER_SESSION_ID with the session ID for the current user and session. The session ID is a crucial variable that allows Algonomy to track shopper behavior when they visit your site so recommendations can be generated. This parameter should remain the same from start to finish for a user’s shopping session.
R3_COMMON.setUserId('USER_ID');

Replace USER_ID with the user ID, a unique string to identify each user. All user behavior will be stored using this key. It is case-sensitive and should be the same UserId sent to {rr} in other applications.User IDs are often connected to email addresses, and can be directly linked to the login credentials a consumer uses to log into and buy products from the e-commerce site. To avoid sending personally identifiable information to Algonomy, you can use a hash of your site’s user ID (if, for example, your site uses email addresses as user IDs, then you should not send that information directly to Algonomy). 

Note: if the USER_ID is unknown, leave it blank.

R3_ADDTOCART.addItemIdToCart('ITEM_ID','SKU'); Replace ITEM_ID with the item ID, a unique identifier for the item.
Replace SKU with the specific SKU the user has purchased. If there is no SKU ID, this can be left empty.​
R3_COMMON.setClickthruServer(window.location.protocol+'//'+window.location.host)

No changes are required.

This code enables the client to send the domain for click-through URL through the p13n_generated.js call if relative URLs are supplied in the feed. For example, if the domain calling our code is m.retailer.com or UAT.retailer.com, we can automatically redirect to the correct domain.

Sample Integration Code

Primary Code Block

<!-- Place this code inside the <body> element as close to the top as possible -->
<script src="//media.richrelevance.com/rrserver/js/1.2/p13n.js"></script>
<script charset="utf-8" type="text/javascript">
  var R3_COMMON = new r3_common();
  R3_COMMON.setApiKey('abcd5432e1');
  R3_COMMON.setBaseUrl(window.location.protocol+'//integration.richrelevance.com/rrserver/');
  R3_COMMON.setClickthruServer(window.location.protocol+"//"+window.location.host);
  R3_COMMON.setSessionId('6B4D397B');
  R3_COMMON.setUserId('1');  // if no user ID is available, please leave this blank
 
  R3_COMMON.setPageBrand('Microsoft');
 
  // here's an example requesting recommendations for 3 page areas
  R3_COMMON.addPlacementType('add_to_cart_page.rr1');
  R3_COMMON.addPlacementType('add_to_cart_page.rr2');
  R3_COMMON.addPlacementType('add_to_cart_page.rr3');
 
 //We highly recommend you provide the Category Hint ID.  For more details read the notes below.
  R3_COMMON.addCategoryHintId('Electronics');
 
  var R3_ADDTOCART = new r3_addtocart();
  R3_ADDTOCART.addItemIdToCart('ACW239845','0WD37534000');
 
  r3();
 
</script>

Placement-marker Code Blocks

<script charset="utf-8" type="text/javascript">
  r3_placement('add_to_cart_page.rr1');
</script>
 
<!-- Page contents -->
 
<script charset="utf-8" type="text/javascript">
  r3_placement('add_to_cart_page.rr2');
</script>
 
<!-- Page contents -->
 
<script charset="utf-8" type="text/javascript">
  r3_placement('add_to_cart_page.rr3');
</script>

Flush Code Block

<script charset="utf-8" type="text/javascript">
 rr_flush_onload();
</script>​

Notes

  • The values in addPlacementType() should match the values in each r3_placement() call.
  • The category ID used in addCategoryHintId should be the current category ID related to your product based on the context of how your user navigated to it. A bread crumb trail is generally a good example of this. If a user navigated to “Electronics > Computers > Laptops” then the category ID we would want is the ID for Laptops. If the user landed on the item page without a bread crumb trail or navigation process clients can generally fall back on a ‘Primary Category’ or ‘Default Category’. Algonomy will use addCategoryHintId to derive category context when responding with data.