Personalizar un tema de base de conocimientos

Puede personalizar la apariencia de su base de conocimientos seleccionando el diseño y configurando el tema en el editor de temas. También puede ver cómo aparecerá el tema de su 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 ajustes de la Base de conocimientos , permiso de ajustes globales de contenidos y temas , y una plaza asignada en Service Hubs. Más información sobre los precios por licencia de HubSpot.

Comprender las limitaciones y consideraciones

• Estas herramientas sólo están disponibles para las bases de conocimientos migradas. Más información sobre la migración de su base de conocimientos.
• Para las bases de conocimientos que no se han migrado, obtenga más información sobre cómo crear y personalizar una base de conocimientos heredada.
• 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 haya creado su base de conocimientos, podrá ver el aspecto de su 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, haga clic en el menú desplegable Configurar y seleccione Tema.
3.  Para ver una plantilla con contenido de muestra, haga clic en el menú desplegable Ver en de la parte superior izquierda y seleccione 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, haga clic en el segundo menú desplegable de la parte superior izquierda y seleccione un idioma.

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

Edita 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, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Para cambiar los colores de un tema, haga clic para ampliar la sección Colores . A continuación, introduzca un valor hexadecimal o seleccione un color del selector de colores para loscampos de fondo Primario, Secundario, Acento y Cuerpo . Los colores desu marca se mostrarán para cada opción.
4. Para cambiar la tipografía de un tema, haga clic en Tipografía:
   • En las secciones Primaria y Secundaria , haga clic enel menú desplegable de fuentes y seleccione una fuente. Para cambiar el color de la fuente, haga clic en el selector de color y seleccione 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, haga clic para expandir las secciones Encabezado (H1-H6), Cuerpo o Enlace :
     • Haga clic en el menú desplegable de fuentes y seleccione 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, haga clic en el selector de color y seleccione un color de fuente.
5. Para cambiar el diseño de un tema, haga clic para ampliar la sección Diseño y seleccione una opción (por ejemplo, Mosaicos o Mínimo). Las diferentes opciones de diseño admitirán diferentes opciones de estilo.
6. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Editar los estilos de cabecera de un tema de la Base de conocimientos

Puede editar los estilos de cabecera del tema de su base de conocimientos, incluida la anchura de la cabecera, la barra superior, el conmutador de idiomas, el menú, el botón y la barra de búsqueda. También puede editar colores, fuentes y estilos hover dentro de esos elementos.

Anchura de la cabecera

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

Barra superior de la cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Cabecera en la barra lateral izquierda.
4. En la sección Cabecera , haga clic para ampliar la sección Barra superior .
5. Para editar el color de fondo, introduzca un valor de código hexadecimal o seleccione un color de fondo en el selector de color del campo Color de fondo .
6. Haga clic en el menú desplegable de fuentes y seleccione 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, haga clic en el selector de color y seleccione un color de fuente.
8. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Conmutador de idiomas de cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Cabecera en la barra lateral izquierda.
4. En la sección Cabecera , haga clic en Conmutador de idioma.
5. En la sección Conmutador de idiomas , haga clic en Desplegables.
6. Haga clic para ampliar la sección Antecedentes .
7. Introducir un valor de código hexadecimal o seleccionar un color en el selector de color para los campos Color y Hover . 
8. Para editar la transparencia, introduzca 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 haya terminado, haga clic en Publicar tema en la parte superior derecha.

Menú de cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Cabecera en la barra lateral izquierda.
4. En la sección Cabecera, haga clic en Menú.
5. Para editar los estilos de los desplegables, haga clic en Desplegables:
   • Haga clic para ampliar la sección Fondo e introduzca un valor de código hexadecimal o seleccione un color en el selector de color para los campos Color y Hover . Para editar la transparencia, introduzca un valor porcentual en el segundo campo.
     
   • Haga clic para ampliar la sección Texto . A continuación, haz clic en el menú desplegable de fuentes y selecciona una. 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, haga clic en el selector de color y seleccione un color de fuente.
6. Para editar el estilo de texto de la fuente, haga clic para ampliar la sección Texto :
   • Haga clic en el menú desplegable de fuentes y seleccione 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, haga clic en el selector de color y seleccione un color de fuente.
7. Para editar el color de fondo, haga clic para ampliar la sección Fondo y, a continuación, introduzca un valor de código hexadecimal o seleccione un color en el selector de color.
8. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Botones de cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Cabecera en la barra lateral izquierda.
4. En la sección Cabecera , haga clic en Botón.
5. Para editar la fuente, haga clic para ampliar la sección Texto :
   • Haga clic en el menú desplegable de fuentes y seleccione 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, haga clic en el selector de color y seleccione un color de fuente.
