Nota: Este contenido se tradujo a través de un software y es posible que no haya sido revisado. La versión en inglés se considera, por tanto, la versión oficial y es posible que haya sido actualizada. Para acceder a la versión en inglés, haz clic aquí.
CMS-General

Usar módulos predeterminados en tu plantilla

Última actualización: noviembre 26, 2018

Requisitos

Marketing Hub Professional, Enterprise
Básico

Este es un resumen de todos los módulos predeterminados disponibles para plantillas de diseño de arrastrar y soltar. Cada tipo de módulo se puede personalizar en el inspector con opciones de estilo y contenido. En esta guía se indicará cómo puedes agregar módulos a tu plantilla y cómo se pueden usar cada uno de estos módulos estándar en tu contenido.

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. Aquí aparecerán todos los módulos predeterminados, los módulos o los grupos guardados. Utiliza la barra de búsqueda para buscar un módulo específico. También puedes usar el menú desplegable para filtrar componentes por tipo, categoría o etiquetas.

Los estilos, la configuración y el contenido del módulo se pueden modificar en el inspector cuando se selecciona el módulo en el editor. Haz clic en Expandir para agregar más estilos personalizados en el editor de código.

En la parte inferior del inspector, tienes la opción de bloquear el módulo para que el contenido no pueda ser modificado en un editor de página, correo electrónico o blog. Selecciona la opción Evitar la edición en editores de contenido para activar esta configuración.

Tipos de módulos predeterminados

Menú avanzado

Puedes usar un módulo del menú avanzado para agregar navegación a tu contenido y plantillas. Los árboles de menú se crean y administran directamente en configuración de contenido

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

  1. Menú: selecciona uno de tus menús avanzados existentes de 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ú : mantiene consistente el menú en todas las páginas de navegación de tu sitio web.
    • Dinámico por sección: muestra páginas del menú que están relacionadas con la sección que se está visualizando : 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 : actualiza el formato HTML para que decidas si los elementos de tu árbol de menú se verán de manera vertical u horizontal en tu sitio web.
  5. Activar controles flotantes: esto indica qué quieres que se vea cuándo un visitante pasa el mouse sobre un menú que contiene elementos de menú secundario.
Opciones avanzadas del menú


Cancelación de suscripción con copia de seguridad

La plantilla de cancelación de suscripción con copia de seguridad sirve para recuperar destinatarios de correo electrónico si HubSpot no puede determinar la dirección de correo cuando un destinatario intenta cancelar la suscripción. Este módulo te permite personalizar el texto de ayuda que aparece en la sección Contenido predeterminado de esta página.

Obtén más información sobre cómo crear listas plantillas de sistema.

Cancelación de suscripción con copia de seguridad

Comentarios del blog

El módulo de comentarios del blog agrega una sección de comentarios a tus plantillas para publicaciones individuales. Puedes personalizar el formulario de comentarios del blog en la herramienta para formularios (Contactos > Formularios). El formulario tendrá un nombre según el título de tu blog. Este módulo solo está disponible en diseños de plantillas de blog.

Formulario predeterminado de comentarios del blog

Contenido del blog

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 formato de la publicación haciendo clic en Editar plantilla de publicación y editar el formato del listado haciendo clic en Editar plantilla de listado.

Más información sobre el formato del módulo de contenido del blog. Siempre puedes revertir el módulo a su código original cambiando el módulo a un nuevo módulo de contenido del blog.

blog-content-1.png

Suscripción a los correos del blog

Puedes usar el módulo de suscripción de correo electrónico del blog para permitir 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 ubicar y personalizar en la herramienta Formularios.

Usa el menú desplegable para especificar el blog al se están suscribiendo los visitantes. Puedes personalizar el texto que aparece en el título sobre el formulario usando el cuadro de texto en el inspector. Coloca el cursor sobre la respuesta en línea existente y haz clic en el ícono expandir para personalizar el texto que aparece después de que un visitante envía el formulario.

Ten en cuenta: este módulo no es compatible con plantillas de correo electrónico.

Suscripción a los correos del blog

Llamada a la acción

