@giscusgiscus

giscus

Un sistema de comentarios desarrollado con Discusiones de GitHub. ¡Permite a tus visitantes dejar comentarios y reacciones en su sitio web a través de GitHub! Inspirado en utterances.

Nota:
giscus todavía está en desarrollo activo. GitHub también sigue desarrollando activamente Discusiones y su API. Por lo tanto, algunas características de giscus pueden romperse o cambiar con el tiempo.

Cómo funciona

Cuando se carga giscus, la API de búsqueda de discusiones de GitHub se usa para encontrar la discusión asociada con la página en función de la forma de mapeo elegida (URL, pathname, <title>, etc.). Si no se puede encontrar una discusión que coincida, el bot giscus creará automáticamente una discusión la primera vez que alguien deje un comentario o una reacción.

Para comentar, los visitantes deben autorizar la aplicación de giscus para publicar en su nombre utilizando el flujo de GitHub OAuth. Alternativamente, los visitantes pueden comentar sobre la Discusión de GitHub directamente. Puede moderar los comentarios en GitHub.

Configuración

Idioma

Selecciona el idioma en el que se mostrará giscus. ¿No encuentras tu idioma? Puedes Contribuir con la traducción.

Repositorio

Selecciona el repositorio al que se conectará giscus. Asegúrate de lo siguiente:

  1. El repositorio es público, de lo contrario, tus visitantes no podrán ver los comentarios.
  2. La aplicación de giscus está instalada, de lo contrario, tus visitantes no podrán comentar ni reaccionar.
  3. La función de Discusiones está activa en tu repositorio.

Un repositorio público de GitHub. Es el repositorio donde se vincularán las discusiones.

Página ↔️ Mapeo de discusiones

Elige la forma de mapeo entre la página y las discusiones

giscus buscará una discusión cuyo título contenga el pathname de la página.

giscus buscará una discusión cuyo título contenga la URL de la página.

giscus buscará una discusión cuyo título contenga la etiqueta HTML <title> de la página.

giscus buscará una discusión cuyo título contenga el valor de la etiqueta HTML <meta property="og:title">.

giscus buscará una discusión cuyo título contenga el término especificado.

giscus cargará una discusión específica por número. Esta opción no admite la creación automática de discusiones.

Evita discrepancias debido al método de búsqueda difuso de GitHub cuando hay varias discusiones con títulos similares. Consulta la documentación para obtener más detalles.

Categoría de discusión

Selecciona la categoría donde se crearán nuevas discusiones. Se recomienda usar una categoría con el tipo Announcement para que solo los mantenedores y giscus puedan crear nuevas discusiones.

Al buscar una discusión, giscus exclusivamente buscará en esta categoría.

Características

Selecciona las funcionalidades específicas que quieres habilitar.

Las reacciones de la publicación principal se mostrarán antes de los comentarios.

Los metadatos de discusión se enviarán periódicamente a la ventana principal (la página de incrustación). Para una demostración, habilita esta opción y abre la consola de tu navegador en esta página. Consulta la documentación para obtener más detalles.

El cuadro de entrada de comentarios se colocará encima de los comentarios para que los usuarios puedan dejar un comentario sin desplazarse hasta el final de la discusión.

La carga de los comentarios se aplazará hasta que el usuario se desplace cerca del contenedor de comentarios. Esto se hace agregando loading="lazy" al elemento <iframe>.

Tema

Selecciona un tema que coincida con tu sitio web. ¿No puedes encontrar uno que lo haga? Contribuye con un tema nuevo.

Habilitar giscus

Añade la siguiente etiqueta <script> a la plantilla de tu sitio web donde quieras que aparezcan los comentarios. Si existe un elemento con la clase giscus, los comentarios se mostrarán allí.

No has configurado tu repositorio y/o categoría. Los valores de esos campos no se mostrarán hasta que los completes.
<script src="https://giscus.app/client.js"
        data-repo="[URL REPOSITORIO]"
        data-repo-id="[ID REPOSITORIO]"
        data-category="[NOMBRE CATEGORÍA]"
        data-category-id="[ID CATEGORÍA]"
        data-mapping="pathname"
        data-strict="0"
        data-reactions-enabled="1"
        data-emit-metadata="0"
        data-input-position="bottom"
        data-theme="preferred_color_scheme"
        data-lang="es"
        crossorigin="anonymous"
        async>
</script>

Puedes personalizar el diseño del contenedor utilizando los selectores .giscus y .giscus-frame de la página de incrustación.

Si estás usando giscus, considera recomendar 🌟 giscus en GitHub y agregar el tópico giscus a tu repositorio! 🎉

Uso avanzado

Puedes agregar configuraciones adicionales (por ejemplo, permitir orígenes específicos) siguiendo la guía de uso avanzado.

Para usar giscus con React, Vue o Svelte, consulta la biblioteca de componentes de giscus.

Migrando

Si has utilizado anteriormente otros sistemas que usan GitHub Issues (p.ej. utterances, gitalk), puedes convertir los issues existentes en discusiones. Después de la conversión, asegúrate de que el mapeo entre los títulos de la discusión y las páginas sea correcto, entonces giscus utilizará automáticamente las discusiones.

Sitios que usan giscus

Contribución

Ver CONTRIBUTING.md

Pruébalo 👇👇👇

Powered by Vercel