6.  Para editar el fondo, haga clic para ampliar la sección Fondo e introduzca un valor de código hexadecimal o seleccione un color en el selector de color. Para editar la transparencia, introduzca un valor porcentual.
7. Para editar el estilo del borde, haga clic para expandir la sección Borde , haga clic en el menú desplegable Estilo y seleccione un estilo de borde (por ejemplo, Raya).
8. Para editar el estilo de la esquina, haga clic para ampliar la sección Esquina . A continuación, introduzca un valor en píxeles (por ejemplo, 30px) en el campo Radio .
9. Para editar el estilo hover, haga clic en Hover:
   • Haga clic para ampliar la sección Texto .
     • Para cambiar el color de la fuente, haga clic en el selector de color y seleccione un color de fuente.
     • Para aplicar estilos de texto de fuente, seleccione el icono italicizeIcon cursiva o el icono underlineIcon subrayado.
   • Haga clic para ampliar la sección Fondo e introduzca un valor de código hexadecimal o seleccione un color en el selector de color. Para editar la transparencia, introduzca un valor porcentual.
   • Haga clic para ampliar la sección Borde y, a continuación, haga clic en el menú desplegable Estilo para seleccionar un estilo de borde (por ejemplo, Punteado).
10. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Barra de búsqueda en la cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Cabecera en la barra lateral izquierda.
4. En la sección Cabecera , haga clic en Barra de búsqueda.
5. Para editar el fondo, haga clic para ampliar la sección Fondo: y, a continuación, haga 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, haga clic para ampliar la sección Texto de etiqueta :
   • Haga clic en el menú desplegable de fuentes y seleccione 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, haga clic en el selector de color y seleccione un color de fuente.
7. Para editar el estilo de fuente de entrada, haga clic para expandir la sección Entrada y, a continuación, introduzca un valor de código hexadecimal o haga clic en el selector de color para seleccionar un color. Para editar la transparencia, introduzca un valor porcentual.
8. Cuando haya terminado, haga 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 sociales. También puede editar colores, fuentes y estilos hover 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, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Pie de página en la barra lateral izquierda.
4. Para cambiar el ancho del pie de página, seleccione 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, introduzca un valor de código hexadecimal o haga clic en el selector de color 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, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Pie de página en la barra lateral izquierda.
4. En la sección Pie de página , haga clic para ampliar la sección Menú .
5. Para editar los estilos de fuente del menú, haga clic en el menú desplegable de fuentes y seleccione una fuente de . 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, haga clic en el selector de color y seleccione un color de fuente.
7. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Texto a pie de página

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Tema.
3. Haga clic en Pie de página en la barra lateral izquierda.
4. En la sección Pie de página , haga clic para ampliar la sección Texto .
5. Para editar los estilos de fuente del menú, haga clic en el menú desplegable de fuentes y seleccione una fuente de . 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, haga clic en el selector de color y seleccione un color de fuente.
7. Cuando haya terminado, haga clic en Publicar tema en la parte superior derecha.

Iconos sociales a pie de página

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

Editar el contenido de un tema de la Base de conocimientos

Puede editar el contenido de la cabecera y el pie de página de su base de conocimientos. Los cambios publicados serán visibles en todas las páginas de la base de conocimientos.

Contenido de la cabecera

1. En tu cuenta de HubSpot, ve a Servicio al cliente > Base de conocimientos.
2. En la parte superior derecha, haga clic en el menú desplegable Configurar y seleccione Cabecera.
3. En el editor global de contenidos, haga clic en el icono siteTree en la barra lateral izquierda.
4. En la barra lateral izquierda, haga clic en el módulo Cabecera del sitio web .
5. Para editar el contenido del logotipo de la cabecera, haga clic para ampliar la sección Logotipo :
   • Para anular el logotipo predeterminado, active el interruptor Anular logotipo predeterminado o haga clic en Editar logotipo predeterminado en este dominio para actualizar el logotipo predeterminado.
   • Si ha seleccionado anular el logotipo predeterminado, puede hacer clic en Subir o Examinar imágenes para añadir un nuevo logotipo.
   • Para mostrar el nombre de su empresa cuando el logotipo no está ajustado, active la casilla Mostrar el nombre de la empresa cuando el logotipo no está ajustado.
   • Para añadir un enlace URL a su logotipo, introduzca una URL en el campo Enlace .
   • Haga clic en Aplicar opciones para ver los cambios.
6. Para editar el contenido del menú de cabecera, haga clic para ampliar la sección Menú :
   
   • Para mostrar un menú de cabecera, haga clic en el menú desplegable Menú y seleccione un menú.
   • Para editar un menú de cabecera existente, haga clic en Editar.
   • Para crear un nuevo menú de cabecera, haga clic en Crear nuevo.
   • Para editar el número de elementos del árbol de menús que pueden mostrarse en el menú de cabecera, utilice las teclas upIcon aumentar y downIcon en el campo Niveles máximos . 
   • Haga clic en Aplicar opciones para ver los cambios.
