Usar módulos predeterminados en tu plantilla

Este es un resumen de todos los módulos predeterminados disponibles para plantillas de arrastrar y soltar en las herramientas de diseño. Cada tipo de módulo se puede personalizar en el inspector con opciones de estilo y contenido. También puedes agregar un módulo predeterminado a una plantilla HTML con su fragmento de HubL. 

Agregar un módulo a tu plantilla

Para agregar módulos a tus plantillas de arrastrar y soltar, haz clic en + Agregar en el inspector del lado derecho del editor. Todos los módulos predeterminados y los módulos o grupos personalizados guardados aparecerán aquí. Para encontrar un módulo específico, escribe su nombre en la barra de búsqueda. También puedes hacer clic en el menú desplegable Filtrar por categoría o etiquetas y selecciona uno o más filtros.

Cuando se selecciona el módulo en el editor, puedes modificar los estilos, la configuración y el contenido del módulo en el inspector. Haz clic en HTML de relleno para agregar más estilos personalizados en el editor de código.

En la parte inferior del inspector, puedes bloquear el módulo para que los usuarios no puedan modificar el contenido predeterminado al editar un blog, correo electrónico o página. Haz clic para activar el interruptor Evitar la edición en editores de contenido para habilitar esta configuración.

Personalizar un módulo predeterminado

Todas las cuentas de Marketing Hub Pro y Enterprise y CMS Hub Pro y Enterprise tienen una carpeta @hubspot en el administrador de diseño por opción predeterminada. Esta carpeta contiene todos tus temas y módulos predeterminados, incluidos los módulos de arrastrar y soltar. Estos temas y módulos son de solo lectura, pero pueden clonarse si quieres editarlos. 

• En tu cuenta de HubSpot, dirígete a Marketing > Archivos y plantillas > Herramientas de diseño.
• En el buscador, haz clic en la carpeta @hubspot.
• Haz clic en el módulo predeterminado que deseas clonar, luego selecciona Clonar módulo. 
  
  
• En el módulo clonado, edita el código fuente del módulo en el panel central de edición.
• Para guardar tus cambios, en la parte superior derecha, haz clic en Publicar cambios. El módulo estará disponible para su uso al crear plantillas.

Tipos de módulos predeterminados

Cancelación de suscripción con copia de seguridad

La plantilla de cancelación de suscripción con copia de seguridad se muestra a los destinatarios de correo electrónico que hacen clic en un enlace de cancelación de suscripción si HubSpot no puede determinar su dirección de correo electrónico. Puedes personalizar el texto de ayuda que aparece en tu página de cancelación de suscripción con copia de seguridad en la sección Contenido predeterminado de este módulo. 

Comentarios del blog

Nota: el módulo de comentarios del blog no está disponible para las plantillas de página o correo electrónico. 

El módulo de comentarios del blog agrega una sección de comentarios a tus plantillas para publicaciones del blog. Puedes personalizar el formulario de comentarios del blog en tu herramienta de formularios. El formulario tendrá un nombre según el título de tu blog.

Contenido del blog

Nota: el módulo de contenido del blog no está disponible para las plantillas de página o correo electrónico. 

El módulo de contenido de blog contiene el formato HTML/HubL tanto para tus publicaciones de blog, como para tus páginas de listados de blog. Puedes editar la marcación de los posts haciendo clic en Editar plantilla de post y editar el formato de la página de listados haciendo clic en Editar plantilla de listado. Más información sobre el formato del módulo de contenido del blog.

Suscripción a los correos del blog

Nota: el módulo de suscripción de correo electrónico del blog no está disponible para las plantillas de correo electrónico. 

El módulo de suscripción de correo electrónico del blog permite que los visitantes se suscriban a tus correos electrónicos de resumen del blog llenando un sencillo formulario. Este módulo se completa con el formulario de suscripción de tu blog, que se puede personalizar en la herramienta de formularios.

Haz clic en el menú desplegable Selecciona el blog que se mostrará y selecciona el blog al que se suscriben tus visitantes. En el cuadro de texto Título para mostrar arriba del formulario, personaliza el texto que aparece en el título encima del formulario. Coloca el cursor sobre la respuesta en línea existente y haz clic en el expand icono expandir para personalizar el texto que aparece después de que un visitante envía el formulario.