Puedes insertar un botón CTA en un módulo con texto enriquecido, o utilizar un módulo de llamado a la acción . Un módulo de llamada a la acción es útil cuando quieres que la CTA ocupe automáticamente un lugar en tu diseño.

En el inspector, usa la CTA menú desplegable menú para seleccionar una CTA específica para tu módulo. También puedes hacer clic en + Crear nueva CTA para abrir el panel y crear una nueva CTA. 

Captura de pantalla de un artículo de ayuda de HubSpot


Columna flexible

Cuando se agrega una columna flexible a una plantilla de página de HubSpot, puedes agregar, eliminar y volver a ordenar módulos, a nivel de página en el editor de contenido. Esta característica permite a los diseñadores crear menos plantillas, pero al mismo tiempo, sigue ofreciendo a los profesionales del marketing la flexibilidad necesaria para personalizar cada página para que se adapte a sus necesidades.

Ten en cuenta: este módulo no está disponible en blogs, páginas de sistema o plantillas de correo electrónico.

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 seleccionar Convertir en columna flexible.

Ten en cuenta: una vez que una columna flexible haya sido personalizada para una página en particular en el editor de contenido, los cambios realizados en la columna flexible en la plantilla no se reflejarán en dicha página. Esto garantiza que no se sobrescriba el contenido.

Sígueme

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 (En tu cuenta de HubSpot, dirígete a Marketing > Redes sociales.).

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

Correo electrónico: Sígueme

El módulo de correo electrónico de seguimiento ofrece opciones de configuración y formato adicionales para plantillas de correo electrónico. En lugar de replicar tu configuración de redes sociales, este módulo se puede personalizar con todas las páginas sociales que deseas. También puedes ajustar la forma del ícono de redes sociales, el esquema de colores yla alineación de tu módulo. También puedes agregar una cuenta de redes sociales personalizada y cargar tu propio ícono en el editor si tu marca está activa en una plataforma social distinta de las especificadas.

Para editar las redes sociales que aparecen en este módulo, haz clic en el ícono + Agregar en la secciónRedes sociales del inspector. Luego, coloca el cursor y haz clic en el ícono del lápiz  icon ícono Editar Enviar a la papelera icon eliminar para realizar cambios.

opciones de correo electrónico sígueme

Hacer clic en el ícono del lápiz editar, te da opciones para seleccionar las redes sociales que aparecen y el sitio que quieres vincular. 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 administrador de archivos o cargar una nueva imagen desde tu computador.

ícono personalizado

Después de que hayas realizado tus selecciones, usa la barra de navegación en la parte superior del inspector para regresar a las otras opciones del módulo.

Formulario

El módulo de formulario permite a los usuarios seleccionar un formulario para agregarlo a una página. Se usa para recopilar información de contacto de los visitantes de tu sitio web. Está disponible como módulo que se puede agregar a contenido y plantillas creadas con páginas de destino, páginas de sitio web y páginas de blog. 

Ten en cuenta: no se pueden agregar formularios a plantillas de correo electrónico. 

El módulo de formulario te permite:

  1. Dar un título a tu formulario en la página.
  2. Elegir qué formulario de HubSpot aparecerá en la página o bien, agregar un nuevo formulario.
  3. Elegir si deseas redirigir a una persona que envía el formulario a otra página, o mostrar un mensaje de agradecimiento en la misma página.
  4. Personalizar el mensaje de agradecimiento para visitantes, en caso necesario.
  5. Enviar correos electrónicos de notificación de formulario a una dirección específica.
  6. Agregar visitantes que envían el formulario a un workflow. (Requiere suscripción aMarketing Professional o Enterprise.)
  7. Enviar un correo de seguimiento a visitantes que enviaron el formulario.

formulario módulo 2

Puedes utilizar un módulo de Encabezado para mostrar una línea de texto en una etiqueta HTML de encabezado. Puedes personalizar el texto en el contenido del Encabezado y usar el menú desplegable para elegir la etiqueta de encabezado (H1-H4) que se utilizará.

Espaciador horizontal

Puedes agregar un módulo de Espaciador horizontal a tus plantillas, para agregar un espacio en blanco que personaliza el diseño de tus módulos de contenido. Este módulo crea una etiqueta de división vacía que se puede usar para agregar espacio entre los elementos de una página.

