✨ feat: add support for giscus and utterances
welpo
2 years ago
parent
3e215e18e2
commit
5993e950c7
@ -0,0 +1,93 @@
|
||||
+++
|
||||
title = "Afegeix comentaris a les teves publicacions amb giscus o utterances"
|
||||
date = 2023-07-14
|
||||
description = "Descobreix com habilitar una secció de comentaris a les teves publicacions utilitzant giscus o utterances, permetent la interacció i feedback dels lectors."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["funcionalitat", "tutorial"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
|
||||
tabi actualment suporta dos sistemes de comentaris: [giscus](https://giscus.app/ca) i [utterances](https://utteranc.es/).
|
||||
|
||||
giscus i utterances són projectes de codi obert que et permeten afegir una secció de comentaris al teu lloc web utilitzant les «issues» (utterances) o «discussions» (giscus) de GitHub. Són perfectes per a generadors de llocs estàtics com Zola, ja que permeten als teus lectors interactuar i deixar comentaris a les teves publicacions sense requerir un backend tradicional o una base de dades.
|
||||
|
||||
Com que tots dos es basen en GitHub, giscus i utterances requereixen que els usuaris tinguin un compte a GitHub i autoritzin l'aplicació respectiva. Alternativament, els visitants també poden comentar directament en la discussió o «issue» corresponent a GitHub.
|
||||
|
||||
Ambdues són excel·lents eines per afegir comentaris al teu blog, però giscus té alguns avantatges:
|
||||
- Més temes.
|
||||
- Suport per a reaccions.
|
||||
- Respostes a comentaris i vista de conversa.
|
||||
- Més segur: utterances requereix habilitar estils en línia no segurs («unsafe inline styles») per establir l'altura del frame; giscus no.
|
||||
- Suport multilingüe: utterances només està disponible en anglès; giscus suporta més de 20 idiomes.
|
||||
- Desenvolupament més actiu: l'últim commit de giscus, en el moment d'aquesta publicació, va ser fa una setmana. L'últim commit d'utterances es va fer fa més d'un any.
|
||||
|
||||
## Configuració
|
||||
|
||||
Tots dos sistemes requereixen una configuració similar. Primer, visita el lloc web del sistema que vols habilitar: [giscus.app](https://giscus.app/ca) o [utteranc.es](https://utteranc.es/).
|
||||
|
||||
Segueix les instruccions de la secció **Configuració** del lloc web, i tria les opcions que prefereixis. Finalment, estableix els valors que es mostren a la secció **Habilitar giscus/utterances** (el bloc de codi `script`) en la secció corresponent del teu `config.toml`: `[extra.giscus]` o `[extra.utterances]`.
|
||||
|
||||
### Giscus
|
||||
|
||||
giscus té més opcions que utterances:
|
||||
|
||||
```toml
|
||||
[extra.giscus]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "elTeuNomDUsuariDeGithub/elTeuRepositori"
|
||||
repo_id = "LaTevaIDdeRepositori"
|
||||
category = "Anuncis"
|
||||
category_id = "LaTevaIDdeCategoria"
|
||||
mapping = "slug"
|
||||
strict_title_matching = 1 # 1 per habilitar, 0 per deshabilitar.
|
||||
enable_reactions = 1 # 1 per habilitar, 0 per deshabilitar.
|
||||
comment_box_above_comments = true
|
||||
light_theme = "noborder_light"
|
||||
dark_theme = "noborder_dark"
|
||||
lang = "" # Deixa en blanc perquè coincideixi amb l'idioma de la pàgina.
|
||||
lazy_loading = true
|
||||
```
|
||||
### utterances
|
||||
|
||||
```
|
||||
[extra.utterances]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "elTeuNomDUsuariDeGithub/elTeuRepositori"
|
||||
issue_term = "slug"
|
||||
label = "💬"
|
||||
light_theme = "github-light"
|
||||
dark_theme = "photon-dark"
|
||||
lazy_loading = true
|
||||
```
|
||||
### Configuracions comunes
|
||||
|
||||
La opció `enabled_for_all_posts = true` habilita globalment el sistema de comentaris corresponent.
|
||||
|
||||
Alternativament, pots habilitar els comentaris de publicacions concretes afegint `utterances = true` o `giscus = true`. Per exemple, així és com habilitaries giscus:
|
||||
|
||||
```toml,hl_lines=09-10
|
||||
+++
|
||||
title = "L'art de l'entremaliadura segons Shin-Chan
|
||||
date = 1990-02-14
|
||||
description = "Descobreix com les travessures poden canviar la teva perspectiva de vida."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["personal", "travessures"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
```
|
||||
|
||||
Si accidentalment habilitas tots dos sistemes, Zola mostrarà un error.
|
||||
|
||||
Si el teu lloc web té múltiples idiomes amb publicacions coincidents (com aquesta demo), i t'agradaria compartir comentaris entre idiomes, has d'utilitzar `issue_term = "slug"`. Això utilitzarà el nom de l'arxiu Markdown (sense l'etiqueta d'idioma) com a identificador. Totes les altres opcions crearan diferents seccions de comentaris per a cada idioma.
|
||||
|
||||
## Exemple en viu
|
||||
|
||||
A continuació trobaràs el widget de giscus amb la configuració mostrada [a dalt](#giscus).
|
||||
@ -0,0 +1,96 @@
|
||||
+++
|
||||
title = "Añade comentarios a tus publicaciones con giscus o utterances"
|
||||
date = 2023-07-14
|
||||
description = "Descubre cómo habilitar una sección de comentarios en tus publicaciones usando giscus o utterances, permitiendo la interacción y feedback de los lectores."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["funcionalidad", "tutorial"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
|
||||
tabi actualmente soporta dos sistemas de comentarios: [giscus](https://giscus.app/es) y [utterances](https://utteranc.es/).
|
||||
|
||||
giscus y utterances son proyectos de código abierto que te permiten añadir una sección de comentarios a tu sitio web usando las «issues» (utterances) o «discussions» (giscus) de GitHub. Son perfectos para generadores de sitios estáticos como Zola, ya que permiten a tus lectores interactuar y dejar comentarios en tus publicaciones sin requerir un backend tradicional ni una base de datos.
|
||||
|
||||
Al estar basados en GitHub, giscus y utterances requieren que los usuarios tengan una cuenta en dicha plataforma y autoricen la respectiva aplicación. Alternativamente, los visitantes también pueden comentar directamente en la discusión o «issue» correspondiente de GitHub.
|
||||
|
||||
Ambas son excelentes herramientas para agregar comentarios a tu blog, pero giscus tiene algunas ventajas:
|
||||
- Más temas.
|
||||
- Soporte para reacciones.
|
||||
- Respuestas a comentarios y vista de conversación.
|
||||
- Más seguro: utterances requiere habilitar estilos en línea inseguros («unsafe inline styles») para ajustar la altura del frame; giscus no.
|
||||
- Soporte multilingüe: utterances solo está disponible en inglés; giscus soporta más de 20 idiomas.
|
||||
- Desarrollo más activo: el último commit de giscus, a fecha de esta publicación, fue hace una semana. El último commit de utterances fue hace más de un año.
|
||||
|
||||
## Configuración
|
||||
|
||||
Cada sistema de comentarios requiere una configuración similar. Primero, visita el sitio web del sistema que quieres habilitar: [giscus.app](https://giscus.app/es) o [utteranc.es](https://utteranc.es/).
|
||||
|
||||
Sigue las instrucciones de la sección **Configuración** del sitio web, y elige las opciones que prefieras. Luego, establece los valores que se muestran en la sección **Habilitar giscus/utterances** (el bloque de código `script`) en la sección correspondiente de tu `config.toml`: `[extra.giscus]` o `[extra.utterances]`.
|
||||
|
||||
### giscus
|
||||
|
||||
giscus tiene algunos ajustes más que utterances:
|
||||
|
||||
```toml
|
||||
[extra.giscus]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "tuNombreDeUsuarioDeGithub/tuRepositorio"
|
||||
repo_id = "TuIDdeRepositorio"
|
||||
category = "Anuncios"
|
||||
category_id = "TuIDdeCategoría"
|
||||
mapping = "slug"
|
||||
strict_title_matching = 1 # 1 para habilitar, 0 para deshabilitar.
|
||||
enable_reactions = 1 # 1 para habilitar, 0 para deshabilitar.
|
||||
comment_box_above_comments = true
|
||||
light_theme = "noborder_light"
|
||||
dark_theme = "noborder_dark"
|
||||
lang = "" # Deja en blanco para que coincida con el idioma de la página.
|
||||
lazy_loading = true
|
||||
```
|
||||
|
||||
### utterances
|
||||
|
||||
```
|
||||
[extra.utterances]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "tuNombreDeUsuarioDeGithub/tuRepositorio"
|
||||
issue_term = "slug"
|
||||
label = "💬"
|
||||
light_theme = "github-light"
|
||||
dark_theme = "photon-dark"
|
||||
lazy_loading = true
|
||||
```
|
||||
|
||||
### Ajustes comunes
|
||||
|
||||
La opción `enabled_for_all_posts = true` habilitará globalmente el sistema de comentarios correspondiente.
|
||||
|
||||
Alternativamente, puedes habilitar los comentarios en publicaciones concretas con `utterances = true` o `giscus = true`. Por ejemplo, así habilitarías giscus:
|
||||
|
||||
```toml,hl_lines=09-10
|
||||
+++
|
||||
title = "Los molinos de viento de mi vida: reflexiones de un escudero"
|
||||
date = 1605-01-16
|
||||
description = "Mi viaje junto a Don Quijote, enfrentándome a gigantes imaginarios y descubriendo las verdaderas batallas de la vida."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["personal", "reflexiones"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
```
|
||||
|
||||
Si accidentalmente habilitas ambos sistemas, Zola mostrará un error.
|
||||
|
||||
Si tu web tiene múltiples idiomas con publicaciones coincidentes (como esta demo), y te gustaría compartir comentarios entre idiomas, debes usar `issue_term = "slug"`. Esto usará el nombre del archivo Markdown (sin la etiqueta de idioma) como identificador. Todas las demás opciones crearán diferentes secciones de comentarios para cada idioma.
|
||||
|
||||
|
||||
## Ejemplo en vivo
|
||||
|
||||
Al final de esta publicación encontrarás el widget de giscus usando los ajustes mostrados [arriba](#giscus).
|
||||
@ -0,0 +1,95 @@
|
||||
+++
|
||||
title = "Add comments to your posts with giscus or utterances"
|
||||
date = 2023-07-14
|
||||
description = "Discover how to enable a comments section on your posts using giscus or utterances, enabling reader interaction and feedback."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["showcase", "tutorial"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
|
||||
tabi currently supports two comment systems: [giscus](https://giscus.app/) and [utterances](https://utteranc.es/).
|
||||
|
||||
giscus and utterances are open-source projects that let you add a comments section to your website using GitHub issues (utterances) or discussions (giscus). They are perfect for static site generators like Zola, since they enable your readers to interact and leave comments on your posts without requiring a traditional backend or database.
|
||||
|
||||
As they are based on GitHub, giscus and utterances require users to have a GitHub account and authorize the respective app. Alternatively, visitors can also comment directly on the corresponding GitHub discussion or issue.
|
||||
|
||||
Both are great tools for adding comments to your blog, but giscus has a few advantages:
|
||||
- More themes.
|
||||
- Support for reactions.
|
||||
- Comment replies and conversation view.
|
||||
- Safer: utterances requires enabling unsafe inline styles to set the height of the frame; giscus doesn't.
|
||||
- Multilanguage support: utterances is only available in English; giscus supports over 20 languages.
|
||||
- More active development: giscus' last commit, as of this post, was a week ago. utterances' last commit was over a year ago.
|
||||
|
||||
## Setup
|
||||
|
||||
The configuration of both systems is quite similar. First, visit the website of the system you want to enable: [giscus.app](https://giscus.app/) or [utteranc.es](https://utteranc.es/).
|
||||
|
||||
Follow the instructions on the **Configuration** section of the website, and set it up it to your liking. Then, set the values shown on the **Enable giscus/utterances** section (the `script` codeblock) on the proper section of your `config.toml`: `[extra.giscus]` or `[extra.utterances]`.
|
||||
|
||||
### giscus
|
||||
|
||||
giscus has a few more settings than utterances:
|
||||
|
||||
```toml
|
||||
[extra.giscus]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "yourGithubUsername/yourRepo"
|
||||
repo_id = "YourRepoID"
|
||||
category = "Announcements"
|
||||
category_id = "YourCategoryID"
|
||||
mapping = "slug"
|
||||
strict_title_matching = 1 # 1 to enable, 0 to disable.
|
||||
enable_reactions = 1 # 1 to enable, 0 to disable.
|
||||
comment_box_above_comments = true
|
||||
light_theme = "noborder_light"
|
||||
dark_theme = "noborder_dark"
|
||||
lang = "" # Leave blank to match the page's language.
|
||||
lazy_loading = true
|
||||
```
|
||||
|
||||
### utterances
|
||||
|
||||
```toml
|
||||
[extra.utterances]
|
||||
enabled_for_all_posts = false
|
||||
automatic_loading = true
|
||||
repo = "yourgithubuser/yourrepo"
|
||||
issue_term = "slug"
|
||||
label = "💬"
|
||||
light_theme = "github-light"
|
||||
dark_theme = "photon-dark"
|
||||
lazy_loading = true
|
||||
```
|
||||
|
||||
### Common settings
|
||||
|
||||
Setting `enabled_for_all_posts = true` for either comment system will enable it globally.
|
||||
|
||||
Alternatively, enable comments on an individual post's front matter by adding `utterances = true` or `giscus = true`. For example, this is how you would enable giscus:
|
||||
|
||||
```toml,hl_lines=09-10
|
||||
+++
|
||||
title = "Bears, Beets, Battlestar Galactica: The Dwight Schrute Guide to Life"
|
||||
date = 2007-04-26
|
||||
description = "Lessons learned from beet farming and paper sales."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["personal", "beets"]
|
||||
|
||||
[extra]
|
||||
giscus = true
|
||||
+++
|
||||
```
|
||||
|
||||
If you accidentally enable both systems, your site will fail to build with an error.
|
||||
|
||||
If your site has multiple languages with matching posts (like this demo), and you'd like to share comments between languages, you must use `issue_term = "slug"`. This will use the name of the Markdown file (sans the language tag) as the identifier. All other options will create different comment sections for each language.
|
||||
|
||||
## Live example
|
||||
|
||||
Below you'll find the giscus widget using the settings shown [above](#giscus).
|
||||
@ -1,22 +1,31 @@
|
||||
+++
|
||||
title = "Sense JavaScript obligatori"
|
||||
date = 2023-01-06
|
||||
updated = 2023-07-08
|
||||
updated = 2023-07-13
|
||||
description = "JavaScript només s'utilitza quan HTML i CSS no són suficients."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["funcionalitat"]
|
||||
tags = ["funcionalitat", "tutorial"]
|
||||
+++
|
||||
|
||||
## JavaScript?
|
||||
|
||||
Aquest tema funciona perfectament sense JavaScript. Opcionalment, pot carregar una quantitat mínima per afegir algunes funcionalitats que no són possibles utilitzant només HTML i CSS:
|
||||
Aquest tema no requereix JavaScript obligatori. Opcionalment, pot carregar una quantitat mínima per afegir algunes característiques que són impossibles d'aconseguir amb HTML i CSS.
|
||||
|
||||
- **Canvi de mode clar/fosc**. S'activa establint `theme_switcher = true`. (~900 bytes)
|
||||
- **Còpia de blocs de codi amb un sol clic**. S'activa establint `copy_button = true`. (~700 bytes)
|
||||
### Opcions globals
|
||||
|
||||
Aquestes dues configuracions cal aplicar-les a la secció `[extra]` del fitxer `config.toml`.
|
||||
- **Canvi de mode clar/fosc**. Habilitat configurant `theme_switcher = true`. (~900 bytes)
|
||||
- **Còpia de blocs de codi amb un sol clic**. Habilitat configurant `copy_button = true`. (~700 bytes)
|
||||
|
||||
La [funcionalitat de KaTeX](@/blog/markdown.ca.md#katex), que requereix carregar un fitxer JavaScript de 274 KB, es pot activar per a publicacions específiques. Això es pot fer establint `katex = true` a la secció `[extra]` de l'encapçalament de la publicació.
|
||||
Aquestes dues configuracions es poden aplicar a la secció `[extra]` del teu fitxer `config.toml`.
|
||||
|
||||
A part d'això, és un tema ràpid amb HTML i CSS. Tal i com hauria de ser (la major part de) la web :-)
|
||||
- [**Comentaris**](@/blog/comments.ca.md). giscus (2 KB) o utterances (1 KB) es poden habilitar globalment configurant `enabled_for_all_posts = true` a la secció correcta de `config.toml` (`[extra.giscus]` o `[extra.utterances]`).
|
||||
|
||||
### Configuracions específiques de la pàgina
|
||||
|
||||
Les següents configuracions es poden habilitar en posts específics configurant certes variables a la secció `[extra]` del front matter de la publicació.
|
||||
|
||||
- [**KaTeX**](@/blog/markdown.ca.md#katex) (274 KB) es pot habilitar amb `katex = true`.
|
||||
- [**Comentaris**](@/blog/comments.ca.md). Es poden habilitar a publicacions específiques assignant `utterances = true` o `giscus = true`.
|
||||
|
||||
A part d'això, és un tema ràpid amb HTML i CSS que funciona sense JavaScript. Just com hauria de ser (la majoria de) la web :-)
|
||||
|
||||
@ -1,22 +1,31 @@
|
||||
+++
|
||||
title = "Sin JavaScript obligatorio"
|
||||
date = 2023-01-06
|
||||
updated = 2023-07-08
|
||||
updated = 2023-07-13
|
||||
description = "JavaScript solo se utiliza cuando HTML y CSS no son suficientes."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["funcionalidad"]
|
||||
tags = ["funcionalidad", "tutorial"]
|
||||
+++
|
||||
|
||||
## ¿JavaScript?
|
||||
|
||||
Este tema funciona perfectamente sin JavaScript. Opcionalmente, puede cargar una cantidad mínima para añadir algunas funciones que son imposibles de lograr con HTML y CSS:
|
||||
Este tema no tiene JavaScript obligatorio. Opcionalmente, puede cargar una cantidad mínima para agregar algunas características que son imposibles de lograr con HTML y CSS.
|
||||
|
||||
- **El cambio de modo claro/oscuro**. Habilitado estableciendo `theme_switcher = true`. (~900 bytes)
|
||||
- **Copia de bloques de código con un clic**. Se activa configurando `copy_button = true`. (~700 bytes)
|
||||
### Opciones globales
|
||||
|
||||
Estas dos configuraciones se deben aplicar en la sección `[extra]` de tu archivo `config.toml`.
|
||||
- **Interruptor de modo claro/oscuro**. Habilitado configurando `theme_switcher = true`. (~900 bytes)
|
||||
- **Copia de bloques de código con un solo clic**. Habilitado configurando `copy_button = true`. (~700 bytes)
|
||||
|
||||
La [funcionalidad de KaTeX](@/blog/markdown.es.md#katex), que requiere cargar un archivo JavaScript de 274 KB, se puede activar para publicaciones específicas. Esto se puede hacer configurando `katex = true` en la sección `[extra]` del encabezado de la publicación.
|
||||
Estas dos configuraciones se pueden aplicar en la sección `[extra]` de tu `config.toml`.
|
||||
|
||||
Aparte de esto, es un tema rápido con HTML y CSS. Como debería ser (en su mayoría) la web :-)
|
||||
- [**Comentarios**](@/blog/comments.es.md). giscus (2 KB) o utterances (1 KB) se pueden habilitar globalmente configurando `enabled_for_all_posts = true` en la sección apropiada de tu archivo `config.toml` (`[extra.giscus]` o `[extra.utterances]`).
|
||||
|
||||
### Opciones para publicaciones individuales
|
||||
|
||||
Las siguientes configuraciones se pueden habilitar en publicaciones específicas configurando ciertas variables en la sección `[extra]` del front matter del post.
|
||||
|
||||
- [**KaTeX**](@/blog/markdown.es.md#katex) (274 KB) se puede habilitar con `katex = true`.
|
||||
- [**Comentarios**](@/blog/comments.es.md). Se pueden habilitar en posts específicos configurando `utterances = true` o `giscus = true`.
|
||||
|
||||
Aparte de eso, es un tema rápido con HTML y CSS que funciona con JavaScript deshabilitado. Como debería ser (en su mayoría) la web :-)
|
||||
|
||||
@ -1,22 +1,31 @@
|
||||
+++
|
||||
title = "No mandatory JavaScript"
|
||||
date = 2023-01-06
|
||||
updated = 2023-07-08
|
||||
updated = 2023-07-13
|
||||
description = "JavaScript is only used when HTML and CSS aren't enough."
|
||||
|
||||
[taxonomies]
|
||||
tags = ["showcase"]
|
||||
tags = ["showcase", "tutorial"]
|
||||
+++
|
||||
|
||||
## JavaScript?
|
||||
|
||||
This theme has no mandatory JavaScript. Optionally, it can load a minimal amount to add some features that are impossible to achieve with HTML and CSS:
|
||||
This theme has no mandatory JavaScript. Optionally, it can load a minimal amount to add some features that are impossible to achieve with HTML and CSS.
|
||||
|
||||
### Globally enabled settings
|
||||
|
||||
- **Light/dark mode switch**. Enabled by setting `theme_switcher = true`. (~900 bytes)
|
||||
- **One-click copy of code blocks**. Enabled by setting `copy_button = true`. (~700 bytes)
|
||||
|
||||
These two settings can be applied in the `[extra]` section of your `config.toml` file.
|
||||
|
||||
[KaTeX support](@/blog/markdown.md#katex), which requires loading a 274 KB JavaScript file, can be activated for specific posts. This can be done by setting `katex = true` in the post's `[extra]` section of the post's front matter.
|
||||
- [**Comments**](@/blog/comments.md). giscus (2 KB) or utterances (1 KB) can be globally enabled by setting `enabled_for_all_posts = true` in the right section of your `config.toml` (`[extra.giscus]` or `[extra.utterances]`).
|
||||
|
||||
### Page-specific settings
|
||||
|
||||
The following settings can be enabled on specific posts by setting certain variables in the `[extra]` section of the post's front matter.
|
||||
|
||||
- [**KaTeX** support](@/blog/markdown.md#katex) (274 KB) can be enabled it by setting `katex = true`.
|
||||
- [**Comments**](@/blog/comments.md) can be enabled on individual posts by setting `utterances = true` or `giscus = true`.
|
||||
|
||||
Other than that, it's a fast site with HTML and CSS. Just the way (most of) the web should be :-)
|
||||
Other than that, it's a fast theme with HTML and CSS which works with JavaScript disabled. Just the way (most of) the web should be :-)
|
||||
|
||||
@ -1 +1 @@
|
||||
function setGiscusTheme(t){var e=document.querySelector("iframe.giscus-frame");e&&e.contentWindow.postMessage({giscus:{setConfig:{theme:t}}},"https://giscus.app")}function initGiscus(){var t=document.querySelector(".comments");if(t){var e=t.getAttribute("data-repo"),a=t.getAttribute("data-repo-id"),i=t.getAttribute("data-category"),r=t.getAttribute("data-category-id"),d=t.getAttribute("data-strict"),s=t.getAttribute("data-term"),u=t.getAttribute("data-reactions-enabled"),n=t.getAttribute("data-input-position");const b=t.getAttribute("data-light-theme"),A=t.getAttribute("data-dark-theme");var o=t.getAttribute("data-lang"),c=t.getAttribute("data-lazy-loading"),g=document.createElement("script"),e=(g.src="https://giscus.app/client.js",g.async=!0,g.setAttribute("data-repo",e),g.setAttribute("data-repo-id",a),g.setAttribute("data-category",i),g.setAttribute("data-category-id",r),g.setAttribute("data-term",s),g.setAttribute("data-strict",d),g.setAttribute("data-reactions-enabled",u),g.setAttribute("data-emit-metadata","0"),g.setAttribute("data-input-position",n),g.setAttribute("data-lang",o),g.setAttribute("crossorigin","anonymous"),t.getAttribute("data-mapping")),a=(e&&g.setAttribute("data-mapping",e),document.documentElement.getAttribute("data-theme")||"light"),i="dark"===a?A:b;g.setAttribute("data-theme",i),"true"===c&&g.setAttribute("data-loading","lazy"),t.appendChild(g),window.addEventListener("themeChanged",t=>{setGiscusTheme("dark"===t.detail.theme?A:b)})}}window.addEventListener("load",()=>{initGiscus()});
|
||||
function setGiscusTheme(t){var e=document.querySelector("iframe.giscus-frame");e&&e.contentWindow.postMessage({giscus:{setConfig:{theme:t}}},"https://giscus.app")}function initGiscus(){var t=document.querySelector(".comments");if(t){var e=t.getAttribute("data-repo"),a=t.getAttribute("data-repo-id"),i=t.getAttribute("data-category"),r=t.getAttribute("data-category-id"),d=t.getAttribute("data-strict"),s=t.getAttribute("data-term"),u=t.getAttribute("data-reactions-enabled"),n=t.getAttribute("data-input-position");const b=t.getAttribute("data-light-theme"),A=t.getAttribute("data-dark-theme");var o=t.getAttribute("data-lang"),c=t.getAttribute("data-lazy-loading"),g=document.createElement("script"),e=(g.src="https://giscus.app/client.js",g.async=!0,g.setAttribute("data-repo",e),g.setAttribute("data-repo-id",a),g.setAttribute("data-category",i),g.setAttribute("data-category-id",r),g.setAttribute("data-term",s),g.setAttribute("data-strict",d),g.setAttribute("data-reactions-enabled",u),g.setAttribute("data-emit-metadata","0"),g.setAttribute("data-input-position",n),g.setAttribute("data-lang",o),g.setAttribute("crossorigin","anonymous"),t.getAttribute("data-mapping")),a=(e&&g.setAttribute("data-mapping",e),document.documentElement.getAttribute("data-theme")||"light"),i="dark"===a?A:b;g.setAttribute("data-theme",i),"true"===c&&g.setAttribute("data-loading","lazy"),t.appendChild(g),window.addEventListener("themeChanged",t=>{setGiscusTheme("dark"===t.detail.theme?A:b)})}}initGiscus();
|
||||
|
||||
@ -0,0 +1,26 @@
|
||||
// Wait for the full HTML document to be parsed and ready.
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
// Retrieve the button element.
|
||||
const loadCommentsButton = document.querySelector('#load-comments');
|
||||
|
||||
// If the button exists…
|
||||
if (loadCommentsButton) {
|
||||
// Add a "click" event listener to the button.
|
||||
loadCommentsButton.addEventListener('click', () => {
|
||||
// Create a new "script" HTML element.
|
||||
const script = document.createElement('script');
|
||||
|
||||
// Set the source of the script to the URL in the button's "data-script-src" attribute.
|
||||
script.src = loadCommentsButton.dataset.scriptSrc;
|
||||
|
||||
// Load asynchronously.
|
||||
script.async = true;
|
||||
|
||||
// Add the script element to the end of the document body, which causes the script to start loading and executing.
|
||||
document.body.appendChild(script);
|
||||
|
||||
// Hide the button after it's clicked.
|
||||
loadCommentsButton.style.display = 'none';
|
||||
});
|
||||
}
|
||||
});
|
||||
@ -0,0 +1 @@
|
||||
document.addEventListener("DOMContentLoaded",()=>{const t=document.querySelector("#load-comments");t&&t.addEventListener("click",()=>{var e=document.createElement("script");e.src=t.dataset.scriptSrc,e.async=!0,document.body.appendChild(e),t.style.display="none"})});
|
||||
@ -1 +1 @@
|
||||
function setUtterancesTheme(t){const e=document.querySelector(".utterances-frame");e&&e.contentWindow.postMessage({type:"set-theme",theme:t},"https://utteranc.es")}function initUtterances(){const t=document.querySelector(".comments");if(t){var e=t.getAttribute("data-repo"),a=t.getAttribute("data-issue-term"),r=t.getAttribute("data-label");const s=t.getAttribute("data-light-theme"),d=t.getAttribute("data-dark-theme");var n=t.getAttribute("data-lazy-loading"),i=document.createElement("script"),e=(i.src="https://utteranc.es/client.js",i.async=!0,i.setAttribute("repo",e),i.setAttribute("issue-term",a),i.setAttribute("label",r),document.documentElement.getAttribute("data-theme")||"light"),a="dark"===e?d:s;i.setAttribute("theme",a),i.setAttribute("crossorigin","anonymous"),"true"===n&&i.setAttribute("data-loading","lazy"),t.appendChild(i),window.addEventListener("themeChanged",t=>{setUtterancesTheme("dark"===t.detail.theme?d:s)})}}window.addEventListener("load",()=>{initUtterances()});
|
||||
function setUtterancesTheme(t){const e=document.querySelector(".utterances-frame");e&&e.contentWindow.postMessage({type:"set-theme",theme:t},"https://utteranc.es")}function initUtterances(){const t=document.querySelector(".comments");if(t){var e=t.getAttribute("data-repo"),a=t.getAttribute("data-issue-term"),r=t.getAttribute("data-label");const s=t.getAttribute("data-light-theme"),d=t.getAttribute("data-dark-theme");var n=t.getAttribute("data-lazy-loading"),i=document.createElement("script"),e=(i.src="https://utteranc.es/client.js",i.async=!0,i.setAttribute("repo",e),i.setAttribute("issue-term",a),i.setAttribute("label",r),document.documentElement.getAttribute("data-theme")||"light"),a="dark"===e?d:s;i.setAttribute("theme",a),i.setAttribute("crossorigin","anonymous"),"true"===n&&i.setAttribute("data-loading","lazy"),t.appendChild(i),window.addEventListener("themeChanged",t=>{setUtterancesTheme("dark"===t.detail.theme?d:s)})}}initUtterances();
|
||||
|
||||
Loading…
Reference in New Issue