Mejores prácticas y sugerencias del editor de Content Builder

Videos demostrativos de procedimientos

Consulte Videos sobre métodos de Email Studio y Content Builder

Fundamentos del editor

Nota No incluya información de identificación personal en los vínculos de email, como, por ejemplo, direcciones de email.

• Una vista previa en vivo persistente en el lado derecho de la página se actualiza cuando se realizan cambios, ya sea en vista de Formato o vista de Código.
• Las funciones fáciles de utilizar como autocompletar de HTML, coincidencia de etiquetas, codificación por colores, números de líneas y formato automático le ayudan a modificar el origen de HTML.
• En vista Formato, arrastre contenido, bloques de contenido o formatos de contenido en el lienzo de vista previa donde desee. Una vez que los bloques estén en la página, puede arrastrarlos a otra ubicación en el email o la plantilla.
• Puede utilizar la Vista de árbol para duplicar, modificar o eliminar bloques.
• Arrastre múltiples bloques en cualquier área de contenido a menos que el área de contenido sea restringida. Ya no existe una relación de uno a uno entre bloques y áreas de contenido.
• Arrastre imágenes directamente desde su equipo a un email o una plantilla. La imagen de carga automáticamente en Content Builder.
• Un bloque de contenido o un formato de contenido creado durante la modificación de un email o una plantilla se puede guardar en Content Builder para su reutilización.
• El código HTML producido por el editor es de alta calidad. Por ejemplo, el editor clásico podría a veces ajustar imágenes con etiquetas <p>, causando problemas de formato. El editor de Content Builder no agrega etiquetas <p>.
• Si pretende utilizar la opción Escalar para ajustar en imágenes en emails, ajuste el tamaño de su imagen a la anchura y altura deseadas. El uso de anchuras y alturas más grandes evita la distorsión de la imagen al visualizar emails en Outlook.
  

  Nota Escalar para ajustar no se admite en Outlook.
• Los botones de la barra de herramientas Pegar como texto sin formato y Pegar desde Word no son compatibles con todos los navegadores. Para pegar con formato, use Cmd+V en Mac o Ctrl+V en Windows.

  

• Los bloques de contenido HTML pueden agregar contenedores de código adicionales en su mensaje. Para preservar su código, utilice fragmentos de código en su lugar.

Plantillas

• Ya sea crear una plantilla a través de pegar código HTML o comenzar con una plantilla existente, la experiencia de modificación es la misma. Puede iniciar una plantilla con pegar código HTML, luego cambiar a modo Formato para arrastrar y soltar la modificación.
• Las áreas de contenido y los bloques de contenido no tienen una relación de uno a uno. De forma predeterminada, puede agregar tantos bloques a un área de contenido como desee. Como resultado, puede reducir el número de áreas de contenido en sus plantillas.
• Las áreas de contenido pueden tener restricciones. Puede limitar el número y el tipo de bloques que se pueden entregar en un área de contenido. Por ejemplo, puede limitar un área de contenido de tipo pancarta a solo un bloque y limitarla a bloques de imágenes únicamente.
• Tras colocar contenido en un área de contenido, puede bloquear esa área de contenido de modo que no se pueda cambiar en emails creados utilizando esa plantilla.
• Para permitir al creador de la plantilla incluir instrucciones en cada área de contenido, cambie el mensaje predeterminado “entregar bloques o contenido aquí” en cada área de contenido. Cambie el valor predeterminado ya sea en el código HTML o a través de la interfaz de usuario en la ficha Propiedades del área de contenido.
• En plantillas de pegado de HTML, agregue el encabezado, el pie de página y abra las etiquetas de seguimiento si desea agregarlas a emails.
• Las áreas de contenido se identifican con la sintaxis <div data-type="slot" data-key="(unique key)">. El editor aún reconoce la sintaxis @@contentarea y <custom> del editor clásico. La definición de div permite el número máximo de bloques, los bloques permitidos y el mensaje de texto mostrado en contenido vacío para definir en el código HTML. La definición de propiedades directamente en el código HTML es útil al crear plantillas de Pegado y HTML.

  Ejemplo:

  <div data-type="slot" data-key="Hero1" data-max-blocks="1" data-allowed-blocks="imageblock; textblock; freeformblock; abtestblock; dynamicblock" data-label="Place Hero Image Here"></div>

  En este ejemplo, el área de contenido permite un máximo de un bloque. El bloque debe ser una bloque de imagen, de texto, de formato libre, de prueba a/b o de contenido dinámico. El mensaje mostrado en el área de contenido vacía es “Coloque la imagen de héroe aquí”.

• Hay algunas palabras clave reservadas que no pueden utilizarse como el valor de clave de datos en un área de contenido. De utilizarse, la plantilla quedaría inutilizable una vez guardada.
  • Contenido
  • Subcontenido
  • Supercontenido
  • Diseño
  • Etiquetas
  • Nombre de archivo
  • Createdbyname
  • Modifiedbyname
  • Ownername
  • Nombre
  • legacyID
  • legacycategoryID
  • Legacytype
  • enterpriseID
• Para aprovechar todas las funciones del editor, utilice la biblioteca de plantilla para crear un email o como el punto de inicio para una plantilla. Los formatos existentes se conocen simplemente como plantillas “Vacías”. Estas plantillas conforman las mejores prácticas para la capacidad de respuesta móvil.
• El componente Estilos globales le permite cambiar estilos fácilmente en una ubicación y poner en cascada esos estilos a través de la plantilla o el email. Los estilos globales solo están presentes en emails y plantillas basándose en una de las plantillas proporcionadas.
• Para apilar columnas en Formatos de contenido cuando se visualizan en dispositivos móviles, agregue el siguiente CSS a la consulta multimedia móvil en su plantilla:

  body .responsive-td {width:100% !important; float:left !important; padding:0 !important; }

Emails

Los asistentes le guían por el cambio de la plantilla que el email utiliza o para actualizar la plantilla actual.

El código del editor Vista de código de un email de Content Builder basado en plantilla está bloqueado, de modo que no puede copiar el código. Para copiar el código, selecciónelo, haga clic con el botón derecho y seleccione Crear fragmento de código. También puede seleccionar Guardar como plantilla desde el menú del botón Guardar, que le permite copiar el código o modificarlo directamente en el editor Vista de código.

Funciones de AMPscript y otras secuencias de comandos

• Las siguientes funciones de AMPscript hacen referencia a bloques de contenido e imágenes en Content Builder:
  • ContentBlockbyID, ContentBlockbyKey
  • ContentImagebyID, ContentImagebyKey
  Las funciones AMPscript de Content Builder también funcionan con Fragmentos de código.
• Cuando se utiliza AMPscript para recuperar bloques de contenido, la tabla que el editor agrega que ajusta los bloques también se recupera. Si no desea esta tabla de ajuste, utilice Fragmentos de código en su lugar.
• Al agregar funciones de AMPscript Content Builder, busque y seleccione imágenes y bloques a los que hacer referencia sin salir del editor. Active la búsqueda en el editor haciendo clic en Examinar... cuando escribe la función.
• Consulte la Guía de sintaxis de AMPscript para obtener más información.