Esta es una traducción que desde EGA Futura ofrecemos como cortesía a todo el Ohana y comunidad de programadores, consultores, administradores y arquitectos de Salesforce para toda Iberoamérica.
El enlace a la publicación original, lo encontrarás al final de este artículo.
…
El enfoque híbrido de Salesforce CMS le permite crear y mantener contenido y activos en una única ubicación. Algunos sistemas como Experience Cloud cuentan con integraciones preconstruidas para sindicar este contenido. Otros, como Marketing Cloud Content Builder, no la tienen.
Este blog le mostrará cómo construir dicha integración usted mismo. Utilizaremos el CMS de Salesforce sin cabeza y el SDK de Content Builder Block para ello.
Resumen de la integración
Antes de adentrarnos en la implementación propiamente dicha, veamos el resultado final. El siguiente GIF muestra cómo crear un nuevo mensaje de correo electrónico. Parte del proceso de creación del mensaje consiste en seleccionar contenido personalizado en el panel izquierdo. La fuente de contenido con el logotipo de Salesforce representa la integración personalizada que se describe en esta entrada del blog. Al arrastrar el icono sobre el correo electrónico, se obtiene una lista de imágenes. Estas imágenes son activos del CMS de Salesforce, que ahora están perfectamente integrados.
Nuestra integración tiene tres partes móviles:
- Salesforce CMS, que proporciona los activos compartibles. Se trata de una función de su org. de Salesforce.
- Constructora de contenidos, que proporciona los activos compartibles
- Content Builder, que forma parte de Marketing Cloud. Content Builder es la herramienta para organizar de forma centralizada sus activos de Marketing Cloud.
- Cuidado con el contenido, que forma parte de Salesforce
- Una aplicación Node.js independiente, que es la capa de integración entre Salesforce CMS y Marketing Cloud. Esto podría ser escrito en cualquier lenguaje de programación de su elección.
El siguiente diagrama muestra la arquitectura de implementación de alto nivel. A la izquierda está la org de Salesforce con el CMS. La aplicación Node.js se encarga de la autenticación en la org, y las consultas al CMS utilizando la API de entrega, así como de renderizar la salida para Content Builder. La salida renderizada se basa en la especificación del Bloque SDK de Content Builder.
Vamos a profundizar en las diferentes partes.
Preparación de la org y el CMS de Salesforce
Como se ha mencionado anteriormente, usted utiliza el CMS de Salesforce para crear y mantener sus activos en una ubicación central. Con el CMS puede gestionar activos que sean privados para sus entornos o de acceso público. Esto se define cuando se crea un canal CMS.
El siguiente GIF muestra el proceso básico de definición de dicho canal. Una vez creado, ten a mano el ID del canal para un paso posterior. El GIF muestra cómo obtener este ID a través del punto final de la API /services/data/v51.0/connect/cms/delivery/channels de la org. Si bien se ve cómo recuperar esta información utilizando Workbench, le recomendamos que utilice una herramienta más moderna como Salesforce API Collection for Postman para este paso.
Como el CMS forma parte de su organización de Salesforce, se aplican los mecanismos estándar de autenticación y autorización. Para manejar esto, la integración utiliza el flujo de portador JWT de OAuth 2.0, el método de mejores prácticas para la comunicación de servidor a servidor.
La condición previa para este flujo de autenticación es una Salesforce Connected App. Como puede ver en el siguiente GIF, la configuración de una Connected App está totalmente dirigida por la interfaz de usuario.
Si quieres aprender más sobre Connected Apps, te recomiendo encarecidamente la serie de vídeos en Trailhead Live. La aplicación de ejemplo en GitHub también contiene instrucciones detalladas paso a paso para esta configuración específica. En el siguiente paso veremos la aplicación Node.js, y cómo integrarla con Marketing Cloud.
Uso de Node.js con el SDK del bloque de construcción de contenidos
Para proporcionar contenido personalizado utilizamos una aplicación Node.js personalizada. Esta aplicación obtiene los datos relevantes de la org de Salesforce utilizando los puntos finales de la API de entrega. A continuación, construye la interfaz de usuario que se incorpora a Content Builder utilizando el SDK de bloques. El código fuente completo está disponible en Github.
Para instanciar el SDK en la aplicación Node.js, se instala una nueva instancia del objeto global sfdc.BlockSDK. En el siguiente fragmento de código puedes ver dicha instanciación. Con los parámetros del BlockSDK, se controla el aspecto de la interfaz de usuario en el Content Builder. En nuestro ejemplo, definimos qué pestañas queremos que estén disponibles para el usuario.
// Lógica del SDK para establecer y recuperar los atributos del bloque
var sdk = new window.sfdc.BlockSDK({ pestañas: ['stylingblock', 'htmlblock']
});
La verdadera integración del activo de contenido, en nuestro caso una imagen, ocurre en una función personalizada setImage(). El siguiente fragmento de código contiene una versión abreviada de la función completa. En él se destacan dos elementos clave del SDK de bloques.
- Usando
sdk.setContent()se tiene un control total sobre el HTML que se colocará dentro del correo electrónico. Se puede pasar cualquier tipo de marcador de posición de cadena como parte de esa función. - Con
sdk.setData()se especifican los datos a pasar al Content Builder. El objeto que se pasa puede contener cualquier par clave/valor. En tiempo de ejecución, los datos se utilizan para reemplazar los marcadores de posición de la llamadasdk.setContent().
función setImage() { sdk.setContent('<div style="font-size: 0.85rem !important;font-family:Helvetica,Arial,sans-serif !important;text-align: ' + alignment + ';"> <a href="' + link + '"><img style="width: 100%" src="' + imageurl + '" /></a><br>'+title+'<br><br>'+htmlBody+'</div>'); sdk.setData({ contentType: contentType, link: link, width: width, altura: altura, imageurl: imageurl, alineación: alineación, escala: escala, title: title, htmlBody: htmlBody });
}
Puedes enriquecer la experiencia del usuario final proporcionando también una interfaz de usuario personalizada, como en la app de ejemplo. Como has visto en el primer GIF, la app tiene más características.
Por ejemplo, proporciona una interfaz de usuario personalizada completa para el usuario final, donde pueden escalar o alinear la imagen desde el CMS, directamente desde el Content Builder. Todo esto está construido con HTML y JavaScript, y puede ser personalizado para sus propias necesidades.
Resumen
El CMS de Salesforce es una gran función para proporcionar activos desde un único repositorio central. Con el enfoque de la API, puede utilizar estos activos en cualquier sistema de destino. Esto hace que sea perfecto para integrarse en sistemas extensibles, como el generador de contenidos de Marketing Cloud.
Trailhead ofrece excelentes recursos para empezar a utilizar CMS de Salesforce y el SDK de bloques de Content Builder. Para ponerse manos a la obra, consulte las instrucciones en GitHub.
Originalmente publicado en: https://developer.salesforce.com/blogs/2021/03/how-to-integrate-salesforce-cms-with-marketing-cloud-content-builder.html