Módulos predeterminados de HubSpot

En este artículo, aprende sobre los módulos predeterminados que HubSpot proporciona para usar en tus plantillas y páginas. Cada tipo de módulo puede personalizarse con opciones de contenido y estilo en el inspector. También puedes agregar un módulo predeterminado a una plantilla HTML con su fragmento HubL. Más información sobre el desarrollo con módulos predeterminados en Documentación para desarrolladores de HubSpot.

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 Marketing Hub Pro y Enterprise y CMS Hub Pro y Enterprise tienen por opción predeterminada una carpeta @hubspot en las herramientas de diseño. Esta carpeta contiene todos tus temas y módulos predeterminados, incluidos los módulos de correo electrónico de arrastrar y soltar. Estos temas y módulos son de solo lectura, pero se pueden clonar 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 con el botón derecho del raton en el módulo predeterminado que quieras clonar y 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 de 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 de correo electrónico. 

El módulo de comentarios de blog agrega una sección de comentarios a una plantilla de publicación de 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 de 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 el marcado de tus entradas haciendo clic en Editar plantilla de publicación y editar el marcado de tu página de listado haciendo clic en Editar plantilla de listado. Más información sobre el marcado del módulo de contenido del blog.

Suscripción a los correos del blog

Nota: el módulo de suscripción por correo electrónico al 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 formulario. Este módulo se rellena con tu formulario de suscripción al blog, que puedes personalizar en tu herramienta de formularios.

Haz clic en el menú desplegable Seleccionar blog para 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. Pasa el ratón por encima de la respuesta en línea existente y haz clic en el icono de expansión expand para personalizar el texto que aparece después de que un visitante envíe 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 nuevo CTA en el mismo menú para crear un nuevo CTA como tu CTA predeterminada. 

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 qué redes sociales aparecen 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 quieres utilizar tus propios iconos de redes sociales personalizados, puedes crear una versión personalizada del módulo. 

Formulario

Nota: el módulo de formulario no está disponible para las 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 electrónico de seguimiento: envía hasta tres correos electrónicos de seguimiento a los visitantes que envíen el formulario.

Título

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

Imagen

Un módulo de imagen agregar 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 las configuraciones personalizables del módulo de galería de imágenes. 

Conmutador de idiomas

Nota: el módulo de cambio de idioma no está disponible para las 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.

Logotipo

El módulo Logotipo extrae automáticamente el logotipo de tu empresa de la configuración de tu sitio web. 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 enlazar a una página diferente, ingresa una URL de enlace única. 

Cuadrícula del logotipo

Con el módulo de cuadrícula de logotipos, puedes organizar varios logotipos de distintas dimensiones en una cuadrícula coherente. Puedes personalizar el color de fondo, la relación de aspecto, el tamaño de la cuadrícula, el tamaño del espaciado y la altura máxima del logotipo. 

Cuerpo del correo electrónico

El módulo principal del cuerpo del correo electrónico es un módulo estándar de texto enriquecido que se incluye por opción predeterminada en todas las plantillas de correo electrónico. Puedes personalizar el contenido predeterminado para el cuerpo del correo electrónico en una plantilla específica.

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 color y selecciona un color del selector, o introduce un valor hexadecimal en el campo de texto para configurar los 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 tus contenidos 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: selecciona el número máximo de elementos de 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 verificación para mostrar los elementos del menú secundario cuando pases el cursor sobre el principal. Desmarca esta casilla de verificación para mostrar siempre los elementos del menú secundario.

Módulos

Los módulos creados en el editor de código te permiten usar HTML, CSS, Javascript y HubL para agregar funciones avanzadas a tus plantillas, al tiempo que permiten a tus usuarios editar el contenido del módulo en el editor 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 a medida en nuestra documentación para desarrolladores.

Información sobre dirección de oficina

El módulo de localización de oficinas incluye tokens requeridas que deben incluirse en una plantilla de correo electrónico para poder enviar legalmente correos electrónicos de marketing. Aunque puedes editar el estilo de este módulo, no podrás guardar una plantilla de correo electrónico sin un módulo de información sobre la ubicación de la oficina o el requerimiento  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 color y selecciona un color del selector, o introduce un valor hexadecimal en el campo de texto para configurar los 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 la configuración de tu correo electrónico.

Solicitud de contraseña

El módulo prompt de contraseña está disponible en las plantillas del sistema de prompt 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 por correo electrónico al blog no está disponible para las 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 por correo electrónico al blog no está disponible para las 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 de HubSpot. Asiste opciones de edición para distintos componentes, como texto, imágenes y CTA.

Para agregar contenido predeterminado para este módulo, haz clic en Expandir o haz clic en el contenido de vista previa 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. Utiliza en su lugar un correo electrónico de RSS. 

Puedes utilizar un módulo de listado RSS para mostrar resúmenes de publicaciones de un blog de HubSpot o de un canal RSS externo.

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

Tras 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.

Título de sección

El módulo de título de sección te permite mostrar un título de etiqueta 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 de 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 los correos electrónicos, el módulo utilizará la URL de la versión web de ese correo en el enlace para compartir.

Nota: el módulo para compartir en redes sociales utiliza los iconos predeterminados para cada red social. Si quieres utilizar 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 preferencias de suscripción plantillas del sistema. 

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 del sistema 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 de vista como página web ofrece a los destinatarios de correo electrónico la opción de abrir la versión de página web de un correo electrónico. 

Enlace de WhatsApp 

Nota: este módulo solo está disponible para las cuentas Marketing Huby Service Hub Pro y Enterprise.

Utiliza el módulo de enlace de WhatsApp para agregar una forma de que los visitantes del sitio web se conecten contigo directamente a través de WhatsApp. Este módulo se puede agregar a páginas web, publicaciones de blog y páginas de listas de blogs. Para usar este módulo, necesitarás conectar tu canal de WhatsApp a tu bandeja de conversaciones.

El estilo de los botones, como el color y el espaciado, puede personalizarse en la pestaña Estilos del editor de páginas, y puedes configurar los siguientes elementos:

• Número de WhatsApp: selecciona un número de WhatsApp conectado.
• Texto de registro: selecciona el texto de registro y cancelación. 
• Mostrar: selecciona si el botón muestra texto, un icono o ambos.
• Posición del icono: selecciona si el icono aparece a la izquierda o a la derecha del texto.
• Botón de texto: introduce el texto que aparece en el botón.
• Título del icono de WhatsApp: para accesibilidad, introduce la descripción del icono para lectores de pantalla.