Llamada a la acción

Un módulo de llamada a la acción (CTA) coloca una CTA en su propio módulo dentro de tu diseño. También puedes insertar una CTA en un módulo de texto enriquecido.

En el inspector, haz clic en CTA.  menú desplegable   y selecciona una CTA predeterminada para este módulo en tu plantilla. O haz clic en + Crear nueva CTA en el mismo menú para crear una nueva CTA como la CTA predeterminada. 

Columna flexible

Pueden agregarse columnas flexibles a plantillas de página para que puedas agregar, eliminar y volver a ordenar módulos dentro del editor de contenido. Esto les proporciona a los creadores de páginas la flexibilidad de usar una plantilla para crear varios diseños de página. 

Cuando agregues un módulo de columna flexible a tu plantilla, puedes arrastrar y soltar otros módulos para crear un grupo de columnas flexibles. También puedes hacer clic en el botón derecho de un grupo estático existente y selecciona Convertir en columna flexible.

Sígueme

Nota: el módulo sígueme no está disponible para plantillas de correo electrónico. 

Puedes usar el módulo Sígueme para ayudar a tus visitantes a ponerse en contacto con tu empresa en las redes sociales. A diferencia de un módulo para compartir en redes sociales, los módulos Sígueme dirigen a los usuarios de tu sitio web a tus páginas de redes sociales.

Cuando agregues un módulo Sígueme, puedes personalizar el encabezado del módulo que aparece arriba de los íconos de redes sociales.

Puedes especificar las redes sociales que aparecerán en este módulo en la sección Sígueme de tu configuración de redes sociales.

Nota: el módulo Sígueme utiliza los iconos predeterminados para cada red social. Si deseas usar tus propios iconos de redes sociales personalizados, puedes crear una versión personalizada del módulo. 

Correo electrónico: Sígueme

Nota: este módulo está disponible solo para correos electrónicos creados en el editor de arrastrar y soltar. Puedes ubicar el módulo en el editor con el nombre Social.

El módulo de correo electrónico de seguimiento ofrece opciones de configuración y formato adicionales para plantillas de correo electrónico de arrastrar y soltar. Puedes ajustar la forma del icono de redes sociales, el esquema de colores y la alineación de tu módulo. También puedes agregar una cuenta personalizada de redes sociales y cargar tu propio icono en el editor.

Para editar las redes sociales que aparecen en este módulo, haz clic en el ícono + Agregar en la secciónRedes sociales del inspector. Coloca el cursor sobre el nombre de una red social y haz clic en el   edit editar ícono o r   delete eliminar  ícono t o hacer cambios.

Haz clic en el edit ícono editar para seleccionar la red social en la que aparecerá y la URL a la que conduce. Si seleccionas Icono personalizado, verás opciones adicionales para especificar una imagen personalizada para esta red. Haz clic en Reemplazar para elegir una imagen de tu herramienta de archivos o cargar una nueva imagen desde tu computador.

Formulario

Nota: el módulo del formulario no está disponible para plantillas de correo electrónico. 

El módulo de formulario te permite agregar un formulario a tu página o blog para captar información de contacto de los visitantes de tu sitio web.

Para este módulo, puede personalizar las siguientes configuraciones: 

1. Título del formulario: ingresa el título para tu formulario que aparecerá en la página o el blog.
2. Formulario: selecciona un formulario de HubSpot existente para que aparezca en la página o agrega un nuevo formulario.
3. ¿Qué verá un visitante antes de enviar tu formulario?: Elige si deseas redirigir a una persona que envía el formulario a otra página, o mostrar un mensaje de agradecimiento en línea en la misma página.
4. Mensaje de agradecimiento: personaliza tu mensaje de agradecimiento en línea.
5. Enviar notificaciones de formulario a direcciones de correo electrónico especificadas en lugar del formulario predeterminado: envía correos electrónicos de notificación de formulario a direcciones específicas. Esto anulará cualquier destinatario de notificaciones establecido en la herramienta formularios. 
6. Agregar a workflow: agrega visitantes que envían el formulario a un workflow (solo Marketing Hub Pro o Enterprise).
7. Enviar un correo de seguimiento: enviar hasta tres correos de seguimiento a visitantes que envíen el formulario.

