Maison  >  Article  >  Tutoriel système  >  Gitment, un plugin de commentaires pour les problèmes Github

Gitment, un plugin de commentaires pour les problèmes Github

PHPz
PHPzavant
2024-01-17 14:45:051159parcourir

Gitment 基于 Github 的 Issues 实现的评论插件

J'ai récemment découvert un plug-in de commentaires intéressant, Gitment[1], qui est bon en termes de mise en œuvre et d'effet, j'aimerais vous le présenter [2]. Si vous avez un blog personnel, vous pouvez envisager de l'utiliser ; si vous n'avez pas de blog personnel, vous pouvez également découvrir les idées de mise en œuvre et ouvrir votre imagination.

Les commentaires Duosuo, qui étaient couramment utilisés auparavant, ont été fermés, je pense que de nombreux blogs ont été affectés. Par conséquent, les commentaires de mon blog personnel ont été remplacés par Discuz, le plug-in de commentaires NetEase et le plug-in de commentaires Changyan, mais aucun d'entre eux n'est satisfaisant. C'était un peu une surprise de voir Gitment cette fois.

L'effet final obtenu est celui indiqué sur la figure :

Gitment 基于 Github 的 Issues 实现的评论插件

Le principe de base est d'utiliser la fonction Issues du projet GitHub pour stocker du contenu et d'utiliser le compte GitHub pour vous connecter au système. L'intégrer à votre propre blog est relativement simple, juste un fichier CSS, un fichier js et un morceau de code d'initialisation.

1. Tout d'abord, enregistrez l'application OAuth sur Github

Vous pouvez enregistrer une candidature via cette adresse[3] et suivez simplement les instructions pour remplir le formulaire.

Gitment 基于 Github 的 Issues 实现的评论插件

Après succès, vous obtiendrez un identifiant client et un secret client, qui seront utilisés ultérieurement lors de l'initialisation du plug-in.

Gitment 基于 Github 的 Issues 实现的评论插件

2. Intégration des pages Gitment

Chargez le fichier css, le fichier js et le code d'initialisation correspondants sur la page à afficher :

<div id="container"></div>
<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">
<script src="https://imsun.github.io/gitment/dist/gitment.browser.js"></script>
<script>
    var gitment = new Gitment({
        id: '页面 ID', // 可选。这个选项不写(不是留空),默认为 location.href
        owner: '你的 GitHub ID',
        repo: '存储评论的 repo',
        oauth: {
            client_id: '你的 client ID',
            client_secret: '你的 client secret',
        },
     });
    gitment.render('container'); //container为你要显示评论的id
</script>

Pour plus d'instructions sur les paramètres de la partie initialisation, veuillez vous référer à

https://github.com/imsun/gitment#options

Problèmes possibles 1

Gitment 基于 Github 的 Issues 实现的评论插件

Si vous rencontrez une telle erreur, cela signifie que le container dans votre gitment.render('container'); ne correspond pas à la page, veuillez vérifier attentivement.

Problèmes possibles 2

Gitment 基于 Github 的 Issues 实现的评论插件

Si vous rencontrez un tel problème, il est probable que l'adresse du dépôt que vous avez initialisée n'est pas écrite correctement. Le dépôt doit être écrit comme l'identifiant correspondant, et non comme l'adresse http. L'identifiant dans l'image est un projet sur mon propre GitHub, c'est-à-dire les éléments qui stockent le contenu des commentaires, comme le montre la figure :

Gitment 基于 Github 的 Issues 实现的评论插件

3. Commentaires d'initialisation

Une fois l'intégration réussie, vous pouvez voir le contenu affiché du plug-in de commentaire. La prochaine étape dont vous avez besoin à ce stade est de vous connecter à votre compte GitHub et de cliquer sur « Initiliser les commentaires » dans l'image.

Gitment 基于 Github 的 Issues 实现的评论插件

Remarque : chaque article doit être initialisé

Les derniers commentaires que vous pouvez voir dans la section Problèmes sont stockés sous :

Gitment 基于 Github 的 Issues 实现的评论插件

4. Personnalisation et personnalisation

Vous pouvez également personnaliser le style et la mise en page. Pour plus d'instructions, veuillez vous référer à : https://github.com/imsun/gitment#customize

.

Enfin, pour résumer, les avantages de ce Gitment sont une intégration simple, une personnalisation pratique et une connexion au compte GitHub intégrée ; l'inconvénient est qu'il ne prend en charge que la connexion au compte GitHub et que vous devez cliquer sur un bouton pour initialiser chaque fois que vous publiez. un nouvel article, qui est un peu gênant ; actuellement, l'adaptation des téléphones portables n'est pas encore idéale. Si vos exigences en matière de plugins de commentaires ne sont pas si strictes, vous pouvez envisager d'utiliser ce plugin.

Code source du projet GitHub : https://github.com/imsun/gitment

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer