# Creando Plantilla de Correo

Las plantillas de correo electrónico son modelos listos de mensajes utilizados para la comunicación electrónica. Están estructuradas para facilitar el envío de correos recurrentes, manteniendo el mismo diseño, estilo y formato de mensaje. **Con ellas, es posible personalizar tu plantilla de correo**, haciendo la comunicación más eficiente y profesional. Estas plantillas se usan ampliamente en marketing, atención al cliente, ventas y otros contextos que requieren una comunicación consistente. Ayudan a ahorrar tiempo, mejorar la eficiencia y mantener una apariencia profesional, sin importar cuántos correos se envíen.

### ¿Qué necesitas antes de comenzar? <a href="#h-o-que-voce-precisa-antes-de-comecar" id="h-o-que-voce-precisa-antes-de-comecar"></a>

Antes de crear tu plantilla de correo, es importante asegurarse de que algunos requisitos previos estén en orden para que el proceso sea rápido y sin complicaciones. **Personaliza tu plantilla de correo** de forma eficiente y prepara todo para garantizar un resultado profesional. Consulta nuestra lista de verificación:

* Tener una conexión de **DNS activa**: [cómo configurar el correo en Hablla](https://hablla.com/como-configurar-o-e-mail-no-hablla/);
* Tener un usuario con perfil **administrador**.<br>

### Primer paso: accediendo al área de creación de plantillas para personalizar tu plantilla de correo <a href="#h-primeiro-passo-acessando-a-area-de-criacao-de-templates-para-personalizar-seu-template-de-e-mail" id="h-primeiro-passo-acessando-a-area-de-criacao-de-templates-para-personalizar-seu-template-de-e-mail"></a>

1\. Para crear una plantilla de Correo, conecta tu cuenta y accede a [**Studio**](https://studio.hablla.com/workspace/643d802021b6aa9234eb9797/marketing?fbp=fb.1.1753742035820.5658395625\&sck=730218fd-da2e-40d1-b6a8-b13deea06044\&external_id=730218fd-da2e-40d1-b6a8-b13deea06044). En la esquina superior derecha de la pantalla, junto a la inicial de su nombre, encontrará el ícono de **Configuraciones** (engranaje). Haga clic en él para abrir el menú de configuraciones.&#x20;

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdfqtBDMn-eSG0onjRrHhayvmTE5mihvbvtBQ0RRScXLDr7PoZ1LYE6gOtmhzv64Ze75DuIEb9yN2qvresKBGCN91Zl1XR5hT5Xih3gVGHQxlcM2DYo8cEJoFyOiH6MfMa_X5WCV3BMG0w3ed4F4qbsFqOp?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. En el lado izquierdo de la pantalla en el menú de **Configuraciones**, localiza la sección **Conexiones e integraciones**.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdT0791UrezMJc14jlLsiZyM5m2w17Z2yLlZA3r3nWwy9qB8Y1nXtDNklEZHO-ySQDRKrp-fnu4mjbK8aj0dMeSdrakhlPZ-UYI3GWeEYWkwh0R7TLqW8MMk-i0Tj65y1xt_YuVQt2S_w6iYPKiwOFD7xAJ?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

3\. Selecciona la conexión de **Correo electrónico**.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdIYjgEF_TiQrT4ik7wDT6Z1yYtgXorCYVE9STwcO2AYYDUE2osBi_cO_ZrOnuDG5LVH7JdHUrfiT4ugna4tpmhHDBG55WORCWZ20s7MW71Z1V6hO9C1O9r480JBPewBIOu4S9FCmNHFc0Pbq3Jtohub0b7?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

4\. Elige la dirección de correo en la que se creará la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXe3EY9u6gqxVdjOFumpC0wlOI4_tmby4-2QEc2DnDv9npXxVnwCZPUfYp0xLyjOZTzIGPVWTc2UUlqhPkRRm93G30qa-i9y_xBluXBjLIarQnOsoS15Z1gXXIhFAiXpknRpcmZk5B-1HvL5QXpiqVLc42zr?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

5\. En el submenú, selecciona la opción **Modelo de Mensaje**.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcIbPL8XbsEaKM_13q82vP_epCKyY4MPgNZLpCxtG_JJTF0ldekOjOD52qajSkxJEu3DGLKZOFkJI-59Wlt2a7ABSOSaGB-QRCuyRbY3ep-KlSjicAmYpbwA8PpQPOe7vfHXcqvdM3C35Xxeqlh61ijiw2_?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

6\. En el lado derecho haz clic en el botón **+ Crear nueva plantilla**.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXeDvtDPi7v5zmabwq4lEQMjjP72P25o36uN_rFwzPhZdnV5e8Cp7BeS5j16PwT5yDdowLBMI1ilwSLZdsG6KipEfu_aohW8NcA6FwEWyJ3Z3-AM--PB4gkmxkqq8wScsZePXKs9Wvm3XM3LD2x6RfNcxc8?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

7\. Serás dirigido a la pantalla de creación de la plantilla de correo, donde encontrarás campos como **Nombre del Modelo** y **Asunto**. Completa estos campos para iniciar tu plantilla.<br>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/image-1024x460.png.webp" alt="" height="460" width="1024"><figcaption></figcaption></figure>

### Cómo agregar columnas <a href="#h-como-adicionar-colunas" id="h-como-adicionar-colunas"></a>

1\. Para agregar columnas, haz clic en el elemento de columnas y arrástralo hasta el lugar deseado en la plantilla.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/unnamed-9-1024x511.png.webp" alt="" height="511" width="1024"><figcaption></figcaption></figure>

2\. Para configurar las columnas después de agregarlas, accede a la pestaña lateral derecha y selecciona **Columns**. En esta sección, puedes ajustar la división de las columnas según desees, personalizando el diseño de tu plantilla.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-10-31-142236-1024x471.png.webp" alt="" height="471" width="1024"><figcaption></figcaption></figure>

3\. En la pestaña lateral derecha, accede a **Blocks** para insertar bloques predivididos en columnas, facilitando la organización y estructuración del contenido.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/unnamed-1024x508.png.webp" alt="" height="508" width="1024"><figcaption></figcaption></figure>

4\. En **Column Properties**, puedes personalizar la cantidad de columnas, ajustar el color de fondo, el tamaño del relleno, además del grosor, color y estilo del borde.<br>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/image-1-1024x460-1.png.webp" alt="" height="460" width="1024"><figcaption></figcaption></figure>

4\. En **Row Properties** puedes configurar la fila en la que está esa columna. Es posible definir el color de fondo de la fila, el color de fondo del contenido, agregar una imagen de fondo y definir el relleno.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-11-154617-1024x457.png.webp" alt="" height="457" width="1024"><figcaption></figcaption></figure>

5\. En la sección **Responsive Design**, puedes ajustar las configuraciones para que el diseño se adapte automáticamente a diferentes tamaños de pantalla, garantizando que tu plantilla tenga un excelente aspecto en dispositivos móviles y ordenadores de sobremesa.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcjxxNMYdaN8nopjmfnSQp_C29alJfd7eP4nHPIIB9tO4KbbGAdC2gL_-SJx7dmYg7b5fRiHYrgF6aY_xgcDbW9pBmjjzjgO5ekQSkZiEwxoZnInhV8AJes1Lbgge-lDkvRlkFGnw85_bD_z3YCMg1dhrVN?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Cómo añadir botones a tu correo <a href="#h-como-adicionar-botoes-ao-seu-e-mail" id="h-como-adicionar-botoes-ao-seu-e-mail"></a>

1\. Para agregar botones, haz clic y arrastra el elemento, llevándolo al campo de edición.<br>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcQY2eth05A3wSJWczkSUegXTbuqkx4yPfK5NB9dFmvmEdAZInESDN75K8fnlp_xTu_r9w9YDl7dm8tacdQw1V1z5Wb0xvMhaEWuxJsvUATDqw1Zn18i6ApXcE2keTnsfLs6IYM0JMD4SBgT2OFcNMbVCs?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Al añadir el botón, configúralo en la pestaña lateral derecha. En **Action**, define la acción que el botón debe realizar y los detalles necesarios. Por ejemplo, si la acción es **Abrir Sitio Web**, basta con insertar el enlace del sitio deseado.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/unnamed-2-1-1024x506.png.webp" alt="" height="506" width="1024"><figcaption></figcaption></figure>

3\. En **Button Options** es posible cambiar el color y el tamaño del botón, definir el color, el tamaño y la fuente del texto del botón, el espaciado de las líneas y las letras.<br>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXeJJk6KvJbqIC2t-lk8LuSjL32RU-QRcPS8Mf4BKGfCIXLZ-iUdneyjrTc1cgbcUxExU_iuuHW8lSjtzZZGTdODwNId16FyAx9dQRteJWdnxYs-rZUHtUmjfN_wTIhqspCOQfK1MpH9HUJ14wcyjMeX2L0?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdT4EnP0NKZbnboL7CVxQkPTMC3Vg4zx8au7aJowiDVY11uEXtH4isEVGeiTXlo6RAYKnBL14WYD2i6LlRiWXnGdmR0Jn9ZQTj6rMv2G8byiISLVNiLZ6wOFOmGF-4uFOMhcbGEFqJ5_K_qzetNmdHmGY0?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

4\. En **Spacing**, puedes definir la alineación y el tamaño del botón, el grosor y trazo del borde y añadir bordes redondeados.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXflpea9RtvfNQBExgkIWaduePNU7-1xvI75tUX8AzqQs0Fl57NhhZ-1v6spmNa8pKagKfSaxbbO-iqpWfXLd_W6cyvL6rwBYhihnhzqYf0UpPPp8a-nYvesYOWAx_EtQ8tdgARnyHZ8FQqq79d0bKI6vSOj?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcY_4cFPhHYS3svajLzS8h-6s3NgjPRZvtsR8mbptl8IYS9RXc0GXkSdm6K6JP5AKw_VKXe6YpXI00jY3lbw0S1IiMcHUe_vKGbPOKBjA9StiUqf_X53yp4cUCgXvrq1VFB3G0Z_rwp_u0Gy1mCxlgBK9J7?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

5\. En la pestaña **General**, ajusta el tamaño del contenedor que alberga el botón.&#x20;

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdUcdacXKq6ceqm1ft6hgii-2R6l6TsQGYZ3C8fiQzUwAHFKFfJIZBRpXFPVrVMdYc6ZFpZ0lrUgkM9Gzp8NgWDx91lm7IMg3u8Fb45YacGI-b-A1neZ9JtZsBB3KQYkFtrl3BL4in_Xh45155m0NYVqK2n?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Agregar divisor <a href="#h-adicionar-divisor" id="h-adicionar-divisor"></a>

1\. Para agregar divisores, haz clic y arrastra el elemento, llevándolo a la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXd3hyfgyDjBXGl_M5hk3EsmH_Sz0jKNqCYW-FPHaOAg86XkP3OFQxQxN8lX5KQLlH33scXUx2AHiHp0Blzb2FGEIQggmuI-qjP0tzgvZ4U0NdVX1EW9_57Yj0zRhYt_6-DwUeu6z54XBTJxerc_Tm9RL37P?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Una vez añadido, puedes configurar el divisor en la pestaña que se encuentra en la lateral derecha. En **Line** es posible cambiar el tamaño, el grosor, el trazo y la alineación del divisor.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdRXt_rCDmqN6NdPMHX8tWW5yb4ne5avhf6YaMVKG297TaA_RAAYk1vWAJQmSlPw-DcEojtsRBhGCJUKRTauAJK8hLCz6a7FatlQeYVhRGUVVu2yxDTYUb7Farhh0hCuO4wC0SnwwiHfkN0IFfpkYbADlLX?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Agregar encabezados <a href="#h-adicionar-cabecalhos" id="h-adicionar-cabecalhos"></a>

1\. Para agregar encabezados, haz clic y arrastra el elemento, llevándolo a la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcMQ_GyCbn84bgn8UrwrzOMjcfgawfLn1uASLSMay00yEgZkg_lgZpNUhDheXjIddd70hiciqscHFleqrPucyyO_y0w-bMSFFKekK8VXaoDI1I_04iInVmd_srex-mzhuQFjV2Zyf4YyFVZ7LyEvi3haeUW?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Una vez añadido, puedes configurar el encabezado en la pestaña que se encuentra en la lateral derecha. En **Text** es posible definir el tipo de encabezado, la fuente, el tamaño, el color, la alineación del texto, la altura de línea y el espaciado de las letras.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXfsQp4IJyMI_ZKonz4Lw_gFeaLLKVpbAgRrNMkZUlgnhz-IwlPh94v7lc-NEYcYa0PYERZ1cTq0rVxpqFQCInV2y1EyV8Y-zJVnKHN2uoZThArOHK5OkiLa3A8wDPk4UwXZ0A4rz_MRuxo5TQwqNIvePY0?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdNNgqSm3R7dJEeD1CR2mvFngBmqdV5CTH79pXbfWNqzmO72r0FJv8pg8OWGZBuTpVvE_eZ7CV1Aeyc8_-W658Y6SiUvH64GZyW8b_iUMFrGg4ro_LxQf4OaHlyypgV4Gx7Jk-fVlJAKchGh53v_9HK8af6?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

3\. Para insertar un enlace en tu texto, haz clic y selecciona la palabra o frase donde deseas el enlace, luego encuentra el icono de enlace (generalmente una cadena) en la barra de herramientas, pega la URL deseada y confirma. ¡Listo! El enlace estará activo en el texto.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-11-164746-1024x455.png.webp" alt="" height="455" width="1024"><figcaption></figcaption></figure>

### Agregar texto <a href="#h-adicionar-texto" id="h-adicionar-texto"></a>

1\. Para agregar texto, haz clic y arrastra el elemento "Texto" a la plantilla en la posición deseada. ¡Después, solo suelta y comienza a escribir!

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXeATFnpfT4cfmX49IZKfRtXMpsAkqedGjQBhCl3bf8ELSgWtVhQ28AVrWpbhVBrmVrLkI1yGaAzZuzr6ec8KX4UBt0iFMLj3gdglYlAYv4N1diTZyu0WgkmV16Z9uheJeEtI4qPsIDLj7StE2QW8CCD7BPI?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Una vez añadido, puedes configurar el texto en la pestaña que se encuentra en la lateral derecha. Las configuraciones de texto son las mismas que las configuraciones de encabezado.

### Agregar imágenes <a href="#h-adicionar-imagens" id="h-adicionar-imagens"></a>

1\. Para agregar imágenes, haz clic y arrastra el elemento, llevándolo a la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdOsSRhIvRmJRWvuZPcoAdXgOPvLM400RoGO9nZUhvOHeAiwagieUSXsKBF3fFPZSMz7NwSnvgvuUAU1TUVKmyjV1lVMc8pXl7ndCoIq9rPGYwr6EN14Sbn1lwEPx66GpHpD6UVJ6aigWaCMD-_mxVN750?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Una vez añadido, puedes configurar la imagen en la pestaña que se encuentra en la lateral derecha. En **Imagen** es posible subir la imagen, añadir el enlace de la imagen, definir su tamaño, alineación y texto alternativo.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-11-170659-1024x455.png.webp" alt="" height="455" width="1024"><figcaption></figcaption></figure>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-11-170929-1024x460.png.webp" alt="" height="460" width="1024"><figcaption></figcaption></figure>

### Agregar iconos de redes sociales <a href="#h-adicionar-icones-de-redes-sociais" id="h-adicionar-icones-de-redes-sociais"></a>

1\. Para agregar iconos de redes sociales, haz clic y arrastra el elemento, llevándolo a la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcex07HVPDXgCFbSr04qbJJ9sFM_o81fPy7PmSRnVTmIQG2cQ71bkJcA77CRDTQE4QKkfd8D4PHz9MvngR8CUGqRvsSTCMJqY79f94W1Dox_Fcv-yX5v-4moHRa7rM7kuMPEZQCYAIF9-b8T3yXn_hJpes?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Una vez añadido, puedes configurar los iconos en la pestaña que se encuentra en la lateral derecha. En **Icons**, es posible seleccionar los iconos que desees, cambiar su forma, vincularles un enlace y definir su tamaño, espaciado y alineación.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcxboA78mwDySoBzfxFk8chKzgRzBFOVslzyR7PvBP8i6KzGx8ezOkK5qlNI50-GFHwvIM-hRSCq9nbAJVZVgQfVR9tNK8YrM2jw_48f1LLYo9wBK-WMIBT-GrOWWuookg_UF0-n-00f83DRO6GYNsl5k1V?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Agregar menú de navegación <a href="#h-adicionar-menu-de-navegacao" id="h-adicionar-menu-de-navegacao"></a>

1\. Para agregar un menú, haz clic y arrastra el elemento, llevándolo a la plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXf3YEf6ljEu8QL_AuJvVpcgGJEPM0MhZ0ZTnA46tcTeYobY6CuSePs60A1LK3CopKkLhsP26yz1P_cFMhMHa_Nruyq89ck3CgodpZbQ5QA-6hmBV0XQhH81co2cPqrbvD_E5IzMVKkNgGWm2waZGERAy4S4?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Usa el Menú para crear opciones de navegación en tu plantilla. Puedes añadir **enlaces** a diferentes páginas, configurar un botón para envío directo de **correo** o incluso un botón que permita al usuario llamar a un **número específico**.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-110452-1024x459.png.webp" alt="" height="459" width="1024"><figcaption></figcaption></figure>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-111048-1024x453.png.webp" alt="" height="453" width="1024"><figcaption></figcaption></figure>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-111157-1024x455.png.webp" alt="" height="455" width="1024"><figcaption></figcaption></figure>

3\. Personaliza tu Menú en Styles. En la sección **Styles**, puedes ajustar la fuente, tamaño, color del texto y el espaciado de las letras en tu Menú. Además, es posible elegir la alineación, definir un separador entre los ítems, configurar el diseño del menú y personalizar el color de los enlaces.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-111653-1024x453.png.webp" alt="" height="453" width="1024"><figcaption></figcaption></figure>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-112146-1024x452.png.webp" alt="" height="452" width="1024"><figcaption></figcaption></figure>

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/Captura-de-tela-2024-11-12-112258-1024x450.png.webp" alt="" height="450" width="1024"><figcaption></figcaption></figure>

### Agregar código HTML <a href="#h-adicionar-codigo-html" id="h-adicionar-codigo-html"></a>

1\. Haz clic y arrastra el elemento **HTML** a la plantilla en la posición deseada. Esto te permitirá añadir **HTML** personalizado al diseño, creando elementos únicos y adaptados a tu estilo. ¡Después de soltar, solo pega el código deseado!

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXe-XtZg70hbyP_JlZ4_Ids8k3CDpGzqof_7jokTjBtup4r9wS4MsKSY3lgNjjj-PusOwc4gJAkbWn7b0vNvVRT3AYkmDy08YVKCq5wPoTKX8jrl-jef3RygAQOWFa2o8RbDftaM28ekEFQ5liGr8apEyOs8?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Después de añadir el elemento **HTML** a la plantilla, ve a la pestaña lateral derecha para hacer ajustes. En esta sección, puedes insertar el código que desees, adaptando el diseño con el contenido **HTML** personalizado.

<figure><img src="https://hablla.com/wp-content/uploads/2024/11/unnamed-3-1024x510.png.webp" alt="" height="510" width="1024"><figcaption></figcaption></figure>

### Configurar cuerpo de la plantilla <a href="#h-configurar-corpo-do-template" id="h-configurar-corpo-do-template"></a>

1. En el Menú lateral **Body** es posible configurar todo el cuerpo de la plantilla. Al acceder al submenú **General**, es posible definir el color del texto y del fondo, el tamaño y la alineación de los contenedores, además de personalizar la fuente y el tamaño del texto de toda la estructura del correo.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcruHbkb-tL3YV_CclRAZsqNnwy9dpklfl6SRbj7pIJJOfersX2E9ykdgwKsxxGkYNKbf2qIkRsNgZf5a1Mu5GL-r9p6bCHpJVgwqiEXkdh_JhVGx_qy07_s5UBPMqbutZLFH7YDdBefPv2tJZVbGpD6EBu?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Duplicar o eliminar  <a href="#h-duplicar-ou-deletar" id="h-duplicar-ou-deletar"></a>

1\. Para eliminar una fila, haz clic en el primer icono debajo de ella. Para duplicar, haz clic en el segundo icono. Estas opciones facilitan la edición rápida del diseño de tu plantilla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXdIuMWVE1fJpIAZ8DlVjTCpRJS1m8t1SVpFLl7asoouuNH0lWmTO4RGrMqR7dIg5PnIE31n1hI9Q8IWFNRTiZ4W9Lo2MnqXujOLmPBrrwmZ1WhBXv0ZVtO2Xx6JzZ88slPLVo-h-vUgkqZYN1U5gjDL79B0?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Para crear una copia de la plantilla, basta seleccionar el icono indicado para duplicación y, a continuación, renombrar la copia según desees. Esto te permite mantener el original y hacer ajustes en la nueva versión

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcuCNBbYBUp4Imlyrv_0R_T5m-RuEQQcWVZfy8mDPNi9Px9E0ZUlib8kJ8g4VkB8cg1edo8t-IYYQ99Kez0J07n4lVJ1sqB1P4i07XOntgl5zno7nm-z3TjVrBZOfcoT_p3fh8WdRMe8_p5dCxM9T6qQVg?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXd9xTnsOsivskn58BrN_1vzCKbsAgdSQj-rNTIJsBBLXB90ZmgbD9OzmUC4jfqNkBhaZHopoJCTIZMCHblkouZXcdBLo9gpdmQdOPhUUIU1d5GuJ4H6tJ26eNut_EMo9k6l4mBLIouiYm8c0XO7yBqGavw?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

**Atención: una vez creada, la plantilla no puede ser eliminada. Por lo tanto, revisa bien antes de finalizar para garantizar que todo esté conforme a lo esperado.**

### Móvil <a href="#h-mobile" id="h-mobile"></a>

¿Quieres ver cómo queda tu plantilla en el celular? ¡Es fácil! Solo haz clic en la opción **Móvil** en la pestaña a la derecha o en el icono de celular en la esquina izquierda. Inténtalo ahora y ve cómo el diseño se adapta a pantallas más pequeñas

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXcrUtwYQiKBe7WVMtd-w7vhyHpE5kJ09RloMssIku7pyH3mevBpGrCnObAGxsdqSt7fvcErL8btc3QEby8pYPaebIGD8PeB03lFZcck_cxtrFooKnzrcmMkOzfRHuA5s1r_80BQLupTO-G0g3zXE1IgaLs_?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### Vista previa <a href="#h-visualizacao" id="h-visualizacao"></a>

1\. Para ver cómo quedará tu plantilla, solo haz clic en el icono indicado. Así, puedes comprobar todo antes de finalizar.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXe5nnmskfyjF_tDV1ExyuE2Xeq5pFu3IjGsMatzegrntURrcxXTv1xmpSMIDkrGcsAN7mxLCFBLAmFZLSQIURueVKly9XyhhrxBongAVVbxr4evnvpWwhlzeU7NaeWSEAsVEoVZz4bydladbYE-RrKAnyY?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

2\. Para ajustar la vista previa, puedes seleccionar el tipo de dispositivo (como ordenador, tablet o celular) en el que deseas ver la plantilla. Esto ayuda a garantizar que el diseño quede perfecto en cualquier pantalla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXfarH-gvECUhyNc1eiKj1uer775X1OJ86WhDma2tvaarOw50LR4cwwUk6gjIUfEJFNWVnOfjh0EjcVEZ_EtxL7O79NJrEN3xUw_HLsB7yOy0wSAYB-gmqduQ7zulioTVBs_BG7znII_T9V-YET44z7alQv7?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

### **Guardar** <a href="#h-salvar" id="h-salvar"></a>

Tan pronto como la plantilla esté lista, selecciona **Guardar** para guardarla.

<figure><img src="https://lh7-rt.googleusercontent.com/docsz/AD_4nXc27MVcMh2IT-GejKfXr0Jzci0T26VIjiCAbqFh24yKYEkXtfR0L2JBDHEKn8RGP-jYhhNacz5pop3XnhxkAt6HGC8eVeMJgmd8t11KpZJz1hWTyGnuSmXxTRc7xWwlF_vYEAgnYh5AdcEtykUpAaeRbqOc?key=Sp-RNwjUlp2DKxVupAy8fDiR" alt=""><figcaption></figcaption></figure>

**¡Comienza ahora a personalizar tu plantilla de correo!**

Ahora que conoces todos los submenus disponibles y cómo puede utilizarse cada uno, es hora de explorar y poner tu creatividad en práctica. **Personaliza tu plantilla de correo** con facilidad, realizando ajustes simples y visualizando los cambios en tiempo real. Recuerda guardar tu progreso a lo largo del camino y probar la versión móvil para garantizar que tu plantilla esté perfecta en todos los dispositivos.

Con estas herramientas, tienes todo lo que necesitas para crear un correo increíble, funcional y alineado con tu marca. ¡Diviértete y personaliza tu plantilla hasta que quede exactamente como deseas!