Encabezado

Un módulo de Encabezado muestra una línea de texto en una etiqueta HTML de encabezado. Introduce el texto predeterminado del encabezado en la casilla Contenido del encabezado. Haz clic el menú desplegable Tipo de encabezado para seleccionar la etiqueta de encabezado (H1-H4).

Espaciador horizontal

El módulo de Espaciador horizontal crea una etiqueta div vacía que agrega espacio entre los elementos de una página.

Imagen

Un módulo de imagen agrega una sola imagen a un contenido. Más información sobre las opciones de edición de módulos de imagen. 

Galería de imágenes

El módulo de galería de imágenes agrega una serie de imágenes rotativas a un solo módulo. Más información sobre la configuración personalizable del módulo de galería de imágenes. 

Conmutador de idiomas

Nota: el módulo de selector de idioma no está disponible para plantillas de correo electrónico. 

El módulo del selector de idioma permite a los visitantes alternar entre versiones traducidas de una página o blog. Haz clic en el menú desplegable Modo de presentación para personalizar cómo se verán los nombres de tus idiomas traducidos

• IdiomaPág: el nombre de cada idiomas aparecerá en el idioma de la página actual. Por ejemplo, si estás viendo la versión en inglés de una página con una traducción al francés, cuando hagas clic en el conmutador de idioma, verás inglés y francés como los nombres de idioma. 
• Localizado: significa que el nombre de cada idioma aparecerá en dicho idioma. Por ejemplo, si estás viendo la versión en inglés de una página con una traducción al francés, cuando hagas clic en el conmutador de idioma, verás English y Français como los nombres de idioma.
• Híbrido: es una combinación de los dos. Por ejemplo, si estás viendo la versión en inglés de una página con una traducción al francés, cuando hagas clic en el conmutador de idioma, verás inglés (English) y francés (Français) como los nombres de idioma.

Este módulo solo aparecerá en páginas activas con más de una traducción publicada. Más información sobre cómo trabajar con contenido en varios idiomas en HubSpot.

Módulo de logotipo

El módulo de Logotipo extrae automáticamente el logotipo de tu empresa desde la configuración de contenido. Para usar un logotipo diferente, haz clic para activar el interruptor Anular el logotipo predeterminado para esta página para cargar una nueva imagen solo para esta página. Para cambiar el logotipo predeterminado de todo el contenido en la configuración de tu sitio web, haz clic en Editar logotipo predeterminado en este dominio.

Tu módulo de logotipo se enlaza automáticamente con el dominio de tu empresa. Para anular este valor predeterminado y el enlace a una página diferente, ingresa una URL de enlace única. 

Cuerpo principal del correo

El módulo del cuerpo principal del correo es un módulo de texto enriquecido estándar incluido de manera predeterminada en todas las plantillas de correo electrónico. Puedes personalizar el contenido predeterminado del cuerpo del correo electrónico en una plantilla determinada.

Además de las opciones de estilo estándar, este módulo se puede personalizar con colores predeterminados, bordes y espaciado. Haz clic en la burbuja de colores y selecciona un color del selector de colores o introduce un valor hexadecimal en el campo de texto para establecer colores predeterminados. Introduce los valores del píxel en los campos de texto Ancho del borde y Espaciado interno para establecer espacios predeterminados. 

Menú

El módulo de menú agrega navegación a tu contenido y plantillas. Los menús se crean y administran directamente en la configuración de tu sitio web. 

Dentro del administrador de diseño, puedes personalizar las siguientes características de tus módulos de menú:

1. Menú: selecciona uno de tus menús existentes en tu configuración de contenido.
2. Tipo de menú avanzado: selecciona cómo deben aparecer los elementos del menú en tu sitio web:
   • Estático: siempre muestra las páginas de nivel superior en el  menú. mantener el menú consistente en todas las páginas.
   • Dinámico por sección: muestra páginas del  menú  que están relacionadas con  la sección  que se está viendo: muestra elementos de menú relacionados con el elemento de menú de nivel superior que se está viendo. 
   • Dinámico por página: muestra páginas del  menú  que están relacionadas con  la página  que se está visualizando: muestra elementos de menú relacionados con la página específica que se está viendo.
   • Menú con estilo de ruta de acceso (utiliza flujo horizontal): muestra los elementos del menú de manera horizontal en una ruta de acceso relativa en la parte superior de tu sitio web.