Captura de pantalla de un artículo de ayuda de HubSpot

Imagen

Los módulos de imagen te permiten agregar cualquier imagen a una página o correo electrónico en una ubicación específica. Puedes seleccionar imágenes que ya hayas subido al administrador de archivos, o cargar una imagen nueva en el momento en que agregues contenido predeterminado o trabajes en el editor de contenido. Esto es útil si estás dando formato o diseño a una imagen de manera específica para tu plantilla y deseas intercambiar la imagen sin tener que cambiar el formato.

También puedes personalizar:

  • La URL donde se redirigirá a las personas cuando hagan clic en la imagen
  • El texto alternativo de la imagen
  • La altura y el ancho de la imagen

módulo de imagen

El módulo de galería de imágenes puede agregar rápidamente un elemento visual dinámico a una página de HubSpot. En el inspector puedes personalizar las siguientes opciones:

  1. Haz clic en + Agregar en la sección Diapositiva para insertar más diapositivas. Las diapositivas se pueden reorganizar arrastrándolas y soltándolas en lugar deseado. Coloca el cursor sobre una diapositiva determinada y haz clic en el ícono Editar para agregar una leyenda y una imagen.
  2. Utiliza el menú desplegable Modo de presentación para seleccionar una presentación de diapositivas estándar, una navegación en miniatura o una galería de imágenes de Lightbox.
  3. Activa la opción Repetir diapositivas para repetir tus diapositivas desde el principio después de verlas todas.
  4. Activa la opción Avance automático si deseas que las diapositivas cambien automáticamente.
  5. Si seleccionas esta opción, usa los botones de flecha para especificar los segundos entre diapositivas.
  6. Activa la opción Mostrar botones de navegación para indicar si deseas que los visitantes hagan clic en imágenes por su cuenta.
  7. Utiliza el menú desplegable Altura variable para seleccionar Altura fija si la galería debe mantener el mismo tamaño mientras los visitantes se desplazan por las imágenes. Selecciona Altura variable si deseas que la galería se ajuste al tamaño de cada imagen.
  8. Personaliza la transición entre diapositivas usando el menú desplegable para seleccionar Diapositiva o Desvanecer.
  9. Si tus imágenes tienen leyendas, puedes seleccionar Mantener siempre las leyendas debajo de la imagen o Superponer las leyendas en la parte superior de las imágenes.
Captura de pantalla de un artículo de ayuda de HubSpot


Conmutador de idiomas

El módulo del conmutador de idioma permitirá que las personas que visiten tu página de destino y las páginas de tu sitio web puedan cambiar entre las versiones traducidas de la página. Puedes personalizar cómo aparecerán los nombres de tus idiomas traducidos en este módulo.

  • Pagelang : significa que los nombres de los idiomas aparecerán 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.

Si este módulo está incluido en tu plantilla de página, solo aparecerá en la página en vivo si se ha publicado más de una traducción para esa página. 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. Si quieres cambiar este logotipo, puedes hacer clic en la opción Anular el logotipo predeterminado de esta página para cargar una nueva imagen solo para esta página. También puedes hacer clic en Editar en Configuración de contenido para actualizar el logotipo de tu empresa en todos los contenidos.

Tu módulo de logotipo se vinculará automáticamente con el dominio de tu empresa, pero puedes introducir una URL única para anular este valor predeterminado.

Módulo de logotipo


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. Especifica el área de texto enriquecido principal para que tus profesionales del marketing la usen cuando redacten mensajes 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. Utiliza la burbuja de colores para seleccionar uno del selector de colores, o introduce el valor hexadecimal en el campo de texto. También puedes usar los campos de texto para especificar el ancho en pixeles para el borde del módulo y el espaciado interior y exterior.

Cuerpo del correo


Módulos

Los módulos creados en el editor de códigos te permiten usar HTML, CSS, Javascript y HubL para agregar funciones avanzadas a tus plantillas, mientras que al mismo tiempo, le permite a tus profesionales del marketing editar contenido del módulo en los editores sin tocar el código. Estos componentes se etiquetarán con un ícono de módulo customModules en el buscador y el inspector. Puedes obtener más información sobre cómo trabajar con módulos de código personalizados en el Foro del diseñador.

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 olas 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 para seleccionar uno del selector de colores, o introduce el valor hexadecimal en el campo de texto. También puedes usar los campos de texto para especificar el ancho en pixeles para el borde del módulo y el espaciado interior y exterior.

