Usar componentes de contenido content-components

Al crear el contenido del correo electrónico, los componentes Contenido le permiten personalizar el correo electrónico con componentes sin procesar y vacíos que puede utilizar una vez colocados en un correo electrónico.

Puede agregar tantos Contenidos como sea necesario dentro de una Estructura, que define el diseño del correo electrónico.

Añadir componentes de contenido add-content-components

Para añadir componentes de contenido al correo electrónico y ajustarlos a sus necesidades, siga los pasos a continuación.

  1. En el Designer de correo electrónico, usa un contenido existente o arrastra y suelta una Estructura en el contenido vacío para definir el diseño del correo electrónico. Descubra cómo

  2. Arrastre y suelte el Contenido de su elección dentro de las estructuras relevantes.

    Captura de pantalla que muestra cómo arrastrar y soltar componentes de contenido en estructuras en el Designer de correo electrónico. {modal="regular"}

    note note
    NOTE
    Puede añadir varios componentes en una sola estructura y en cada columna de una estructura.
  3. Ajuste las opciones de cada componente con la ficha Configuración contextual. Por ejemplo, elija mostrarlo solo en equipos de escritorio o dispositivos móviles, o en ambos. También puede administrar las opciones de vínculo desde esta pestaña. Más información acerca de la administración de vínculos

  4. Ajuste los atributos de estilo de cada componente mediante la ficha Style. Por ejemplo, cambie el estilo del texto, el relleno o el margen de cada componente. Obtenga más información sobre la alineación y el relleno

    Captura de pantalla que muestra la pestaña de configuración de los componentes de contenido del correo electrónico Designer. {modal="regular"}

  5. En el menú avanzado de su Contenido en el panel derecho, elimine o duplique cualquier componente de contenido según sea necesario.

Contenedor container

Puede añadir un contenedor simple dentro del cual añadir otro componente de contenido. Esto le permite aplicar un estilo específico al contenedor, que es diferente al componente utilizado dentro de.

Por ejemplo, agregue el componente Contenedor y el componente Botón dentro de ese contenedor. Utilice un fondo específico para el contenedor y otro para el botón.

Captura de pantalla que muestra cómo agregar un componente de contenedor en el Designer de correo electrónico. {modal="regular"}

Botón buttons

Utilice el componente Botón para insertar uno o varios botones en el correo electrónico y redirigir el público de correo electrónico a otra página.

  1. En la lista Contenidos, arrastre y suelte el componente Botón en un componente de Estructura.

    Captura de pantalla que muestra cómo arrastrar y soltar un componente de botón en el Designer de correo electrónico. {modal="regular"}

  2. Haga clic en el botón que acaba de agregar para personalizar el texto y acceder a las fichas Configuración y Estilos.

    Captura de pantalla que muestra la pestaña de configuración de los componentes de botón en el Designer de correo electrónico. {modal="regular"}

  3. En la ficha Configuración, en el campo URL, agregue la URL a la que redirigir al hacer clic en el botón.

  4. Elija cómo se muestra el contenido mediante la lista desplegable Target:

    • Ninguna: abre el vínculo en el mismo marco en el que se hizo clic (predeterminado).
    • En blanco: abre el vínculo en una nueva ventana o pestaña.
    • Propio: abre el vínculo en el mismo marco en el que se hizo clic.
    • Principal: abre el vínculo en el marco principal.
    • Superior: abre el vínculo en todo el cuerpo de la ventana.

    Captura de pantalla que muestra las opciones de destino de los componentes de botón en el Designer de correo electrónico. {modal="regular"}

  5. Personalice aún más el botón cambiando atributos de estilo como Borde, Tamaño, Margen y otros de la pestaña Estilos.

Texto text

Use el componente Texto para insertar texto en el correo electrónico y ajustar el estilo (borde, tamaño, relleno, etc.) con las fichas Configuración y Estilos.

  1. En el menú Contenido, arrastre y suelte Texto en un componente Estructura.

    Captura de pantalla que muestra cómo arrastrar y soltar un componente de texto en el Designer de correo electrónico. {modal="regular"}

  2. Haga clic en el componente que acaba de agregar para personalizar el texto y acceder a las pestañas Configuración y Estilos.

  3. Cambie el texto con las siguientes opciones disponibles en la barra de herramientas contextual:

    Captura de pantalla que muestra la barra de herramientas de edición de texto en el Designer de correo electrónico. {modal="regular"}

    • Cambiar estilo de texto: aplique negrita, cursiva, subrayado o tachado al texto.
    • Cambiar alineación: elija entre alineación a la izquierda, a la derecha, al centro o justificada para el texto.
    • Crear lista: agregue listas de viñetas o números al texto.
    • Definir encabezado: añadir hasta seis niveles de encabezado al texto.
    • Tamaño de fuente: seleccionar el tamaño de fuente del texto en píxeles.
    • Editar imagen: añadir una imagen o un recurso al componente de texto.
    • Mostrar el código fuente: mostrar el código fuente del texto. No se puede modificar.
    • Duplicar: añadir una copia del componente de texto.
    • Eliminar: eliminar el componente de texto seleccionado del correo electrónico.
    • Añadir personalización: añadir campos de personalización para personalizar el contenido de los datos de perfiles.
    • Habilitar contenido condicional: agregue contenido condicional para adaptar el contenido del componente a los perfiles de destino.
  4. Ajuste otros atributos de estilo, como el color del texto, la familia de fuentes, el borde, el relleno, el margen y otros, en la ficha Estilos.

    Captura de pantalla que muestra la pestaña de estilos de los componentes de texto del correo electrónico Designer. {modal="regular"}

Divisor divider

Utilice el componente Divisor para insertar una línea divisoria y organizar el diseño y el contenido del correo electrónico.

Puede ajustar atributos de estilo como el color, el estilo y la altura de la línea desde la ficha Estilos.

Captura de pantalla que muestra cómo agregar un componente divisor en el Designer de correo electrónico. {modal="regular"}

HTML HTML

Use el componente HTML para copiar y pegar partes de su HTML existente. Esto le permite crear componentes modulares de HTML gratuitos para reutilizar contenido externo.

  1. En Componentes, arrastre y suelte el componente HTML en un componente de Estructura.

    Captura de pantalla que muestra cómo arrastrar y soltar un componente de HTML en el Designer de correo electrónico. {modal="regular"}

  2. Haga clic en el componente recién agregado y, a continuación, seleccione Mostrar el código fuente de la barra de herramientas contextual para añadir el HTML.

    Captura de pantalla que muestra la opción de código fuente para los componentes de HTML en el Designer de correo electrónico. {modal="regular"}

NOTE
Para que el contenido externo sea compatible con Email Designer, Adobe recomienda crear un mensaje desde cero y copiar el contenido del correo electrónico existente en los componentes.

Imagen image

IMPORTANT
El acceso al menú de Assets está limitado a los usuarios con una licencia activa de Adobe Experience Manager as a Cloud Service. Si no dispone de esta licencia, el menú Assets no estará disponible.

Use el componente Image para insertar un archivo de imagen del equipo en el correo electrónico.

  1. En el menú Contenido, arrastre y suelte Imagen en un componente Estructura.

    Captura de pantalla que muestra cómo arrastrar y soltar un componente de imagen en el Designer de correo electrónico. {modal="regular"}

  2. Haga clic en Examinar para elegir un archivo de imagen de sus recursos. También puedes elegir Importar tus medios.

    Para obtener más información sobre cómo cargar y agregar recursos en Adobe Experience Manager, consulte Documentación de Adobe Experience Manager as a Cloud Service.

    Captura de pantalla que muestra la opción de examinar componentes de imagen en el correo electrónico Designer. {modal="regular"}

  3. Desplácese por las carpetas para localizar el recurso específico que necesita o utilice la barra de búsqueda para encontrarlo de forma eficaz.

    Cuando encuentre el recurso que busca, haga clic en Seleccionar.

    Captura de pantalla que muestra el proceso de selección de recursos en el Designer de correo electrónico. {modal="regular"}

  4. Haga clic en el componente que acaba de agregar y configure las propiedades de la imagen con la pestaña Configuración:

    • Título de imagen le permite definir un título para su imagen.
    • Texto alternativo permite definir el pie de ilustración vinculado a la imagen. Esto corresponde al atributo HTML alt.

    Captura de pantalla que muestra la pestaña de configuración de los componentes de imagen en el correo electrónico Designer. {modal="regular"}

  5. Añada un vínculo para redirigir a la audiencia a otro contenido. Más información

  6. Ajuste otros atributos de estilo como margen, borde y otros mediante la ficha Estilos.

Social social

Utilice el componente Social para insertar vínculos a páginas de redes sociales en el contenido del correo electrónico.

  1. Desde el menú Componentes, arrastre y suelte el componente Social en un componente de Estructura.

  2. Haga clic en el componente recién añadido.

  3. En el campo Social de la pestaña Configuración, elija los medios sociales que desea agregar o quitar.

    Captura de pantalla que muestra la pestaña de configuración de los componentes sociales del Designer de correo electrónico. {modal="regular"}

  4. Elija el tamaño de los iconos en el campo Tamaño de las imágenes.

  5. Haga clic en cada uno de sus iconos de redes sociales para configurar la URL a la que se redirige su público.

    Captura de pantalla que muestra la configuración de URL para los iconos de medios sociales en el Designer de correo electrónico. {modal="regular"}

  6. Cambie los iconos de cada uno de los medios sociales si es necesario en el campo Source.

  7. Ajuste otros atributos de estilo como estilo, margen, borde y otros en la ficha Estilos.

recommendation-more-help
c39c2d00-ba9a-424b-adf9-66af58a0c34b