Personalizar un tema de la base de conocimientos

Puedes personalizar la apariencia de tu base de conocimientos seleccionando el diseño y configurando el tema en el editor de temas. También puedes ver cómo aparecerá el tema de tu base de conocimientos en las plantillas, en distintos idiomas y en distintos tamaños de pantalla.

Antes de empezar

Antes de comenzar a trabajar con esta característica, asegúrate de que comprendes perfectamente qué pasos hay que dar con antelación, así como las limitaciones de la función y las posibles consecuencias de utilizarla.

Comprender los requisitos

• Permisos de superadministrador.
• Permiso de configuración de la base de conocimientos, permiso de configuración global de contenidos y temas, y una licencia asignada de Service Hub. Más información sobre los precios basados en licencias de HubSpot.

Comprender las limitaciones y consideraciones

• Estas herramientas solo están disponibles para las bases de conocimientos migradas. Más información sobre la migración de tu base de conocimientos.
• Para las bases de conocimientos que no se hayan migrado, obtén más información sobre cómo crear y personalizar una base de conocimientos anterior.
• No puedes personalizar tu base de conocimientos en el administrador de diseño ni utilizar temas personalizados.

Ver un tema de la base de conocimientos

Una vez que hayas creado tu base de conocimientos, podrás ver el aspecto de tu tema en el editor de temas. Puedes ver el aspecto del tema en diferentes plantillas, idiomas y tamaños de pantalla. 

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3.  Para ver una plantilla con contenido de muestra, haz clic en el menú desplegable Ver en de la parte superior izquierda y selecciona una plantilla. Los cambios en el tema se aplicarán a todas las plantillas de la base de conocimientos.

4. Para ver una plantilla en distintos idiomas, haz clic en el segundo menú desplegable de la parte superior izquierda y selecciona un idioma.

5. Para ver cómo se mostrará una plantilla en diferentes dispositivos, haz clic en los iconos de dispositivo en la parte superior del editor, o introduce un ancho de pantalla en píxeles. 

Editar los colores, la tipografía y el diseño del tema de una base de conocimientos 

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Para cambiar los colores de un tema, haz clic para ampliar la sección Colores. A continuación, introduce un valor hexadecimal o selecciona un color del selector de colores para los campos Principal, Secundario, Acento y Fondo del cuerpo. Los colores de tu marca se mostrarán para cada opción.
4. Para cambiar la tipografía de un tema, haz clic en Tipografía:
   • En las secciones Principal y Secundario, haz clic enel menú desplegable de fuentes y selecciona una fuente. Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
   • Para editar la tipografía del encabezado, cuerpo o enlace, haz clic para expandir las secciones Encabezado (H1-H6), Cuerpo o Enlace:
     • Haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
     • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
5. Para cambiar el diseño de un tema, haz clic para ampliar la sección Diseño y selecciona una opción (por ejemplo, Mosaicos o Mínimo). Las diferentes opciones de diseño admitirán diferentes opciones de estilo.
6. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Editar los estilos de encabezado de un tema de la base de conocimientos

Puedes editar los estilos de encabezado del tema de tu base de conocimientos, incluida la anchura del encabezado, la barra superior, el selector de idiomas, el menú, el botón y la barra de búsqueda. También puedes editar colores, fuentes y estilos de navegación dentro de esos elementos.

Anchura del encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, selecciona Ancho completo o Ancho de contenido.

Barra superior del encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, haz clic para ampliar la sección Barra superior.
5. Para editar el color de fondo, introduce un valor de código hexadecimal o selecciona un color de fondo en el selector de colores del campo Color de fondo.
6. Haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
7. Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
8. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Selector de idiomas de encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, haz clic en Selector de idiomas.
5. En la sección Selector de idiomas, haz clic en Desplegables.
6. Haz clic para ampliar la sección Fondo.
7. Introduce un valor de código hexadecimal o selecciona un color en el selector de colores para los campos Color y Navegación. 
8. Para editar la transparencia, introduce un valor porcentual en el segundo campo. Por ejemplo, una transparencia del 100% será opaca, mientras que una transparencia del 0% no será visible. 
9. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Menú de encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, haz clic en Menú.
5. Para editar los estilos de los desplegables, haz clic en Desplegables:
   • Haz clic para ampliar la sección Fondo e introduce un valor de código hexadecimal o selecciona un color en el selector de color para los campos Color y Navegación. Para editar la transparencia, introduce un valor porcentual en el segundo campo.
     
   • Haz clic para ampliar la sección Texto. A continuación, haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
   • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
6. Para editar el estilo de texto de la fuente, haz clic para ampliar la sección Texto:
   • Haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada. 
   • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
7. Para editar el color de fondo, haz clic para ampliar la sección Fondo e introduce un valor de código hexadecimal o selecciona un color en el selector de colores.
8. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Botones de encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, haz clic en Botón.
5. Para editar la fuente, haz clic para ampliar la sección Texto:
   • Haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
   • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
6.  Para editar el fondo, haz clic para ampliar la sección Fondo e introduce un valor de código hexadecimal o selecciona un color en el selector de colores. Para editar la transparencia, introduce un valor porcentual.
7. Para editar el estilo del borde, haz clic para expandir la sección Borde, haz clic en el menú desplegable Estilo y selecciona un estilo de borde (por ejemplo, Raya).
8. Para editar el estilo de la esquina, haz clic para ampliar la sección Esquina. A continuación, introduce un valor en píxeles (por ejemplo, 30px) en el campo Radio.
9. Para editar el estilo de navegación, haz clic en Navegación:
   • Haz clic para ampliar la sección Texto.
     • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
     • Para aplicar estilos de texto de fuente, selecciona el italicizeIcon icono de cursiva o el underlineIcon icono de subrayado.
   • Haz clic para ampliar la sección Fondo e introduce un valor de código hexadecimal o selecciona un color en el selector de colores. Para editar la transparencia, introduce un valor porcentual.
   • Haz clic para ampliar la sección Borde y haz clic en el menú desplegable Estilo para seleccionar un estilo de borde (por ejemplo, Punteado).
10. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Barra de búsqueda del encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Encabezado en la barra lateral izquierda.
4. En la sección Encabezado, haz clic en Barra de búsqueda.
5. Para editar el fondo, haz clic para ampliar la sección Fondo: y haz clic en el menú desplegable Tipo de fondo para seleccionar una opción (por ejemplo, Color, Imagen o Degradado). Se mostrarán opciones de estilo adicionales en función del tipo de fondo seleccionado.
6. Para editar los estilos de texto de las etiquetas, haz clic para ampliar la sección Texto de etiqueta:
   • Haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
   • Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
7. Para editar el estilo de fuente de entrada, haz clic para expandir la sección Entrada e introduce un valor de código hexadecimal o haz clic en el selector de colores para seleccionar un color. Para editar la transparencia, introduce un valor porcentual.
8. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Editar los estilos de pie de página de un tema de la base de conocimientos

Puedes editar los estilos del pie de página de tu tema de base de conocimientos, incluidos el ancho del pie de página, el fondo, el menú, el texto y los iconos de redes sociales. También puedes editar colores, fuentes y estilos de navegación dentro de esos elementos.

Anchura y fondo del pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Pie de página en la barra lateral izquierda.
4. Para cambiar el ancho del pie de página, selecciona Ancho completo o Ancho de contenido en el campo Ancho del pie de página.
5. Para cambiar el color de fondo del pie de página, introduce un valor de código hexadecimal o haz clic en el selector de colores para seleccionar un color.

Menú de pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Pie de página en la barra lateral izquierda.
4. En la sección Pie de página, haz clic para ampliar la sección Menú .
5. Para editar los estilos de fuente del menú, haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
6. Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
7. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Texto del pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Pie de página en la barra lateral izquierda.
4. En la sección Pie de página, haz clic para ampliar la sección Texto.
5. Para editar los estilos de fuente del menú, haz clic en el menú desplegable de fuentes y selecciona una fuente. Las opciones adicionales de estilo de fuente (por ejemplo, el peso de la fuente, el tamaño de la fuente o la transformación de mayúsculas y minúsculas) dependerán de la fuente seleccionada.
6. Para cambiar el color de la fuente, haz clic en el selector de colores y selecciona un color de fuente.
7. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha.

Iconos de redes sociales del pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Tema.
3. Haz clic en Pie de página en la barra lateral izquierda.
4. En la sección Pie de página, haz clic para ampliar la sección Iconos de redes sociales.
5. Para cambiar el tamaño de los iconos de redes sociales, haz clic en el menú desplegable Tamaño del icono y selecciona una opción (por ejemplo, Pequeño, Normal o Grande).
6. Para cambiar la forma de los iconos de redes sociales, haz clic en el menú desplegable Forma del icono y selecciona una opción (por ejemplo, Círculo o Cuadrado).
7. Para cambiar el color de los iconos de redes sociales, introduce un valor de código hexadecimal o haz clic en el selector de colores para seleccionar un color en el campo Color del icono.
8. Para cambiar el color de fondo de los iconos de redes sociales, introduce un valor de código hexadecimal o haz clic en el selector de colores para seleccionar un color en el campo Fondo. Para editar la transparencia, introduce un valor porcentual. 
9. Para cambiar la alineación de los iconos de redes sociales, haz clic en blockAlignmentLeftIcon Alinear a la izquierda, blockAlignmentCenterIcon Alinear al centro o blockAlignmentRightIcon Alinear a la derecha en el campo Alineación.
10. Cuando hayas terminado, haz clic en Publicar tema en la parte superior derecha. 

Editar el contenido de un tema de la base de conocimientos

Puedes editar el contenido del encabezado y el pie de página de tu base de conocimientos. Los cambios publicados serán visibles en todas las páginas de la base de conocimientos.

Contenido del encabezado

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Encabezado.
3. En el editor global de contenidos, haz clic en el icono de siteTree contenidos en la barra lateral izquierda.
4. En la barra lateral izquierda, haz clic en el módulo Encabezado del sitio web.
5. Para editar el contenido del logotipo del encabezado, haz clic para ampliar la sección Logotipo:
   • Para anular el logotipo predeterminado, activa el interruptor Anular logotipo predeterminado o haz clic en Editar logotipo predeterminado en este dominio para actualizar el logotipo predeterminado.
   • Si seleccionaste anular el logotipo predeterminado, puedes hacer clic en Subir o Examinar imágenes para agregar un nuevo logotipo.
   • Para mostrar el nombre de tu empresa cuando el logotipo no está ajustado, activa la casilla Mostrar el nombre de la empresa cuando el logotipo no está ajustado.
   • Para agregar un enlace URL al logotipo, introduce una URL en el campo Enlace.
   • Haz clic en Aplicar opciones para ver los cambios.
6. Para editar el contenido del menú de encabezado, haz clic para ampliar la sección Menú:
   
   • Para mostrar un menú de encabezado, haz clic en el menú desplegable Menú y selecciona un menú.
   • Para editar un menú de encabezado existente, haz clic en Editar.
   • Para crear un nuevo menú de encabezado, haz clic en Crear nuevo.
   • Para editar el número de elementos del árbol de menús que pueden mostrarse en el menú de encabezado, utiliza las teclas upIcon aumentar y downIcon disminuir en el campo Niveles máximos. 
   • Haz clic en Aplicar opciones para ver los cambios.
7. Para editar el contenido del botón de encabezado, haz clic en Botón:
   
   • Para agregar un botón al encabezado, selecciona la casilla de verificación Agregar botón.
   • Para editar el texto del botón del encabezado, introduce el texto en el campo Texto del botón. 
   • Para editar el enlace URL del botón, haz clic en el menú desplegable Enlace a y selecciona una opción (por ejemplo, Externo). Se mostrarán campos adicionales en función de la opción seleccionada.
   • Para que el enlace URL del botón se abra en una ventana nueva, activa el interruptor Abrir enlace en ventana nueva. 
   • Para editar el tipo de enlace del botón, selecciona la casilla de verificación situada junto a No seguir.
   • Para agregar un icono al botón, selecciona la casilla de verificación Agregar icono:
     • Haz clic en Reemplazar para cambiar el icono del botón. 
     • Haz clic en el menú desplegable Posición y selecciona la posición del icono del botón.
   • Haz clic en Aplicar opciones para ver los cambios.
