
Sitecore Personalize offers multiple integration options for any Digital Experience Platform, ranging from SDK-based implementations to API-driven approaches. This article explores three commonly used client-side methods, their applications, and other important considerations when integrating with Personalize.
1. Engage SDK: Ideal for modern frontend stacks, such as Sitecore JSS with Next.js or Angular, offering a reliable and straightforward integration solution.
2. Engage Script: A practical choice for non-Sitecore platforms or applications managed via third-party TMS solutions.
3. CloudSDK (v0.4+): The most advanced and innovative option, featuring built-in page tracking and simplified integration among many other things. (CloudSDK is publicly available for XMC. However, the XP/XM features mentioned here are based on Early Access and are not yet publicly available. For timelines and further details, please contact Sitecore directly.)
While a client-side solution is optimal for many use cases, organizations considering a server-side approach should base their decision on specific needs, particularly if enhancing security is a priority. However, this comes with the trade-off of losing access to web experiences and experiments.
For most organizations, a hybrid would be the best option, enabling robust security while retaining the ability to leverage web experiences and truly help innovate faster. Choosing the best solution depends on your tech stack and overall business goals.
As Sitecore continues its transition to CloudSDK, I hope this post will soon become absolite—eliminating confusion and fragmentation as the platform evolves.
Engage SDK: For Sitecore XP/XM/XMC with JSS Next.JS or JSS Angular
You can refer to the Sitecore documentation to complete this integration. However, in my experience and using provided script, I encountered a race condition where the Web Experience attempted to access window.engage object before it was initialized by the Engage SDK script in Next.JS. I used XP 9.4, JSS22 stack.
To handle this, you can use the following example code. Be sure to periodically check the Sitecore documentation, as updates or improvements to their guidance may be released.
import { init, Engage } from "@sitecore/engage";
let engage: Engage;
declare global {
interface Window {
engage: Engage;
Engage: {
exposedFunctions: Engage;
};
}
}
const loadEngage = async (): Promise<void> => {
engage = await init({
clientKey: "",
targetURL: "",
pointOfSale: "",
cookieDomain: "",
cookieExpiryDays: 365,
forceServerCookieMode: false,
includeUTMParameters: true,
webPersonalization: true
});
window.engage = engage;
window.Engage.exposedFunctions = engage;
};
loadEngage();
CloudSDK 0.4: For Sitecore XP 10.4, JSS 22.X, or Latest Versions
The integration process is straightforward. To begin, you’ll need the engage context (available from Sitecore) and the site name.
For those exploring Web Experiences, a minor adjustment could be needed when using CloudSDK:
• Update the method from “Engage.templating.compile” to “window.scCloudSDK.personalize.templating.compile”.
• Additionally, implement a conditional check when selecting the engage object for firing events, especially if both methods are in use.
Engage Script: For XP MVC or Non-Sitecore Implementation
Thanks to the omnichannel capabilities of Personalize, we have the opportunity to leverage this product across both Sitecore and non-Sitecore platforms . This approach enables the integration of multiple systems—legacy and modern—into a unified CDP/Personalize platform. The approach is stratight forward, just follow this documentation, inject scrip on your platform and start engaging with your customers.
Considerations for Using Sitecore Personalize
1. Server-Side vs. Client-Side Integration
This is a crucial decision that organizations must make based on their tactical and strategic needs. The choice will significantly impact the implementation and usage of Sitecore Personalize.
2. Engage SDK vs. CloudSDK
While this is currently a consideration, it will soon become less relevant. In a short term, CloudSDK is expected to take precedence, reducing reliance on Engage code. Engage SDK will likely remain relevant only outside the Sitecore ecosystem.
3. Handling Identity
For organizations with protected content, managing identity is critical. While using the Personalize Identity Event, consider session expiration and how identities/sessions are managed.
• Example: If User A logs in and later User B accesses the site from the same browser, the session of User A might be reassigned to User B. To avoid this, consider implementing clearing cookies strategy or implementing number of alternative solutions most suitable for your specific use cases
4. Page Tracking
This is straightforward with CloudSDK, as it comes standard. For other cases, minor adjustments may be required. If using a page or app router in Next.js, consider leveraging the “route change” concept to track navigation effectively.
5. Event Handling
Event handling is both critical and relatively simple. Focus on maintaining consistent event naming conventions aligned with your long-term vision for product usage. This ensures scalability and clarity in your data strategy.
Final thoughts
Sitecore Personalize offers diverse integration options to suit various business needs, whether through Engage SDK, Engage Script, or CloudSDK. Each method provides distinct advantages depending on your tech stack and organizational goals.If you’re planning a Sitecore Personalization integration in the coming months, it’s highly recommended to consider CloudSDK over the Engage SDK for a more future-proof approach.
Recent Comments