Expand my Community achievements bar.

SOLVED

How to track on products purchased on product listing page with multiple products/product carousel?

Avatar

Level 2

There are several products on listing page or product carousel page but not sure what products are actually purchased after visit. Is there any efficient to way to track it? Use "product title" dimension but sales captured which is not in the listing page..I find it it's incorrect.

Or is it possible to how to create "target url" segment/dimension so that which url customers head after landing on the product listing page? Thanks!

1 Accepted Solution

Avatar

Correct answer by
Level 8

Hi, @Soo1 

This can be a complex topic, depending on the setup of your site and the specific questions you are looking to answer. That said, I would recommend you start with basic e-commerce tracking using s.products and s.events.

I won't go into all of the details, as the links provided should be enough to get you started, but using s.products and s.events in tandem will give you enormous flexibility. 

Looking at s.events, you'll want to focus on the commerce-specific (reserved) events:

  • prodView - Include this event on a product detail view
  • scAdd - Include this event any time a product is added to the shopping cart
  • scCheckout - Include this event when a customer begins the checkout flow
  • purchase - Include this event on the order confirmation page, along with a list of all products purchased

(I left out scOpen, scRemove, and scView to simplify the list. Determine for yourself if they are relevant to your needs and implement accordingly.)

With s.products, you will specify the product being viewed/added/purchased, as well as additional details such as product category, quantity, purchase amount, etc. The product ID (SKU) and category should be included on each event call, and should be consistent throughout. The quantity and purchase amount may or may not be needed, depending on the step in the flow.

Example: 

// view product detail page
s.events = "prodView";
s.products = "cat1;prod1";

// add first item to cart (first item opens the cart), quantity = 1, price = 9.99
s.events = "scOpen,scAdd";
s.products = "cat1;prod1;1;9.99";

// view existing cart
s.events = "scView";
s.products = "cat1;prod1;1;9.99";

// begin checkout flow
s.events = "scCheckout";
s.products = "cat1;prod1;1;9.99";

// purchase confirmation (success)
s.events = "purchase";
s.products = "cat1;prod1;1;9.99";
s.purchaseID = "unique-order-id"

As always, you can pair any other relevant props/eVars/events with the calls at each step. You may find that you need more specific information, and the use of merchandising variables is necessary. There is plenty of flexibility to implement in a way that meets your needs.

If all of this is too much for your needs, and you're just interested in which page the customer sees next, I'd suggest using a flow report in Workspace to identify the next page viewed. (In legacy reports & analytics, you would use a pathing report for this information.)

View solution in original post

2 Replies

Avatar

Correct answer by
Level 8

Hi, @Soo1 

This can be a complex topic, depending on the setup of your site and the specific questions you are looking to answer. That said, I would recommend you start with basic e-commerce tracking using s.products and s.events.

I won't go into all of the details, as the links provided should be enough to get you started, but using s.products and s.events in tandem will give you enormous flexibility. 

Looking at s.events, you'll want to focus on the commerce-specific (reserved) events:

  • prodView - Include this event on a product detail view
  • scAdd - Include this event any time a product is added to the shopping cart
  • scCheckout - Include this event when a customer begins the checkout flow
  • purchase - Include this event on the order confirmation page, along with a list of all products purchased

(I left out scOpen, scRemove, and scView to simplify the list. Determine for yourself if they are relevant to your needs and implement accordingly.)

With s.products, you will specify the product being viewed/added/purchased, as well as additional details such as product category, quantity, purchase amount, etc. The product ID (SKU) and category should be included on each event call, and should be consistent throughout. The quantity and purchase amount may or may not be needed, depending on the step in the flow.

Example: 

// view product detail page
s.events = "prodView";
s.products = "cat1;prod1";

// add first item to cart (first item opens the cart), quantity = 1, price = 9.99
s.events = "scOpen,scAdd";
s.products = "cat1;prod1;1;9.99";

// view existing cart
s.events = "scView";
s.products = "cat1;prod1;1;9.99";

// begin checkout flow
s.events = "scCheckout";
s.products = "cat1;prod1;1;9.99";

// purchase confirmation (success)
s.events = "purchase";
s.products = "cat1;prod1;1;9.99";
s.purchaseID = "unique-order-id"

As always, you can pair any other relevant props/eVars/events with the calls at each step. You may find that you need more specific information, and the use of merchandising variables is necessary. There is plenty of flexibility to implement in a way that meets your needs.

If all of this is too much for your needs, and you're just interested in which page the customer sees next, I'd suggest using a flow report in Workspace to identify the next page viewed. (In legacy reports & analytics, you would use a pathing report for this information.)

Avatar

Level 2
Thank you so much for the kind explanation! It's very helpful!!!!! Thank you~~