Página principal

Descargo de responsabilidad: Este artículo se generó mediante traducción automática.

Plans supporting customization of knowledge base site

Free
Professional
Business
Enterprise








La página de inicio (anteriormente "Creador de páginas de inicio") es la primera página que verá un usuario final cuando visite su base de conocimientos. La página de inicio le permite personalizar su página de inicio agregando enlaces, cambiando colores, incluyendo categorías de su base de conocimientos y más.


Página principal del sitio de Document360 KB

1_Screenshot-Document360_landing_page

NOTA

El encabezado, la navegación principal y secundaria y el pie de página aparecen en la página de inicio, pero se configuran en Configuración () > Personalizar el encabezado y el pie de página > del sitio.


Acceso a la configuración de diseño de la página de inicio

  1. Vaya a Configuración () > sitio de la base de conocimientos > Personalizar sitio en el portal de la base de conocimientos.

    Aparecerá la página Personalizar sitio , que contiene todas las configuraciones básicas de diseño del sitio.

  2. Haga clic en el botón Personalizar sitio .

  3. Seleccione Inicio en el menú desplegable de la izquierda.

    Un diseño de página de inicio predeterminado está disponible para que lo personalice. Las diferentes secciones de la página de inicio se enumeran a la izquierda y una vista previa en vivo está disponible a la derecha.

  4. Si es necesario, haga clic en Agregar sección y elija una de las opciones disponibles:

  1. Puede reordenar la sección en el panel izquierdo arrastrando y soltando () y haciendo clic en el icono del ojo () para ocultar el elemento deseado.

NOTA

La sección principal del héroe en la parte superior no se puede arrastrar ni mover.

  1. Haga clic en Guardar para guardar los cambios.

  2. Haga clic en Publicar para activar los cambios realizados en el portal en el sitio de la base de conocimientos.

NOTA

El botón Publicar se activa solo después de guardar los cambios.

Customizing the home page of the Knowledge base site.


Temas de la página de inicio

NOTA

Solo puede configurar los temas de la página de inicio si tiene un plan profesional, comercial o empresarial.

Personalice su página de inicio con los temas de Document360. Puede configurar un tema único para cada espacio de trabajo o idioma.

  1. Haga clic en el icono Temas () en la página de diseño de la página de inicio

  2. Seleccione uno de los temas: Participar, Innovar, Aprender o Predeterminado.

  3. Haga clic en el icono de ojo () para ver una vista previa estática.

  4. Haga clic en Activar para implementar el tema seleccionado.

Customizing the home page of the Knowledge base site.


SEO de la página de inicio

Puedes usar un meta título, una meta descripción y una imagen destacada para tu página de inicio.

En la página de personalización de la página de inicio ,

  1. Haga clic en el icono Configuración () en la página de diseño de la página de inicio.

    Aparecerá el panel Configuración .

  2. Puede ingresar el título y la meta descripción deseados para su página de inicio.

  3. Active el botón de alternancia Configuración de visibilidad .

    La página de inicio no será visible en la base de conocimientos cuando la configuración de visibilidad esté desactivada

  4. Para añadir una imagen destacada de Drive, haz clic en Elegir imagen.

  5. Haga clic en Guardar.

Customizing the home page of the Knowledge base site.


Preguntas frecuentes

¿Cómo agrego imágenes a la página de inicio?

Para agregar imágenes a la página de inicio, pegue el siguiente código en el Custom HTML:

<img src="paris.jpg" alt="Paris" class="center">

Para personalizar la alineación, agregue el siguiente código CSS en la sección Custom CSS & JavaScript :

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

¿Cómo cambio la posición de la barra de búsqueda para que se refleje en el sitio de la base de conocimientos?

Para ajustar la posición de la barra de búsqueda en el sitio de la base de conocimientos, siga estos pasos:

  1. Vaya a Configuración () > sitio de la base de conocimientos > Personalizar sitio en el portal de la base de conocimientos.

  2. Haz clic en Personalizar sitio. Seleccione el menú desplegable y haga clic en Documentación.

  3. En el panel izquierdo, tiene dos opciones para cambiar la posición de la barra de búsqueda.

    Panel izquierdo: Coloque la barra de búsqueda en el árbol de categorías en el lado izquierdo.

    Encabezado secundario: Coloque la barra de búsqueda en el lado derecho del encabezado secundario.

  4. Si es necesario, marque la casilla Agregar color de fondo para aplicar el color de fondo a la barra de búsqueda.

  5. Una vez hecho esto, haga clic en Guardar y publicar.