7. Para editar el contenido del botón de cabecera, haga clic en Botón:
   
   • Para añadir un botón a la cabecera, seleccione la casilla de verificación Añadir botón .
   • Para editar el texto del botón de la cabecera, introduzca el texto en el campo Texto del botón . 
   • Para editar el enlace URL del botón, haga clic en el menú desplegable Enlace a y seleccione 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, active el interruptor Abrir enlace en ventana nueva . 
   • Para editar el tipo de enlace del botón, seleccione la casilla de verificación situada junto a No seguir.
   • Para añadir un icono al botón, seleccione la casilla de verificación Añadir icono :
     • Haga clic en Reemplazar para cambiar el icono del botón. 
     • Haga clic en el menú desplegable Posición y seleccione la posición del icono del botón.
   • Haga clic en Aplicar opciones para ver los cambios.
8. Para editar el contenido del conmutador de idiomas, haga clic para ampliar la sección Conmutador de idiomas :
   
   • Para añadir el conmutador de idiomas a la cabecera, seleccione la casilla de verificación Añadir conmutador de idiomas .
   • Para editar el modo de visualización del conmutador de idiomas, haga clic en el menú desplegable Modo de visualización y seleccione una opción (por ejemplo, Localizado, PageLang, Híbrido).
   • Haga clic en Aplicar opciones para ver los cambios.
9. Para editar el contenido de las opciones de asistencia adicionales , haga clic para ampliar la sección Opciones de asistencia adicionales :
   
   • Para mostrar un enlace al portal del cliente, active el interruptor Mostrar enlace al portal del cliente . En el campo Texto del enlace del portal del cliente , introduzca el texto que se mostrará a los visitantes.
   • Para mostrar un inicio de sesión para contenido restringido, active el interruptor Mostrar inicio de sesión para contenido restringido . Introducir 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, active el interruptor Formulario de asistencia y, a continuación, seleccione un formulario en el menú desplegable Formulario . En los campos Enlace de texto del formulario de soporte y Título del formulario de soporte , introduzca el texto que se mostrará a los visitantes.
   • Haga clic en Aplicar opciones ver sus cambios.
10. Cuando haya terminado, haga 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, haga clic en el menú desplegable Configurar y seleccione Pie de página.
3. En el editor global de contenidos, haga clic en el icono siteTree en la barra lateral izquierda.
4. Para mostrar un menú de pie de página, haga clic en el módulo Menú de pie de página :
   
   • Haga clic en el menú desplegable Menú y seleccione un menú.
   • Para editar un menú de pie de página existente, haga clic en Editar.
   • Para crear un nuevo menú de pie de página, haga 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, utilice los botones upIcon aumentar y downIcon en el campo Profundidad de visualización del menú . 
   • Para mostrar el menú de pie de página, seleccione la casilla de verificación Mostrar menú.
   • Haga clic en Aplicar opciones para ver los cambios.
5. Para editar el contenido del logotipo del pie de página, haga clic en el módulo Logotipo :
   
   • Para anular el logotipo predeterminado, active el interruptor Anular logotipo predeterminado o haga clic en Editar logotipo predeterminado en este dominio para actualizar el logotipo predeterminado.
   • Si ha seleccionado anular el logotipo predeterminado, puede hacer clic en Subir o Examinar imágenes para añadir un nuevo logotipo.
   • Para personalizar cómo se carga el logotipo del pie de página, haga clic en el menú desplegable Carga de imágenes y seleccione De forma predeterminada, Perezoso o Ansioso.
   • Para añadir una URL de enlace al logotipo del pie de página, introduzca el texto de la URL en el campo URL de enlace .
   • Haga clic en Aplicar opciones para ver los cambios.
6. Para editar el contenido de la dirección de pie de página, haga clic en el módulo Dirección de pie de página :
   
   • Haga clic en Editar en la vista ampliada.
   • Introducir el texto del pie de página en el editor de contenido global.
   • Haga clic en Cerrar vista ampliada en la barra lateral izquierda.
7. Para editar el contenido de seguimiento social del pie de página, haga clic en el módulo Seguimiento social :
   
   • En la sección Redes sociales , haga clic en el botón editIcon editar o deleteIcon eliminar para editar o eliminar un enlace social existente. Para añadir un enlace social, haga clic en el botón + Añadir . 
   • Para mostrar iconos de seguimiento de redes sociales, seleccione la casilla de verificación Mostrar iconos .
8. Para editar el contenido del copyright del pie de página, haga clic en el módulo Copyright del pie de página :
   • Haga clic en Editar en la vista ampliada.
   • Introducir el texto del pie de página en el editor de contenido global.
   • Haga clic en Cerrar vista ampliada en la barra lateral izquierda.
9. Cuando haya terminado, haga clic en Publicar en [#] recursos en la parte superior derecha.