8. Para editar el contenido del selector de idiomas, haz clic para ampliar la sección Selector de idiomas:
   
   • Para agregar el selector de idiomas al encabezado, selecciona la casilla de verificación Agregar selector de idiomas.
   • Para editar el modo de visualización del conmutador de idiomas, haz clic en el menú desplegable Modo de visualización y selecciona una opción (por ejemplo, Localizado, PageLang, Híbrido).
   • Haz clic en Aplicar opciones para ver los cambios.
9. Para editar el contenido de las opciones de asistencia adicionales, haz clic para ampliar la sección Opciones de asistencia adicionales:
   
   • Para mostrar un enlace al portal del cliente, activa el interruptor Mostrar enlace al portal del cliente. En el campo Texto del enlace del portal del cliente, introduce el texto que se mostrará a los visitantes.
   • Para mostrar un inicio de sesión para contenido restringido, activa el interruptor Mostrar inicio de sesión para contenido restringido. Introduce el texto que se mostrará a los visitantes en los campos Texto del enlace de entrada y Texto del enlace de salida.
   • Para mostrar un formulario de asistencia, activa el interruptor Formulario de asistencia y selecciona un formulario en el menú desplegable Formulario. En los campos Enlace de texto del formulario de asistencia y Título del formulario de asistencia, introduce el texto que se mostrará a los visitantes.
   • Haz clic en Aplicar opciones para ver tus cambios.
10. Cuando hayas terminado, haz clic en Publicar en [#] recursos en la parte superior derecha.

Contenido del pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haz clic en el menú desplegable Configurar y selecciona Pie de página.
3. En el editor global de contenidos, haz clic en el icono de siteTree contenidos en la barra lateral izquierda.
4. Para mostrar un menú de pie de página, haz clic en el módulo Menú de pie de página:
   
   • Haz clic en el menú desplegable Menú y selecciona un menú.
   • Para editar un menú de pie de página existente, haz clic en Editar.
   • Para crear un nuevo menú de pie de página, haz clic en Crear nuevo.
   • Para editar el número de elementos del árbol de menús que pueden mostrarse en el menú de pie de página, utiliza los botones upIcon aumentar y downIcon disminuir en el campo Profundidad de visualización del menú. 
   • Para mostrar el menú de pie de página, selecciona la casilla de verificación Mostrar menú.
   • Haz clic en Aplicar opciones para ver los cambios.
5. Para editar el contenido del logotipo del pie de página, haz clic en el módulo Logotipo:
   
   • Para anular el logotipo predeterminado, activa el interruptor Anular logotipo predeterminado o haz clic en Editar logotipo predeterminado en este dominio para actualizar el logotipo predeterminado.
   • Si seleccionaste anular el logotipo predeterminado, puedes hacer clic en Subir o Examinar imágenes para agregar un nuevo logotipo.
   • Para personalizar cómo se carga el logotipo del pie de página, haz clic en el menú desplegable Carga de imágenes y selecciona De forma predeterminada, Perezoso o Ansioso.
   • Para agregar una URL de enlace al logotipo del pie de página, introduce el texto de la URL en el campo URL de enlace.
   • Haz clic en Aplicar opciones para ver los cambios.
6. Para editar el contenido de la dirección de pie de página, haz clic en el módulo Dirección de pie de página:
   
   • Haz clic en Editar en la vista ampliada.
   • Introduce el texto del pie de página en el editor de contenido global.
   • Haz clic en Cerrar vista ampliada en la barra lateral izquierda.
7. Para editar el contenido de seguimiento de redes sociales del pie de página, haz clic en el módulo Seguimiento de redes sociales:
   
   • En la sección Redes sociales, haz clic en el botón editIcon editar o deleteIcon eliminar para editar o eliminar un enlace de redes sociales existente. Para agregar un enlace de redes sociales, haz clic en el botón + Agregar. 
   • Para mostrar iconos de seguimiento de redes sociales, selecciona la casilla de verificación Mostrar iconos.
8. Para editar el contenido del copyright del pie de página, haz clic en el módulo Copyright del pie de página:
   • Haz clic en Editar en la vista ampliada.
   • Introduce el texto del pie de página en el editor de contenido global.
   • Haz clic en Cerrar vista ampliada en la barra lateral izquierda.
9. Cuando hayas terminado, haz clic en Publicar en [#] recursos en la parte superior derecha.