welcome to another episode of the data Cloud video series my name is Aditya and in this episode we are going to see how you can use the interactions web SDK to capture the users interactions on your website and put that data into Data [Music] Cloud the Salesforce interactions SDK is an extensible data capture and collection framework it can be used to track different kinds of customer interactions on your website and using this information you can build Behavior profiles you can segment your audience or even integrate this information with Salesforce apart from tracking the SDK also
provides identity and cookie management consent management site maps and integration hooks let's now look at each of these features in detail the first and major task of the SDK data collection or tracking you can capture interactions on your website using an interaction event that you send to data Cloud using the send event API call the interaction event can contain both engagement data and profile data engagement data is nothing but data about user interactions on your website like viewing a catalog adding an item to the cart loading a page and so on the web SDK comes
with ready to use interaction types for most use cases profile data is the data about a person who using using this website this person can either be an anonymous person or a named person this brings us to the second feature of the SDK which is identity and cookie management an anonymous person is a new person visiting your website and the SDK randomly generates an anonymous ID for that person which is then stored in a first party cookie if the same person comes back the anonymous ID already stored in the cookie is used once a customer
logs in they become a known profile at which point you can send their user attributes like email user ID as profile data now not every user who's using your website wants to be tracked which brings us to the third feature of the SDK which is consent management the interactions SDK is designed to send events only if a customer has consented to tracking whenever the customer revokes their consent the web SDK captures this reference and immediately stop sending these events you can set the consent information either when initializing the SDK using the init method or by
calling the update consents method whenever your user changes their preference the final feature of the SDK we will talk about is the sit map using sitemap you can do multiple things whenever the user navigates from one page to the other you can capture this page navigation and send some additional tracking data along with it sitemap app also allows you to share the data capture logic that you have across multiple pages instead of duplicating the capture logic into each page now imagine you have multiple components and each of these components has a button and you want
to track whenever the user clicks on these buttons so one option is to include the send event API call in each of your components but that would be a lot of code duplication instead with sit Maps what you can do as you can see in the example on screen is that you can use the listener feature to listen to a particular event that is the click event and match it to a selector let it be a class name Let It Be HTML element name and then fire this end event API call within the listener so
that way your logic Works across all the pages and all the components instead of you having to modify every individual component to include the code snippet let's now see how you can set up the web SDK in data cloud just like the previous episodes we are working with a fictitious company called solar circles that sells solar panels they have a website which shows a list of panels that a customer can choose from now solar circles wants to track the user interactions on this website like clicks on a particular product tile just like with the ingestion
API that you have seen in the previous episode setting up the web SDK also requires multiple steps in the first step you need to set up the connector in the second step you need to create a data stream using this connector and in the third step you need to import the SDK into your website and use relevant methods to send events so first let's set up the connector from data Cloud setup let's navigate to web and mobile SDK and create a new connector for the website that you want to integrate with give it a name
and choose the connector type within your website you might might be tracking different kinds of interactions and for each of these interactions you might be capturing a specific set of data you need to upload a schema file that describes the shape of this data that you're going to be sending to data Cloud for each of the events that you're tracking this schema should be defined in a Json format as I mentioned earlier the web SDK provides a schema for the most commonly used events like adding to cart viewing an item in the catalog and so
on once you upload this schema each interaction type shows up as an object with corresponding attributes next let's move on to the second step which is creating a data stream for this connector from the data stream stab click new and choose website next choose the connector for which you want to create the stream for and within this connector choose all the the different events that you want to capture and click next verify if everything looks good and click on deploy and you can see that a single data stream is created to capture all the behavioral
events that are going to come in from your website and all this data is going to be dumped into the data Lake object that has been displayed over here now let's move on to the third step which is integrating the web SDK with your website back on the connector page and setup once you scroll down you'll notice there are instructions on how you can integrate the SDK to your website the web SDK provides a script that you embed in your website and the script gives you access to all the functionality that we discussed earlier the
website that solar circles is using is built on experience Cloud so let's go to the Builder edit the head markup and add a script tag to embed the script next we need to initialize the SDK using the init method and optionally you can pass in the consent information right now I have hardcoded it but in real life you need to capture consent and then send the status accordingly once the SDK is initialized you can use it to start sending events now solar circles is using lightning web components in order to display the UI so here
we are in the Javascript file of the lightning web component that displays the different tiles for the products and whenever each tile is clicked the handle product selected method is invoked within this method I am calling the send event API from the Salesforce interactions SDK to send in an interaction and I'm sending the interaction of type view catalog object and I'm passing some additional information like what is the ID of the product that was clicked and the name of the product that was clicked now back on the website let's open developer tools and you can
see that it already shows that in it is successful which is the console log that we' have added to the initialization method and once you click on a produ tile you can see that the SDK has sent an interaction event now if you expand this object you can see that the interaction is of type view catalog object and the catalog object has the ID and the name of the product as well also notice in the user property you can see that a random Anonymous ID has been generated for the user that is accessing this website
now back in data Cloud you can check if your data has been captured correctly or Not by going to the data Explorer tab select the data Lake object corresponding to the website's behavioral events stream you can now see that the events are successfully flowing in from the website to data cloud and that's pretty much how you use the interactions web SDK to capture user interactions on the we website and push that data into Data Cloud if you like this video give it a thumbs up and don't forget to hit subscribe and the bell icon to
get notified whenever there's a new video on our Salesforce Developers YouTube channel [Music]