Captura de pantalla de un artículo de ayuda de HubSpot


Una línea de texto

El módulo de una línea de texto permite que los creadores de contenido editen una sola línea de texto en su página o correo electrónico. Este módulo es útil para crear campos de texto simple, donde el usuario final no necesita tomar ninguna decisión sobre el formato.

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. No hay campos de contenido editables para este módulo en el Administrador de diseño porque 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

Los módulos de solicitud de contraseña están disponibles en Plantillas de sistema 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 puede 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

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. Este módulo no está disponible en las plantillas de correo electrónico.

Puedes personalizar la siguiente configuración en los valores predeterminados del módulo:

  • El blog para el que quieres mostrar los valores de filtro
  • Lista de valores para enlaces de filtro (temas, mes o autor)
  • Cómo ordenar los valores (conteo o nombre de la publicación)
  • Lista de títulos por mostrar
  • Número máximo de publicaciones en la lista
  • Texto de enlace para mostrar si hay más valores de publicación que los que se permite mostrar


Listado de publicaciones

El módulo del listado de publicaciones para mostrar una lista de los artículos más recientes o más populares de un blog de HubSpot. Este módulo no está disponible en las plantillas de correo electrónico. 

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

  • El blog para el que quieres mostrar los títulos de las publicaciones
  • Lista de publicaciones del blog más recientes o más populares durante un período determinado
  • Lista de títulos por mostrar
  • Número máximo de publicaciones en la lista
Listado de publicaciones


Texto enriquecido

El módulo de texto enriquecido es el módulo de contenido más utilizado en las herramientas de contenido HubSpot. Ofrece la mayor cantidad de opciones de edición para tu contenido, por ejemplo, formato de texto, imágenes, enlaces, CTA y más. Las cuentas de Marketing Hub Pro y Enterprise pueden usar módulos de texto enriquecido para agregar contenido inteligente a una página.

Puedes usar este módulo para crear áreas de contenido editable para tus profesionales del marketing. Si quieres 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.

Captura de pantalla de un artículo de ayuda de HubSpot


Listado de RSS

Puedes usar un módulo de listado RSS para mostrar resúmenes de publicaciones para un blog de HubSpot o una fuente RSS externa. Este módulo no está disponible en las plantillas de correo electrónico (en su lugar, usa un  correo electrónico para RSS).

Los módulos de listados RSS se pueden personalizar para filtrar un blog específico e incluso una etiqueta específica. Haz clic en el botón 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, este texto se leerá Publicado el.
Captura de pantalla de un artículo de ayuda de HubSpot


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.

Encabezado de la sección


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 del menú, enlaces y estilo del menú con navegación horizontal o vertical.

Menú simple


Intercambio social

Puedes utilizar el módulo de Intercambio social para permitir que los visitantes compartan fácilmente el contenido de tu pagina en los canales de redes sociales y correo electrónico. Haz clic en el botón de la red social que corresponda para incluirla en tu plantilla. El enlace para compartir completará automáticamente las etiquetas de HubL requeridas para que compartas tu contenido.

Ten en cuenta: el módulo de Intercambio social utiliza los íconos predeterminados para cada red social. Si deseas usar tus propios íconos 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 son módulos especiales y 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.

Preferencias de suscripción


Confirmación de actualización de suscripciones

Este módulo de texto enriquecido está disponible en las plantillas del sistema de confirmación de actualización de la suscripción que te permite personalizar lo que se muestra cuando un destinatario de tus correos actualiza su configuración de suscripción.

Actualizaciones 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. Diferentes clientes de correo electrónico pueden hacer que los correos electrónicos con formato HTML sean muy diferentes, por lo que incluir esta opción en una plantilla de correo electrónico garantiza que tus usuarios siempre puedan ver el correo electrónico en el formato que deseas cuando abren la versión del navegador.

Captura de pantalla de un artículo de ayuda de HubSpot