3. Niveles máximos: el número máximo de elementos del menú secundario que se pueden mostrar.
4. Orientación: selecciona si los elementos del menú se muestran horizontalmente o verticalmente.
5. Activar controles flotantes: selecciona esta casilla de comprobación para mostrar los elementos de menú secundarios cuando colocas el cursor sobre la matriz. Borrar esta casilla de comprobación para mostrar siempre elementos del menú secundario.

Módulos

Los módulos creados en el editor de códigos te permiten usar HTML, CSS, Javascript y HubL para agregar funcionalidades avanzadas a tus plantillas, mientras que al mismo tiempo, le permite a tus profesionales del marketing editar contenido del módulo en los editores de contenido sin cambiar el código. Estos componentes se etiquetarán con un customModules icono de módulos en el buscador y en el inspector. Más información sobre cómo trabajar con módulos codificados personalizados en nuestra documentación de desarrollador.

Información sobre dirección de oficina

Este módulo incluye fichas obligatorias que se deben incluir en todas las plantillas de correo electrónico para enviar un correo electrónico de manera legal. Aunque puedes editar el formato de esta sección, no podrás guardar una plantilla de correo electrónico sin un módulo de información de ubicación de oficina o las etiquetas HubL  necesarias.  

Además de las opciones de estilo estándar, este módulo se puede personalizar con colores predeterminados, bordes y espaciado. Haz clic en la burbuja de colores y selecciona un color del selector de colores o introduce un valor hexadecimal en el campo de texto para establecer colores predeterminados. Introduce los valores del píxel en los campos de texto Ancho del borde y Espaciado interno para establecer espacios predeterminados. 

Una línea de texto

La línea del módulo de texto permite a los usuarios editar una sola línea de texto en el editor de contenido. 

Pie de página

El módulo de pie de página de la página muestra información de derechos de autor con el año en curso y el nombre de tu empresa. El nombre de la empresa se extrae automáticamente de la sección Pie de página de tu configuración de correo electrónico.

Solicitud de contraseña

El módulo de solicitud de contraseña está disponible en las plantillas de sistema de solicitud de contraseña. Si una página está protegida con contraseña, la página de solicitud de contraseña aparecerá antes de que el usuario pueda acceder a la página. Puedes personalizar el texto del botón enviar y el texto para mostrar si la contraseña ingresada es incorrecta.

Filtro de publicaciones

Nota: el módulo de suscripción de correo electrónico del blog no está disponible para plantillas de correo electrónico. 

El módulo del filtro de publicaciones se usa para mostrar una lista de artículos de blog de un tema específico, mes o autor. 

Puedes personalizar la siguiente configuración para este módulo en la sección Contenido predeterminado: 

• Selecciona un blog para mostrar: selecciona las publicaciones de blog utilizadas.
• Lista de valores para enlaces de filtro: selecciona si el módulo está filtrado por etiqueta, mes o autor.
• Ordenamiento de los valores para los enlaces de filtro: selecciona si los valores se organizarán alfabéticamente o por número de publicaciones.
• Título de la lista para mostrar: escribe un título para que aparezca arriba de las publicaciones.
• Número máximo de valores de filtro para mostrar: ingresa el número máximo de publicaciones para un filtro específico. Dejar este campo en blanco para mostrar todas las publicaciones. 
• Enlace de texto para mostrar si hay más valores de publicación que los que se permiten mostrar: escribe el texto que aparecerá si hay más publicaciones disponibles en una categoría. El texto predeterminado está viendo todo. 

Listado de publicaciones

Nota: el módulo de suscripción de correo electrónico del blog no está disponible para plantillas de correo electrónico. 

El módulo del listado de publicaciones para mostrar una lista de los artículos más recientes o populares de un blog de HubSpot. Puedes establecer el módulo para mostrar las publicaciones más recientes o las más populares durante el mes pasado, seis meses, año o en todo el tiempo. 

Puedes personalizar los siguientes valores predeterminados de contenido en el inspector:

• Selecciona el blog que se mostrará: selecciona el blog para el que quieres mostrar los títulos de las publicaciones
• Lista de publicaciones de blog por: selecciona cómo organizar las publicaciones
• Lista de título para mostrar: escribe un título para que aparezca arriba de las publicaciones.
• Número máximo de posts de blog en lista: ingresa un número máximo de publicaciones que aparecerán en este módulo. 

Texto enriquecido

El módulo de texto enriquecido es el módulo de contenido más utilizado en las herramientas de contenido HubSpot. Esto admite las opciones de edición para distintos componentes, como texto, imágenes y CTA.

Para agregar contenido predeterminado a este módulo, haz clic en Expandir o en cualquier lugar del contenido de vista preliminar para abrir un editor de texto enriquecido.

Listado de RSS

Nota: el módulo de listado RSS no está disponible para plantillas de correo electrónico. Usa un correo RSS en su lugar. 

Puedes usar un módulo de listado RSS para mostrar resúmenes de publicaciones para un blog de HubSpot o una fuente RSS externa.

Los módulos de listado RSS pueden mostrar un blog o una etiqueta específica. Haz clic en el interruptor que corresponda para indicar si se debe mostrar una imagen destacada, un nombre de autor, un resumen o una fecha de publicación con cada publicación.

Después de activar estas configuraciones, puedes personalizar los siguientes detalles:

• Mostrar nombre del autor: introduce el Texto de atribución del autor que te gustaría usar sobre el nombre de cada autor. De manera predeterminada, este módulo incluye Por como texto de atribución.
• Mostrar resumen: introduce la longitud (de caracteres) de cada resumen del blog. También puedes personalizar el Texto de clics de resumen, que es el enlace donde hacen clic los visitantes del blog para leer tu publicación completa. De manera predeterminada, este texto de clics de resumen se etiquetará Más información
• Mostrar fecha de publicación: selecciona el Formato de fecha de publicación para personalizar el formato de la fecha y la hora de cada publicación. También puedes personalizar el texto indicador de la fecha de publicación De manera predeterminada, en este texto se leerá Publicado el.

Encabezado de la sección

Puedes usar el módulo de Encabezado de sección para mostrar una etiqueta de encabezado h1 con un subtítulo de párrafo. Este módulo es ideal para el título de la sección principal de una página.

Menú simple

Los módulos de menú simple permiten a los usuarios crear menús específicos para páginas en el editor de contenido. Este módulo te ofrece la flexibilidad para crear un menú simple para una plantilla específica. En el inspector, haz clic en Editar menú para agregar elementos al menú, enlaces y seleccionar la orientación del menú. Al editar la configuración de la orientación del menú, se agrega una clase de hs-menu-flow-horizontal o hs-menu-flow-vertical al contenedor general del menú, que luego se puede usar para el estilo en tu CSS. Más información sobre las clases agregadas por la configuración del módulo en nuestra documentación de desarrollador.

Intercambio social

El módulo para compartir en redes sociales permite que los visitantes compartan fácilmente tu contenido en los canales de redes sociales y los correos electrónicos. Haz clic para activar el interruptor ¿Activado? junto a una red social específica para incluirla en tu página o correo electrónico.

El enlace para compartir completará automáticamente las etiquetas de HubL requeridas para que compartas tu contenido. En correos electrónicos, el módulo utilizará la URL de la versión web de ese correo electrónico en el enlace de compartir.

Nota: el módulo de Intercambio social utiliza los íconos predeterminados para cada red social. Si deseas usar tus propios iconos de redes sociales personalizados, puedes crear una versión personalizada del módulo.

Preferencias de suscripción

Los módulos de preferencias de suscripción solo están disponibles en las plantillas del sistema de preferencias de suscripción. 

Estos módulos te permiten personalizar la página que ve un destinatario de correo electrónico cuando administra sus preferencias de suscripción o cancela su suscripción a tus comunicaciones por correo electrónico.

Confirmación de actualización de suscripciones

El módulo de confirmación de actualización de suscripción es un módulo de texto enriquecido que está disponible en las plantillas de confirmación de actualización de suscripción. Te permite personalizar lo que se muestra cuando un destinatario de correo electrónico actualiza su configuración de suscripción.

Ver como página web

El módulo Ver como página web da a los destinatarios de tus correos la opción de abrir la versión de página web de un correo electrónico.