DocumentaciónCommerceGuía de sistemas de administración

Personalizar plantillas de correo electrónico

Last update: Wed Nov 13 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Creado para:

  • Principiante
  • Intermedio
  • Administrador
  • Líder

Commerce incluye una plantilla de correo electrónico predeterminada para la sección del cuerpo de cada mensaje que envía el sistema. La plantilla para el contenido del cuerpo se combina con las plantillas de encabezado y pie de página para crear el mensaje completo. El contenido tiene formato de HTML y CSS, y se puede editar y personalizar fácilmente agregando variables. Las plantillas de correo electrónico se pueden personalizar para cada sitio web, tienda o vista de tienda. Si usa plantillas personalizadas, asegúrese de actualizar la configuración del sistema para asegurarse de que se usa la plantilla correcta. Para obtener información sobre cómo usar afirmaciones condicionales al personalizar la plantilla de correo electrónico, consulte la documentación para desarrolladores.

Ejemplo: vista previa del correo electrónico de bienvenida {width="500" modal="regular"}

Las plantillas predeterminadas incluyen su logotipo y la información de la tienda, y se pueden utilizar sin más personalización. Sin embargo, como práctica recomendada, debe ver cada plantilla y realizar los cambios necesarios antes de enviarla a los clientes.

Plantillas de correo electrónico {width="700" modal="regular"}

Información de plantilla

Campo
Descripción
Template Name
Nombre de la plantilla personalizada.
Insert Variable
Inserta una variable en la plantilla en la ubicación del cursor.
Template Subject
El asunto de la plantilla aparece en la columna Asunto y se puede utilizar para ordenar y filtrar las plantillas de la lista.
Template Content
El contenido de la plantilla en HTML.
Template Styles
Cualquier declaración de estilo CSS necesaria para dar formato a la plantilla se puede escribir en el cuadro Template Styles.

Plantilla de encabezado

Después de completar la configuración, la plantilla de encabezado de correo electrónico incluye tu logotipo que está vinculado a tu tienda. Si tiene conocimientos básicos de HTML, puede usar fácilmente variables predefinidas para agregar información de contacto de tienda al encabezado.

Paso 1. Cargar la plantilla predeterminada

  1. En la barra lateral Admin, vaya a Marketing > Communications>Email Templates.

  2. Haga clic en Add New Template.

  3. En la sección Load default template, haga clic en el selector Template y elija Magento_Email > Header.

    Encabezado de plantilla de correo electrónico: cargar plantilla predeterminada {width="600" modal="regular"}

  4. Haga clic en Load Template.

    El código del HTML y las variables de la plantilla aparecen en el formulario.

Paso 2. Personalización de la plantilla

  1. Escriba Template Name para el encabezado personalizado.

  2. Escriba un(a) Template Subject para organizar las plantillas.

    En la cuadrícula, la lista de plantillas se puede ordenar y filtrar por la columna Subject.

    Información del encabezado de la plantilla de correo electrónico {width="600" modal="regular"}

  3. En el cuadro Template Content, modifique el HTML según sea necesario.

    note note
    NOTE
    Cuando trabaje con el código de plantilla, asegúrese de no sobrescribir nada que esté entre llaves dobles.

  4. Para insertar una variable, coloque el cursor en el código donde desee colocar la variable y haga clic en Insert Variable.

  5. Elija la variable que desea insertar.

    Plantilla de encabezado - Insertar variable {width="600" modal="regular"}

    Cuando se selecciona una variable, se inserta en el código una etiqueta de marcado para la variable.

    Aunque las variables Almacenar dirección de correo electrónico son las que se incluyen con mayor frecuencia en el encabezado, puede escribir el código de cualquier sistema o variable personalizada directamente en la plantilla.

  6. Si necesita realizar alguna declaración CSS, escriba los estilos en el cuadro Template Styles.

  7. Cuando esté listo para revisar su trabajo, haga clic en Preview Template.

    Realice los cambios necesarios en la plantilla.

  8. Una vez finalizado, haga clic en Save Template.

    El encabezado personalizado ahora aparece en la lista de plantillas de correo electrónico disponibles.

Paso 3. Actualizar la configuración

  1. En la barra lateral Admin, vaya a Content > Design>Configuration.

  2. En la cuadrícula, busque la vista de almacén que desea configurar y haga clic en Edit en la columna Action.

  3. Desplácese hacia abajo y expanda Selector de expansión en la sección Transactional Emails.

  4. Elija el Header Template que se usa como predeterminado para las notificaciones por correo electrónico.

  5. Una vez finalizado, haga clic en Save Config.

Configuración del diseño de correo electrónico transaccional - Plantilla de encabezado {width="600" modal="regular"}

Plantilla de pie

El pie de la plantilla de correo electrónico contiene la línea de cierre y firma del mensaje de correo electrónico. Puede cambiar el cierre para que se ajuste a su estilo y agregar información adicional, como el nombre de la empresa y la dirección debajo de su nombre.

Paso 1. Cargar la plantilla predeterminada

  1. En la barra lateral Admin, vaya a Marketing > Communications>Email Templates.

  2. Haga clic en Add New Template.

  3. En la sección Load default template, haga clic en el selector Template y elija Magento_Email > Footer.

  4. Haga clic en Load Template.

    El código del HTML y las variables de la plantilla aparecen en el formulario.

Paso 2. Personalización y previsualización de la plantilla

  1. Escriba Template Name para el pie de página personalizado.

  2. Escriba un(a) Template Subject para organizar las plantillas.

    En la cuadrícula, las plantillas se pueden ordenar y filtrar por la columna Subject.

    Pie de página de plantilla de correo electrónico - información {width="600" modal="regular"}

  3. En el cuadro Template Content, modifique el HTML según sea necesario.

    note note
    NOTE
    Cuando trabaje con el código de plantilla, asegúrese de no sobrescribir nada que esté entre llaves dobles.

  4. Para insertar una variable, coloque el cursor en el código donde desee colocar la variable y haga clic en Insert Variable.

  5. Elija la variable que desea insertar.

    Cuando se selecciona una variable, se inserta en el código una etiqueta de marcado para la variable.

    Aunque las variables de Contacto de tienda son las que se incluyen con más frecuencia en el pie de página, puede escribir el código de cualquier sistema o variable personalizada directamente en la plantilla.

  6. Si necesita realizar alguna declaración CSS, escriba los estilos en el cuadro Template Styles.

Paso 3. Actualizar la configuración

  1. En la barra lateral Admin, vaya a Content > Design>Configuration.

  2. En la cuadrícula, busque la vista de almacén que desea configurar y haga clic en Edit en la columna Action.

  3. Desplácese hacia abajo y expanda Selector de expansión en la sección Transactional Emails.

  4. Elija el Footer Template que se usa como pie de página predeterminado en las notificaciones por correo electrónico.

  5. Una vez finalizado, haga clic en Save Config.

Configuración del diseño de correo electrónico transaccional - Plantilla de pie de página {width="600" modal="regular"}

Plantillas de mensajes

El proceso de personalizar el cuerpo de cada mensaje es el mismo que para personalizar el encabezado o el pie de página. La única diferencia es la plantilla de mensaje para cada actividad o evento que almacena en déclencheur una notificación. Puede usar las plantillas tal cual, o personalizarlas para que coincidan con su voz y marca. Además del texto de la plantilla, hay una amplia selección de variables predefinidas y personalizadas permitidas que puede crear e incorporar a la plantilla.

Paso 1. Cargar la plantilla predeterminada

  1. En la barra lateral Admin, vaya a Marketing > Communications>Email Templates.

  2. Haga clic en Add New Template.

    Plantillas de correo electrónico: cargar plantilla predeterminada {width="600" modal="regular"}

  3. Haga lo siguiente:

    • En Load default template, elija el(la) Template que desee personalizar.

    • Haga clic en Load Template.

Paso 2. Personalización de la plantilla

  1. Para Template Name, escriba un nombre para la plantilla personalizada.

  2. Si es necesario, cambie Template Subject.

    Esta es la primera línea del mensaje, que es el saludo de forma predeterminada. Puede dejarlo tal cual, o puede introducir algo más descriptivo.

  3. Tome nota de la ruta de acceso Currently Used For a la plantilla, que es la ruta utilizada para actualizar la configuración.

    Plantillas de correo electrónico: información de plantilla {width="600" modal="regular"}

  4. En el cuadro Template Content, modifique el HTML según sea necesario.

    El contenido consiste en una combinación de etiquetas de HTML, directivas CSS, variables y texto.

    note note
    NOTE
    Cuando trabaje con el código de plantilla, asegúrese de no escribir accidentalmente el código entre llaves dobles.

  5. Para insertar una variable, coloque el cursor en el código donde desee que aparezca la variable.

    La selección de variables varía según la plantilla e incluye las variables predefinidas y personalizadas permitidas, si están disponibles.

  6. Haga clic en Insert Variable y elija la variable que desea insertar.

    Un comando para insertar la variable se coloca entre llaves y se agrega al código en la ubicación del cursor. Por ejemplo:

    customVar code=my_custom_variable

  7. Para hacer declaraciones CSS, escriba los estilos en Template Styles.

    Plantillas de correo electrónico - agregar estilos personalizados {width="600" modal="regular"}

    note note
    NOTE
    Los estilos personalizados se aplican al correo electrónico solamente si {{template config_path="design/email/header_template"}} está presente en Template Styles. Para utilizar CSS personalizado sin una plantilla de encabezado predeterminada, debe proporcionarlos aquí dentro de la etiqueta de HTML <style>.

Paso 3. Actualizar la configuración

La ruta de exploración Currently Used For ​muestra dónde se utiliza la plantilla. En este ejemplo, la configuración de la plantilla se encuentra en la página​ Customer Configuration, en la sección Create New Account Options ​y en el campo​ Default Welcome Email.

  • Página - Customer Configuration
  • Sección - Create New Account Options
  • Campo - Default Welcome Email

  1. En la ruta de exploración Currently Used For, haga clic en el vínculo para abrir la página de configuración de la plantilla.

    Plantilla de correo electrónico actual {width="600" modal="regular"}

  2. Expanda Selector de expansión la sección y busque el campo de la plantilla de correo electrónico que ha personalizado.

  3. Desactive la casilla de verificación Use system value y haga clic en el nombre de la plantilla personalizada.

    Configuración de clientes - plantilla de correo electrónico de bienvenida predeterminada {width="600" modal="regular"}

  4. Una vez finalizado, haga clic en Save Config.

  5. En el mensaje que aparece en la parte superior del área de trabajo, haga clic en Cache Management y borre cualquier caché no válida.

Paso 4. Previsualizar y guardar la plantilla

  1. Cuando esté listo para revisar su trabajo, haga clic en Preview Template.

  2. Actualice la plantilla según sea necesario.

  3. Una vez finalizado, haga clic en Save Template.

    La plantilla personalizada ahora está disponible en la lista de plantillas de correo electrónico.

recommendation-more-help
d3c62084-5181-43fb-bba6-1feb2fcc3ec1