Módulos por defecto de HubSpot

En este artículo, aprenderás sobre los módulos predeterminados que HubSpot proporciona para utilizar en tus plantillas y páginas. Cada tipo de módulo puede personalizarse con opciones de estilo y contenido en el inspector . También puedes añadir un módulo por defecto a una plantilla HTML con su fragmento HubL. Obtén 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 Professional y Enterprise y CMS Hub Professional y Enterprise tienen por defecto 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 sólo 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 ratón en el módulo por defecto 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 la página de baja de tu copia de seguridad en la sección Contenido predeterminado de este módulo. 

Comentarios del blog

Ten en cuenta: 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 añade una sección de comentarios a una plantilla de entrada 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

Ten en cuenta: 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 entrada 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

Ten en cuenta: 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 al correo electrónico del blog permite a los visitantes suscribirse a los correos electrónicos del resumen de tu blog rellenando 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 un CTA en un módulo de texto enriquecido .

En el inspector, haz clic en CTA.  menú desplegable  y selecciona un CTA predeterminado 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 por defecto. 

Sígueme

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

Puedes utilizar el Sígueme  módulo  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 social de .

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

Formulario

Ten en cuenta: 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.

Rúbrica

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

Imagen

Un módulo de imagen añade 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 los ajustes personalizables del módulo de galería de imágenes. 

Conmutador de idiomas

Ten en cuenta: 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 inglesa de una página con traducción al francés, cuando hagas clic en el conmutador de idiomas, verás English y Français como nombres de idioma.
• Híbrido: una combinación de los dos. Por ejemplo, si estás viendo la versión en inglés de una página con traducción al francés, cuando hagas clic en el conmutador de idiomas, verás inglés y francés (Français) como 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 multilingüe en HubSpot.

Logotipo

El módulo Logo 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 para todo el contenido en la configuración de tu sitio web, haz clic en Editar logotipo predeterminado en este dominio.

El módulo de tu logotipo enlazará automáticamente con el dominio de tu empresa. Para anular este valor predeterminado y enlazar con una página diferente, introduce una URL de enlace única . 

Rejilla del logotipo

Con el módulo de cuadrícula de logotipos, puedes disponer 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 principal 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 defecto en todas las plantillas de correo electrónico. Puedes personalizar el contenido predeterminado de  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 de color, o introduce un valor hexadecimal en el campo de texto para establecer los colores por defecto. 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ú añade navegación a tus contenidos y plantillas. Los menús se crean y gestionan 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 de tu configuración.
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ámica por secciones- Mostrar páginas en  menu  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- Mostrar páginas en  menu  que están relacionadas con  la página  que se está visualizando: muestra los elementos del menú relacionados con la página específica que se está visualizando.
   • 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ú hijo que se pueden mostrar.
4. Orientación: selecciona si los elementos del menú se muestran horizontalmente o verticalmente.
5. Activar flyouts: selecciona esta casilla para mostrar los elementos del menú hijo cuando pases el ratón por encima del padre. Desmarca esta casilla para mostrar siempre los elementos del menú hijo.

Módulos

Los módulos creados en el editor de código te permiten utilizar HTML, CSS, Javascript y HubL para añadir 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 icono de módulo customModules en el buscador y en el inspector. Obtén 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 fichas 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 necesario  HubL  etiquetas.  

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 de color, o introduce un valor hexadecimal en el campo de texto para establecer los colores por defecto. 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

El módulo de una línea de texto permite a los usuarios editar una sola línea de texto en el editor de contenidos. 

Pie de página

El módulo de pie de página muestra información sobre el copyright 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 de solicitud de contraseña está disponible en las plantillas del 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 posts

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 todas las herramientas de contenido de HubSpot. Admite opciones de edición para distintos componentes, como texto, imágenes y CTA.

Para añadir 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 las plantillas de correo electrónico. Utiliza en su lugar un correo electrónico RSS . 

Puedes utilizar un módulo de listado RSS para mostrar resúmenes de entradas 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íficos. 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 entrada.

Tras activar estos ajustes, 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 la sección

El módulo de encabezado de sección te permite mostrar una etiqueta de encabezado h1 con un subtítulo de párrafo. Este módulo es ideal para titular 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 añadir 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 de compartir en redes sociales utiliza iconos predeterminados para cada red social. Si quieres utilizar tus propios iconos sociales personalizados  , puedes crear una versión personalizada del módulo.

Preferencias de suscripción

Los módulos de preferencias de suscripción sólo 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 WhatsApp 

Nota: este módulo sólo está disponible para las cuentas Marketing Huby Service Hub Professional y Enterprise.

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

El estilo de los botones, como el color y el espaciado, se puede personalizar 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 inclusión: selecciona el texto de inclusión y exclusió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.
• Texto del botón: 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.