{"id":58342,"date":"2024-03-05T12:31:57","date_gmt":"2024-03-05T11:31:57","guid":{"rendered":"https:\/\/kinsta.com\/nl\/?p=58342&#038;preview=true&#038;preview_id=58342"},"modified":"2024-03-08T12:04:48","modified_gmt":"2024-03-08T11:04:48","slug":"statische-site-comments","status":"publish","type":"post","link":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/","title":{"rendered":"Zo voeg je een commentsectie toe aan je statische site"},"content":{"rendered":"<p><a href=\"https:\/\/kinsta.com\/nl\/blog\/wat-is-een-statische-website\/\">Statische websites<\/a> leveren inhoud via een vooraf gedefinieerde verzameling <a href=\"https:\/\/kinsta.com\/blog\/what-is-html\/\">HTML-<\/a>, <a href=\"https:\/\/kinsta.com\/nl\/blog\/css-best-practices\/\">CSS-<\/a> en <a href=\"https:\/\/kinsta.com\/javascript\/\">JavaScript-bestanden<\/a>, waardoor ze voor velen een eenvoudige en voordelige keuze zijn.<\/p>\n<p>Ondanks hun vaste aard kunnen statische sites worden verrijkt met elementen van dynamische inhoud om gebruikersinteractie te stimuleren. Door een commentsectie te integreren kunnen bezoekers hun mening geven, feedback geven of vragen stellen over je content of diensten.<\/p>\n<p>Deze toevoeging bevordert de betrokkenheid van de gemeenschap en stelt je in staat om in contact te komen met je publiek en je aanbod te verfijnen op basis van hun feedback. Deze tutorial demonstreert het toevoegen van een commentsectie aan een statische site die wordt gehost op <a href=\"https:\/\/sevalla.com\/static-site-hosting\/\">Kinsta&#8217;s Statische Site Hosting<\/a>.<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Een statische basissite opzetten op Kinsta<\/h2>\n<p>Deze handleiding gebruikt de <a href=\"https:\/\/github.com\/kinsta\/hello-world-docusaurus\" target=\"_blank\" rel=\"noopener noreferrer\">Docusaurus template<\/a> die is gemaakt op het Kinsta GitHub account. Docusaurus is een populaire <a href=\"https:\/\/kinsta.com\/blog\/static-site-generator\/\">statische sitegenerator<\/a> die <a href=\"https:\/\/kinsta.com\/blog\/what-is-react-js\/\">React<\/a>, een van de <a href=\"https:\/\/kinsta.com\/nl\/blog\/javascript-bibliotheken\/\">beste JavaScript bibliotheken<\/a>, gebruikt als UI bibliotheek voor het maken van pagina&#8217;s.<\/p>\n<p>Volg de onderstaande stappen om deze site in te stellen op Kinsta:<\/p>\n<ol start=\"1\">\n<li>Om de Docusaurus template te gebruiken, klik je op <strong>Use this template &gt; Create a new repository<\/strong>.<\/li>\n<li>Kloon de repository naar je lokale machine door het volgende commando uit te voeren:\n<pre><code class=\"language-bash\">https:\/\/github.com\/kinsta\/hello-world-docusaurus.git<\/code><\/pre>\n<p><aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Pas je statische site aan door inhoud zoals documentatie, pagina&#8217;s en andere statische bestanden toe te voegen aan de juiste mappen van je lokale repository. Je kunt ook de layout en het uiterlijk aanpassen aan de richtlijnen van je branding. Lees onze <a href=\"https:\/\/kinsta.com\/nl\/blog\/docusaurus\/\">gids om te leren hoe je een Docusaurus site kunt aanpassen<\/a>.<\/p>\n<\/aside>\n<\/li>\n<li>Log in of maak een account aan om je <a href=\"https:\/\/my.kinsta.com\/?lang=nl\" target=\"_blank\" rel=\"noopener noreferrer\">MyKinsta<\/a> dashboard te bekijken.<\/li>\n<li>Autoriseer Kinsta bij je Git provider.<\/li>\n<li>Klik op <strong>Statische sites <\/strong>op de linker zijbalk en klik dan op <strong>Site toevoegen<\/strong>.<\/li>\n<li>Selecteer de repository en de branch waarvan je wilt deployen.<\/li>\n<li>Geef je site een unieke naam.<\/li>\n<li>Voeg de build instellingen toe in de volgende format:\n<ul>\n<li><strong>Build commando:<\/strong> <code>npm run build<\/code><\/li>\n<li><strong>Node versie:<\/strong> 18.16.20<\/li>\n<li><strong>Publish directory:<\/strong> build<\/li>\n<\/ul>\n<\/li>\n<li>Klik ten slotte op <strong>Site maken<\/strong>.<\/li>\n<\/ol>\n<p>Nadat je je site met succes hebt gedeployd, kun je de URL bezoeken die als domein wordt vermeld op het tabblad <strong>Overzicht<\/strong> van je uitgerolde site.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/docusaurus-static-site.png\" alt=\"Schermafbeelding van de statische site van Docusaurus, genaamd My Site\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Succesvolle deployment van de statische site.<\/figcaption><\/figure>\n<h2>Een Disqus account maken<\/h2>\n<p>Disqus biedt hulpmiddelen om de betrokkenheid te vergroten via sociale integratie, moderatietools en analyses. Het ondersteunt online discussies via comments. Volg deze stappen om Disqus te gebruiken:<\/p>\n<ol start=\"1\">\n<li>Maak een <a href=\"http:\/\/disqus.com\/profile\/signup\/\" target=\"_blank\" rel=\"noopener noreferrer\">Disqus account<\/a> aan.<\/li>\n<li>Vul de vereiste informatie in voor het aanmeldingsproces.<\/li>\n<li>Selecteer na het aanmelden <strong>I want to install Disqus on my site<\/strong>.<\/li>\n<li><a href=\"http:\/\/disqus.com\/admin\/create\/\" target=\"_blank\" rel=\"noopener noreferrer\">Registreer je site bij Disqus<\/a>. Kies tijdens de registratie een korte naam en een categorie voor je site. Een organisatie genereert automatisch een lijst met je nieuwe site en eventuele extra sites die je in de toekomst aanmaakt.<\/li>\n<li>Kies een <a href=\"https:\/\/disqus.com\/pricing\/\" target=\"_blank\" rel=\"noopener noreferrer\">Disqus abonnement<\/a> voor je organisatie. Disqus biedt verschillende abonnementen, waaronder Plus, Pro en Business. Voor deze demo kun je het Basic abonnement kiezen, dat kernfuncties bevat zoals de commentaarplugin, geavanceerde spamfiltering, moderatietools en basisanalyses.<\/li>\n<\/ol>\n<h2>Disqus integreren met je statische site op Kinsta<\/h2>\n<p>De volgende stap is het integreren van de Disqus code snippet in je statische site generator.<\/p>\n<ol start=\"1\">\n<li>Klik na het registreren van je site op <strong>I don&#8217;t see my platform listed, install manually with Universal Code<\/strong>.\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/manual-disqus.png\" alt=\"I don't see my platform listed, install manually with Universal Code optie in Disqus\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">De Disqus code handmatig insluiten met Universal Code.<\/figcaption><\/figure>\n<p>De weergegeven pagina bevat een JavaScript codefragment in het gedeelte met het label <strong>Place the following code where you\u2019d like Disqus to load<\/strong>. Omdat de statische site een React applicatieis, moet je dit codefragment aanpassen zodat het met React werkt.<\/li>\n<li>Maak een map met de naam <strong>Disqus<\/strong> in de map <strong>src\/components <\/strong>.<\/li>\n<li>Gebruik de volgende code in je <strong>index.js<\/strong> bestand. Zorg ervoor dat je <code>https:\/\/your_shortname_placeholder.disqus.com\/embed.js<\/code> vervangt door de URL die je hebt ontvangen in de Universal Code:\n<pre><code class=\"language-js\">import React, { useEffect } from 'react';\n\nconst DisqusComments = () =&gt; {\n    useEffect(() =&gt; {\n\n    const disqus_config = function () {\n        this.page.url = PAGE_URL;  \/\/ Replace PAGE_URL with your page's \ncanonical URL variable\n        this.page.identifier = PAGE_IDENTIFIER; \/\/ Replace PAGE_IDENTIFIER with   \nyour page's unique identifier variable\n    };\n\n    \/\/ Load Disqus script dynamically\n    (function () {\n        const d = document;\n        const s = d.createElement('script');\n        s.src = 'https:\/\/your_shortname_placeholder.disqus.com\/embed.js';\n        s.setAttribute('data-timestamp', +new Date());\n        (d.head || d.body).appendChild(s);\n    })();\n\n    \/\/ Cleanup Disqus on component unmount\n    return () =&gt; {\n        const disqusThread = document.getElementById('disqus_thread');\n        if (disqusThread) {\n        disqusThread.innerHTML = ''; \/\/ Clear the Disqus thread to avoid  \ninterference with other components\n        }\n    };\n    }, []); \/\/ Run this effect only once on component mount\n\n    return (\n    &lt;div&gt;\n        &lt;div&gt; id=\"disqus_thread\"&gt;&lt;\/div&gt;\n        &lt;noscript&gt;Please enable JavaScript to view the &lt;a&gt;  \nhref=\"https:\/\/disqus.com\/?ref_noscript\"&gt;comments powered by  \nDisqus.&lt;\/a&gt;&lt;\/noscript&gt;\n    &lt;\/div&gt;\n    );\n};\n\nexport default DisqusComments;<\/code><\/pre>\n<p>De functie <code>disqus_config<\/code> definieert twee variabelen:<\/p>\n<ul>\n<li><strong><code>this.page.url<\/code><\/strong> &#8211; Deze variabele is ingesteld op <code>PAGE_URL<\/code>, die je moet vervangen door de canonical URL van de pagina. Disqus gebruikt deze URL om de specifieke pagina te identificeren waar de comments thuishoren.<\/li>\n<li><strong><code>this.page.identifier<\/code><\/strong> &#8211; Deze variabele wordt ingesteld op <code>PAGE_IDENTIFIER<\/code>, die je moet vervangen door een unieke identifier voor de pagina. Met deze identificatie kan Disqus onderscheid maken tussen pagina&#8217;s met dezelfde URL en opmerkingen\/comments koppelen aan de juiste pagina.<\/li>\n<\/ul>\n<\/li>\n<li>Je kunt deze component importeren op de pagina waar je de Disqus commentaarsectie wilt weergeven.\n<pre><code class=\"language-js\">import DisqusComments from '@site\/src\/components\/Disqus';<\/code><\/pre>\n<\/li>\n<li>Voeg vervolgens de Disqus commentaarsectie toe aan de landingspagina, neem de volgende importverklaring op in <strong>index.js<\/strong> in de map <strong>src\/pages<\/strong> en gebruik <code>DisqusComments<\/code> dienovereenkomstig:\n<pre><code class=\"language-js\">export default function Home() {\n    const {siteConfig} = useDocusaurusContext();\n    return (\n    &lt;Layout\n        title={`Hello from ${siteConfig.title}`}\n        description=\"Description will go into a meta tag in &lt;head \/&gt;\"&gt;\n        &lt;HomepageHeader \/&gt;\n        &lt;main&gt;\n        &lt;HomepageFeatures \/&gt;\n        &lt;DisqusComments\/&gt;\n        &lt;\/main&gt;\n    &lt;\/Layout&gt;\n    );\n}<\/code><\/pre>\n<\/li>\n<li>Commit de wijzigingen in de repo zodat ze worden weergegeven op je statische site die door Kinsta wordt gehost:\n<pre><code class=\"language-git\">git add .\ngit commit -m \"Adding Disqus Comments\"\ngit push -u origin master<\/code><\/pre>\n<\/li>\n<\/ol>\n<p>Als je <strong>Automatische deployment bij commit <\/strong>hebt aangeklikt bij het deployen van je statische site, zal het vastleggen van nieuwe wijzigingen automatisch een deployment op MyKinsta starten. Anders moet je de wijzigingen handmatig deployen.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/disqus-comment-docusaurus.png\" alt=\"Screenshot van de statische site met een commentaarsectie door Disqus hieronder\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">De statische site met ge\u00efntegreerde Disqus reacties.<\/figcaption><\/figure>\n<p>Gefeliciteerd &#8211; je hebt een statische site gemaakt met Kinsta Statische Site Hosting en een commentaarsectie ge\u00efntegreerd met Disqus!<\/p>\n<p>Je wilt misschien de <code>DisqusComments<\/code> component aanpassen om ervoor te zorgen dat de commentaarsectie laadt zoals bedoeld.<\/p>\n<h2>De commentsectie aanpassen<\/h2>\n<p>Je kunt de commentsectie op je statische site aanpassen door het uiterlijk aan te passen, reacties te implementeren, commentaarmoderatie uit te voeren en meer. Enkele aanpassingsopties die beschikbaar zijn op Disqus zijn de volgende.<\/p>\n<h3>Thema aanpassen<\/h3>\n<p>Om het thema van je Disqus opmerkingen aan te passen, navigeer je naar het Disqus dashboard, klik je op <b>General <\/b>op het tabblad <b>Settings <\/b>en selecteer je geschikte opties in de vervolgkeuzelijsten <b>Color scheme <\/b>en <strong>Typeface<\/strong>.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/customize-theme.png\" alt=\"Schermafbeelding van de pagina voor het aanpassen van het thema\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Het thema van je Disqus reacties aanpassen.<\/figcaption><\/figure>\n<h3>Reacties inschakelen op je site<\/h3>\n<p>Je kunt de betrokkenheid van je publiek vergroten door Reacties in te schakelen op je site. Pas deze reacties aan volgens je eigen voorkeuren.<\/p>\n<p>Om deze functie in te schakelen, navigeer je naar het tabblad <b>Settings <\/b>op het Disqus dashboard. Selecteer <strong>Reactions<\/strong>. Klik vervolgens op <strong>Enable Reactions on your site<\/strong>.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/reactions-disqus.png\" alt=\"Schermafbeelding van de pagina Reacties configureren en inschakelen van het Disqus dashboard\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Reacties configureren en inschakelen via het Disqus dashboard.<\/figcaption><\/figure>\n<p>Vernieuw je site. De optie voor reacties verschijnt.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/image3.png\" alt=\"Statische site met commentaarsectie met reacties\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">De statische site toont de integratie van reacties.<\/figcaption><\/figure>\n<h3>Avatars voor comments<\/h3>\n<p>Je kunt een standaard avatar voor gebruikers uploaden, zodat ze zich onderdeel voelen van de community.<\/p>\n<p>Om deze functie in te schakelen, navigeer je naar het Disqus dashboard, klik je op <strong>General<\/strong> op het tabblad <b>Settings <\/b>en upload je een afbeelding via <strong>Default Commenter Avatar<\/strong>.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/commenter-avatar.png\" alt=\"Een standaard Avatar voor de commentator uploaden\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">De functie Default Commentor Avatar.<\/figcaption><\/figure>\n<h3>Reacties sorteren<\/h3>\n<p>Voeg aanpassingen toe om gebruikers reacties te laten sorteren op <strong>Oldest First<\/strong>, <strong>Newest First <\/strong>of <strong>Best first.<\/strong> Klik op <strong>Community<\/strong> op het tabblad Settings op het Disqus dashboard en selecteer de volgorde in de vervolgkeuzelijst <strong>Default Sorting<\/strong>.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/sort-comments.png\" alt=\"Reacties sorteren op basis van de opgegeven volgorde.\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Reacties sorteren op basis van de opgegeven volgorde.<\/figcaption><\/figure>\n<h2>Commentaren modereren<\/h2>\n<p>Om reacties op Disqus te modereren, gebruik je het Disqus moderatiepaneel op de bovenste navigatiebalk in je Disqus dashboard. Deze tool geeft een snel overzicht van de opmerkingen op je forum en hun status (goedgekeurd, in behandeling, enzovoort).<\/p>\n<p>Je kunt ook moderatieregels configureren via het <strong>Moderatiemenu<\/strong>, dat beschikbaar is in het linker navigatiedeelvenster onder het tabblad <strong>Instellingen<\/strong> van het Disqus dashboard.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/comment-and-moderation.png\" alt=\"Commentaar en moderatie instellingen pagina in het Disqus dashboard\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Toegang tot het moderatiepaneel vanuit het Disqus dashboard.<\/figcaption><\/figure>\n<p>Bekijk vervolgens <a href=\"https:\/\/help.disqus.com\/en\/articles\/1717078-moderating-101\" target=\"_blank\" rel=\"noopener noreferrer\">hun documentatie<\/a> voor de belangrijkste stappen en functies om je te helpen bij het beheren en modereren van reacties op Disqus.<\/p>\n<h3>Gasten toestaan reacties te geven<\/h3>\n<p>Om gastgebruikers toe te staan commentaar te geven op je site, schakel je het selectievakje <strong>Allow guests to comment <\/strong>in en klik je vervolgens op <strong>Save<\/strong>. Deze opmerkingen blijven in afwachting totdat een moderator ze goedkeurt vanuit het Disqus moderatiedashboard.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/guest-commenting.png\" alt=\"Schermafbeelding van het selectievakje voor commentaar van gasten\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Gasten toestaan commentaar te geven op je site.<\/figcaption><\/figure>\n<h3>Commentaar goedkeuren, verwijderen en markeren als spam<\/h3>\n<p>Met het moderatiepaneel kun je bulkacties uitvoeren (opmerkingen goedkeuren, verwijderen en markeren als spam) door meerdere opmerkingen te controleren. Je kunt ze ook afzonderlijk modereren in de uitgebreide commentaarweergave.<\/p>\n<p>Zodra je deze instelling inschakelt, moet een moderator opmerkingen goedkeuren voordat ze worden weergegeven.<\/p>\n<figure style=\"width: 960px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/02\/moderators-comment.png\" alt=\"Screenshot van het commentaargedeelte vanuit het perspectief van de moderator\" width=\"960\" height=\"514\"><figcaption class=\"wp-caption-text\">Je Disqus opmerkingen modereren met bulkacties.<\/figcaption><\/figure>\n<h2>Samenvatting<\/h2>\n<p>In deze tutorial heb je geleerd hoe je een commentaarsectie kunt toevoegen aan je statische site. Naast Docusaurus kun je Disqus implementeren in elke andere SSG zoals <a href=\"https:\/\/kinsta.com\/blog\/vuepress\/\">VuePress<\/a>, <a href=\"https:\/\/kinsta.com\/blog\/gatsby\/\">Gatsby<\/a> en meer.<\/p>\n<p>Met Kinsta&#8217;s Statische Site Hosting kun je je vooraf gebouwde niet-dynamische bestanden eenvoudig implementeren. Om de voordelen te ontdekken van het hosten van je statische site op Kinsta en het integreren van features zoals een commentaarsectie, bekijk je <a href=\"https:\/\/docs.sevalla.com\/static-sites\/overview\">Kinsta&#8217;s Statische Site Hosting<\/a>.<\/p>\n<p><em>Heb je ooit Disqus of een andere commentaarservice ge\u00efmplementeerd op je statische site? Deel je ervaringen in de&#8230;, jawel&#8230; commentsectie hieronder!<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Statische websites leveren inhoud via een vooraf gedefinieerde verzameling HTML-, CSS- en JavaScript-bestanden, waardoor ze voor velen een eenvoudige en voordelige keuze zijn. Ondanks hun vaste &#8230;<\/p>\n","protected":false},"author":199,"featured_media":58343,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[877,914,884],"class_list":["post-58342","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-gebruikerservaring","topic-statische-sitegenerators","topic-webdevelopment-tools"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Zo voeg je een commentsectie toe aan je statische site - Kinsta\u00ae<\/title>\n<meta name=\"description\" content=\"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Zo voeg je een commentsectie toe aan je statische site\" \/>\n<meta property=\"og:description\" content=\"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-05T11:31:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-08T11:04:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jeremy Holcombe\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@Kinsta_NL\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_NL\" \/>\n<meta name=\"twitter:label1\" content=\"Geschreven door\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jeremy Holcombe\" \/>\n\t<meta name=\"twitter:label2\" content=\"Geschatte leestijd\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\"},\"author\":{\"name\":\"Jeremy Holcombe\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21\"},\"headline\":\"Zo voeg je een commentsectie toe aan je statische site\",\"datePublished\":\"2024-03-05T11:31:57+00:00\",\"dateModified\":\"2024-03-08T11:04:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\"},\"wordCount\":1473,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\",\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\",\"url\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\",\"name\":\"Zo voeg je een commentsectie toe aan je statische site - Kinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\",\"datePublished\":\"2024-03-05T11:31:57+00:00\",\"dateModified\":\"2024-03-08T11:04:48+00:00\",\"description\":\"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg\",\"width\":1460,\"height\":730},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/nl\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Webdevelopment tools\",\"item\":\"https:\/\/kinsta.com\/nl\/onderwerpen\/webdevelopment-tools\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Zo voeg je een commentsectie toe aan je statische site\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/nl\/#website\",\"url\":\"https:\/\/kinsta.com\/nl\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Snelle, veilige, premium hostingoplossingen\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/nl\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/nl\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/nl\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/\",\"https:\/\/x.com\/Kinsta_NL\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21\",\"name\":\"Jeremy Holcombe\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/kinsta.com\/nl\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g\",\"caption\":\"Jeremy Holcombe\"},\"description\":\"Senior Editor at Kinsta, WordPress Web Developer, and Content Writer. Outside of all things WordPress, I enjoy the beach, golf, and movies. I also have tall people problems.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/jeremyholcombe\/\"],\"url\":\"https:\/\/kinsta.com\/nl\/blog\/author\/jeremyholcombe\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Zo voeg je een commentsectie toe aan je statische site - Kinsta\u00ae","description":"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/","og_locale":"nl_NL","og_type":"article","og_title":"Zo voeg je een commentsectie toe aan je statische site","og_description":"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.","og_url":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/","article_published_time":"2024-03-05T11:31:57+00:00","article_modified_time":"2024-03-08T11:04:48+00:00","og_image":[{"width":1460,"height":730,"url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","type":"image\/jpeg"}],"author":"Jeremy Holcombe","twitter_card":"summary_large_image","twitter_description":"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.","twitter_image":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","twitter_creator":"@Kinsta_NL","twitter_site":"@Kinsta_NL","twitter_misc":{"Geschreven door":"Jeremy Holcombe","Geschatte leestijd":"9 minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/"},"author":{"name":"Jeremy Holcombe","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21"},"headline":"Zo voeg je een commentsectie toe aan je statische site","datePublished":"2024-03-05T11:31:57+00:00","dateModified":"2024-03-08T11:04:48+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/"},"wordCount":1473,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/nl\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","inLanguage":"nl-NL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/","url":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/","name":"Zo voeg je een commentsectie toe aan je statische site - Kinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/nl\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","datePublished":"2024-03-05T11:31:57+00:00","dateModified":"2024-03-08T11:04:48+00:00","description":"Leer hoe je een commentsectie toevoegt aan je statische site door Disqus te gebruiken om de betrokkenheid te vergroten met deze handleiding voor naadloze integratie.","breadcrumb":{"@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/"]}]},{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#primaryimage","url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","contentUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2024\/02\/how-to-integrate-a-comments-section-into-your-static-site.jpg","width":1460,"height":730},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/nl\/blog\/statische-site-comments\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/nl\/"},{"@type":"ListItem","position":2,"name":"Webdevelopment tools","item":"https:\/\/kinsta.com\/nl\/onderwerpen\/webdevelopment-tools\/"},{"@type":"ListItem","position":3,"name":"Zo voeg je een commentsectie toe aan je statische site"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/nl\/#website","url":"https:\/\/kinsta.com\/nl\/","name":"Kinsta\u00ae","description":"Snelle, veilige, premium hostingoplossingen","publisher":{"@id":"https:\/\/kinsta.com\/nl\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/nl\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/nl\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/nl\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/nl\/wp-content\/uploads\/sites\/7\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/nl\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Kinsta-Nederland-476213452787823\/","https:\/\/x.com\/Kinsta_NL","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21","name":"Jeremy Holcombe","image":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/kinsta.com\/nl\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g","caption":"Jeremy Holcombe"},"description":"Senior Editor at Kinsta, WordPress Web Developer, and Content Writer. Outside of all things WordPress, I enjoy the beach, golf, and movies. I also have tall people problems.","sameAs":["https:\/\/www.linkedin.com\/in\/jeremyholcombe\/"],"url":"https:\/\/kinsta.com\/nl\/blog\/author\/jeremyholcombe\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/58342","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/users\/199"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/comments?post=58342"}],"version-history":[{"count":5,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/58342\/revisions"}],"predecessor-version":[{"id":58759,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/posts\/58342\/revisions\/58759"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/jp"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/es"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/translations\/nl"},{"href":"https:\/\/kinsta.com\/nl\/wp-json\/kinsta\/v1\/posts\/58342\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/media\/58343"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/media?parent=58342"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/tags?post=58342"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/nl\/wp-json\/wp\/v2\/topic?post=58342"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}