Archivo de configuración

Qiandu lee la configuración de hugo.yaml en el directorio raíz del sitio web de Hugo. En el archivo de configuración puede configurar todas las opciones para su sitio. Puede encontrar el archivo de configuración de este sitio en exampleSite/hugo.yaml para comenzar.

Barra de navegación

menú

El menú en la esquina superior derecha está configurado en menu.main del archivo de configuración:

hugo.yaml

menu:
  main:
    - name: Documentation
      pageRef: /docs
      weight: 1
    - name: Blog
      pageRef: /blog
      weight: 2
    - name: About
      pageRef: /about
      weight: 3
    - name: Search
      weight: 4
      params:
        type: search
    - name: GitHub
      weight: 5
      url: ""
      params:
        icon: github

Hay varios tipos diferentes de elementos de menú:

Link to a page in the site with pageRef
```
- name: Documentation
  pageRef: /docs
```

Link to an external URL with url

- name: GitHub
  url: "https://github.com"

Search bar with type: search

- name: Search
  params:
    type: search

Icon

- name: GitHub
  params:
    icon: github

Estos elementos del menú se pueden ordenar configurando “peso”.

Barra lateral

Barra lateral principal

La barra lateral principal se genera automáticamente a partir de la estructura del directorio content. Para obtener más detalles, vaya a Estructura del directorio.

Enlaces adicionales

Los enlaces adicionales para la barra lateral se configuran en la sección menu.sidebar del archivo de configuración:

hugo.yaml

menu:
  sidebar:
    - name: More
      params:
        type: separator
      weight: 1
    - name: "About"
      pageRef: "/about"
      weight: 2
    - name: "Docs ↗"
      url: "https://gohugo.io/name/"
      weight: 3

Barra lateral derecha

Tabla de contenido

La tabla de contenido se genera automáticamente en función de los títulos del archivo de contenido; esto se puede desactivar configurando toc: false en front matter.

content/docs/guide/configuration.md

---
title: Configuration
toc: false
---

Editar el enlace de esta página

Para configurar el enlace editar esta página, podemos configurar params.editURL.base en el archivo de configuración:

hugo.yaml

params:
  editURL:
    base: "https://github.com/your-username/your-repo/edit/main"

Los enlaces de edición se generarán automáticamente para cada página. Para configurar un enlace de edición para una página específica, puede configurar editURL en la front matter de la página:

content/docs/guide/configuration.md

---
title: Configuration
editURL: "https://example.com/edit/this/page"
---

Footer

Declaración de derechos de autor

Para modificar el texto de derechos de autor que aparece en el pie de página de su sitio web, deberá crear un archivo llamado “i18n/en.yaml”. En este archivo, complete el nuevo texto de derechos de autor, así:

i18n/en.yaml

copyright: "© 2024 Qiandu.org"

Puede encontrar el archivo de ejemplo i18n/en.yaml en el repositorio de GitHub. Además, puede utilizar el formato Markdown en el texto con derechos de autor.

otro

favicon

Si necesita personalizar favicon, coloque el archivo del icono en la carpeta static para anular el [favicon predeterminado en el tema](https:// github.com/imfing/hextra/tree/main/static):

android-chrome-192x192.png
android-chrome-512x512.png
apple-touch-icon.png
favicon-16x16.png
favicon-32x32.png
favicon-dark.svg
favicon.ico
favicon.svg
site.webmanifest

Incluya los archivos favicon.ico y favicon.svg en su proyecto para garantizar que el favicon del sitio web se muestre correctamente.

Si bien favicon.ico generalmente funciona en navegadores más antiguos, favicon.svg es compatible con los navegadores modernos, por lo que un enfoque más moderno sería agregar favicon-dark.svg para funcionar mejor en la experiencia del modo oscuro.

No dudes en utilizar herramientas como favicon.io o favycon para generar estos íconos.

Configuración del tema de color

Utilice la configuración de “tema” para configurar el modo de tema predeterminado y el botón de alternancia que permite a los visitantes cambiar entre el modo claro u oscuro.

hugo.yaml

params:
  theme:
    # light | dark | system
    default: system
    displayToggle: true

Opciones para theme.default:

light - solo usa el modo ligero
dark: solo usa el modo de apariencia
system - sigue el sistema

theme.displayToggle controla la visualización de botones de alternancia para cambiar temas. Cuando se establece en “verdadero”, los visitantes pueden cambiar entre el modo claro u oscuro, anulando la configuración predeterminada.

Ancho de página

El ancho de la página se puede ajustar mediante el parámetro params.page.width en el archivo de configuración:

hugo.yaml

params:
  page:
    # full (100%), wide (90rem), normal (1280px)
    width: wide

Hay tres opciones: full, wide y normal. El modo de ancho de página predeterminado es normal.

De manera similar, el ancho de la barra de navegación y el footer también se pueden ajustar mediante params.navbar.width y params.footer.width.

buscar

La búsqueda de texto completo proporcionada por FlexSearch está habilitada de forma predeterminada. Para personalizar el índice de búsqueda, configure params.search.flexsearch.index en el archivo de configuración:

hugo.yaml

params:
  # Search
  search:
    enable: true
    type: flexsearch

    flexsearch:
      # index page by: content | summary | heading | title
      index: content

Opciones para flexsearch.index:

content - búsqueda de contenido completo
summary - Descripción general Resúmenes de contenido de Hugo
heading - títulos de primer y segundo nivel
title - busca solo el título

Para personalizar la tokenización de búsqueda, configure params.search.flexsearch.tokenize en el archivo de configuración:

params:
    # ...
    flexsearch:
      # full | forward | reverse | strict 
      tokenize: forward

flexsearch.tokenize opciones:

strict - coincidencia estricta de palabras
forward - coincidencia de prefijos de palabras
reverse - coincidencia de prefijos y sufijos de palabras
full: coincidencia de subcadenas de palabras.

Según la lógica de segmentación de palabras predeterminada, una oración china es una “palabra”

Para excluir una página del índice de búsqueda, cambie excludeSearch: true al principio:

content/docs/guide/configuration.md

---
title: Configuration
excludeSearch: true
---

Google Analytics

Para habilitar Google Analytics, configure services.googleAnalytics.ID:

hugo.yaml

services:
  googleAnalytics:
    ID: G-MEASUREMENT_ID

Estructura del directorio Markdown gramática