¿Cómo cambio el título de la pestaña del navegador para la página de inicio de mi base de conocimientos?


Para cambiar la etiqueta de título de la página principal del sitio de la base de conocimientos, siga estos pasos:

  1. Vaya a Configuración () > sitio de la base de conocimientos > Personalizar sitio en el portal de la base de conocimientos.

    Aparecerá la página Personalizar sitio , que contiene todas las configuraciones básicas de diseño del sitio.

  2. Haga clic en el botón Personalizar sitio .

  3. En el menú desplegable de la izquierda, seleccione Inicio.

  4. Haga clic en el icono Configuración () en la página de inicio.

    Aparecerá el panel Configuración .

  5. Introduzca el título deseado para su página de inicio.

  6. Una vez hecho esto, haga clic en Guardar y publicar.

¿Cómo integrar un cargador de video en tu página de inicio?

Agregar un cargador de video visualmente atractivo a su página de inicio puede crear una sensación de curiosidad e interactividad para sus visitantes. Siga estos sencillos pasos para integrar sin problemas un cargador de vídeo:

  1. Vaya a Configuración () > sitio de la base de conocimientos > Personalizar sitio en el portal de la base de conocimientos.

    Aparecerá la página Personalizar sitio , que contiene todas las configuraciones básicas de diseño del sitio.

  2. Haga clic en el botón Personalizar sitio .

  3. En el menú desplegable de la izquierda, seleccione Inicio.

  4. Crea una nueva sección de código personalizado e inserta el siguiente código HTML, reemplazando el src enlace con el enlace de video de tu unidad:

    htmlCopy code<div class="video__loader">
        <video muted autoplay loop>
            <source src="https://cdn.document360.io/560b3c6e-18a1-4ad6-babc-d0257662eab2/Images/Documentation/Revolving_Video.mp4" />
        </video>
    </div>

    Este código integrará a la perfección el cargador de video en su página de inicio, mejorando su atractivo visual y cautivando a su audiencia desde el momento en que lleguen.

  5. En el menú desplegable de la izquierda, selecciona CSS/JavaScript personalizado y navega hasta la pestaña CSS .

  6. Reemplace "Innovate" en el siguiente fragmento de código con el nombre de su tema configurado (por ejemplo, Engage, Learn, Innovate o Default):

    cssCopy codebody.innovate {
        position: relative;
        overflow: hidden !important;
    }
    
    body.innovate.custom--loaded {
        overflow: auto !important;
    }
    
    /* Loader */
    .video__loader {
        width: 100%;
        min-height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
        position: fixed;
        top: 0;
        left: 0;
        background: var(--color-dark);
        opacity: 1;
        visibility: visible;
        z-index: 9999999999;
        transition: all 1s ease;
    }
    
    .video__loader.remove--loader {
        opacity: 0;
        visibility: hidden;
    }
    
    .video__loader video {
        width: 100%;
    }

    Esto garantiza que el estilo CSS se alinee con el tema elegido, optimizando la presentación visual para mejorar la experiencia del usuario.

  7. Vaya a la pestaña JavaScript .

  8. Reemplace "innovate" en el siguiente fragmento de código con el nombre de su tema:

    javascriptCopy code/* Loader */
    var elBody = document.querySelector("body.innovate");
    var customLoaderVideo = document.querySelector(".video__loader");
    
    document.addEventListener("DOMContentLoaded", function() {
        setTimeout(function() {
            elBody?.classList.add("custom--loaded");
            customLoaderVideo?.classList.add("remove--loader");
        }, 5000);
    });

    Esta personalización garantiza que la funcionalidad de JavaScript se integre a la perfección con su tema, mejorando el rendimiento general de su sitio.

NOTA

La función de cargador de vídeo funcionará exclusivamente en la página de inicio y no se aplicará a las páginas de documentación.