[{"data":1,"prerenderedAt":224},["ShallowReactive",2],{"\u002Fintegrations\u002Fhugo":3},{"id":4,"title":5,"body":6,"description":216,"extension":217,"icon":218,"meta":219,"navigation":86,"path":220,"seo":221,"stem":222,"__hash__":223},"integrations\u002Fintegrations\u002Fhugo.md","Add comments to a Hugo site",{"type":7,"value":8,"toc":209},"minimark",[9,13,163,173,178,205],[10,11,12],"p",{},"Crowment is a web component, so a Hugo site only needs the embed code in the template that renders a post.",[14,15,17,22,35,39,59,63,152,156],"steps",{"level":16},"3",[18,19,21],"h3",{"id":20},"create-a-widget","Create a widget",[10,23,24,29,30,34],{},[25,26,28],"a",{"href":27},"\u002Flogin","Sign in to Crowment",", create a comment widget for your site's domain and copy its app key from ",[31,32,33],"strong",{},"Install & Embed",".",[18,36,38],{"id":37},"copy-your-post-template","Copy your post template",[10,40,41,42,46,47,50,51,54,55,58],{},"Find the template that renders a single post in your theme, usually ",[43,44,45],"code",{},"single.html"," or ",[43,48,49],{},"page.html"," under ",[43,52,53],{},"themes\u002F\u003Ctheme>\u002Flayouts\u002F",". Copy it to the same path under your site's own ",[43,56,57],{},"layouts\u002F"," folder. Hugo uses your copy instead of the theme's, and theme updates won't overwrite your change.",[18,60,62],{"id":61},"add-the-embed-code-after-the-content","Add the embed code after the content",[64,65,70],"pre",{"className":66,"code":67,"language":68,"meta":69,"style":69},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{{ .Content }}\n\n\u003Cscript defer src=\"https:\u002F\u002Fembeds.crowment.com\u002Fcomments.js\">\u003C\u002Fscript>\n\u003Ccrow-comments app-key=\"YOUR_APP_KEY\">\u003C\u002Fcrow-comments>\n","html","",[43,71,72,81,88,126],{"__ignoreMap":69},[73,74,77],"span",{"class":75,"line":76},"line",1,[73,78,80],{"class":79},"sTEyZ","{{ .Content }}\n",[73,82,84],{"class":75,"line":83},2,[73,85,87],{"emptyLinePlaceholder":86},true,"\n",[73,89,91,95,99,103,106,109,112,116,118,121,123],{"class":75,"line":90},3,[73,92,94],{"class":93},"sMK4o","\u003C",[73,96,98],{"class":97},"swJcz","script",[73,100,102],{"class":101},"spNyl"," defer",[73,104,105],{"class":101}," src",[73,107,108],{"class":93},"=",[73,110,111],{"class":93},"\"",[73,113,115],{"class":114},"sfazB","https:\u002F\u002Fembeds.crowment.com\u002Fcomments.js",[73,117,111],{"class":93},[73,119,120],{"class":93},">\u003C\u002F",[73,122,98],{"class":97},[73,124,125],{"class":93},">\n",[73,127,129,131,134,137,139,141,144,146,148,150],{"class":75,"line":128},4,[73,130,94],{"class":93},[73,132,133],{"class":97},"crow-comments",[73,135,136],{"class":101}," app-key",[73,138,108],{"class":93},[73,140,111],{"class":93},[73,142,143],{"class":114},"YOUR_APP_KEY",[73,145,111],{"class":93},[73,147,120],{"class":93},[73,149,133],{"class":97},[73,151,125],{"class":93},[18,153,155],{"id":154},"build-and-check","Build and check",[10,157,158,159,162],{},"Run ",[43,160,161],{},"hugo server"," and open a post. Each post gets its own thread, identified by its URL path.",[164,165,166],"tip",{},[10,167,168,169,172],{},"If your theme already calls a comments partial (look for ",[43,170,171],{},"partial \"comments.html\""," in the template), you can put the embed code in that partial instead and leave the template alone.",[174,175,177],"h2",{"id":176},"next-steps","Next steps",[179,180,181,193],"ul",{},[182,183,184,185,188,189,34],"li",{},"Keep threads attached when URLs change with ",[43,186,187],{},"page-id",": see ",[25,190,192],{"href":191},"\u002Fdocs\u002Fen\u002Fsite-owners\u002Fgetting-started\u002Finstallation","Which thread a page shows",[182,194,195,196,200,201,34],{},"Switch on ",[25,197,199],{"href":198},"\u002Fdocs\u002Fen\u002Fsite-owners\u002Fmoderation\u002Frules-and-lifecycle","AI moderation"," and pick a ",[25,202,204],{"href":203},"\u002Fdocs\u002Fen\u002Fsite-owners\u002Fgetting-started\u002Fappearance","theme",[206,207,208],"style",{},"html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":69,"searchDepth":83,"depth":90,"links":210},[211,212,213,214,215],{"id":20,"depth":90,"text":21},{"id":37,"depth":90,"text":38},{"id":61,"depth":90,"text":62},{"id":154,"depth":90,"text":155},{"id":176,"depth":83,"text":177},"Add a comment section with AI moderation to a Hugo blog. One script and one tag in your post template, no build step.","md","i-simple-icons-hugo",{},"\u002Fintegrations\u002Fhugo",{"title":5,"description":216},"integrations\u002Fhugo","w5wui5kIWi4lmqD2yLilShz_maJ233vWMEmay_NeSzo",1792581803606]