从WordPress迁移至Hugo后，Google Analytics及分享按钮配置故障求助

Hey Marcus, sorry to hear about the WordPress hack and the headaches with your Hugo setup—let’s break this down step by step, starting with the partials concept since that’s foundational to fixing your share buttons and Google Analytics issues.

First, let’s clarify what partials are: they’re reusable template snippets for your Hugo site. Think of them as modular components—like your site’s footer, navigation bar, or third-party scripts (like AddThis/GA) that you want to use across multiple pages without copying code everywhere.

The layouts/partials directory is where you store these snippets. To use a partial in your main templates (like baseof.html, single.html, etc.), you call it with this syntax:

{{ partial "your-partial-file.html" . }}

The . at the end passes the current page’s context (like site config values, page metadata) to the partial, so it can access variables you’ve set in config.toml.

You’ve already added the partial files and configured config.toml, so let’s walk through the most common issues that might be blocking them from working:

1. Double-check your config.toml setup
   Make sure your AddThis ID is nested under the [params] section (not at the root of the config) like this:

   [params]
     addthis_id = "your-public-addthis-id"
   

   Confirm the ID matches exactly what’s in your AddThis dashboard—even a tiny typo will break things.

2. Verify your partial file content

   • For addthis-script.html, it should load the AddThis widget with your ID pulled from config:

     <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid={{ .Site.Params.addthis_id }}"></script>
     

     Ensure the variable {{ .Site.Params.addthis_id }} is spelled correctly—this is how the partial fetches your config value.
   • For addthis.html, use the standard AddThis button markup (match what’s in their docs):

     <div class="addthis_inline_share_toolbox"></div>
     

3. Make sure you’re calling the partials in your templates
   This is the most common oversight! Partials won’t load automatically—you need to reference them where you want them to appear:

   • Add the script partial (addthis-script.html) right before the closing </body> tag in your base template (layouts/_default/baseof.html):

     {{ partial "addthis-script.html" . }}
     </body>
     </html>
     

   • Add the button partial (addthis.html) where you want share buttons to show up—like at the bottom of your single post template (layouts/_default/single.html):

     <div class="post-content">
       {{ .Content }}
     </div>
     {{ partial "addthis.html" . }}
     

4. Check the browser console for errors
   Open your site, press F12 to open DevTools, and go to the Console tab. Look for errors like:

   • Failed to load the AddThis script (might be a network issue or wrong URL)
   • "AddThis pubid not set" (means your ID isn’t being passed correctly)
   • Missing element errors (if the button div isn’t present on the page)

For Google Analytics, the approach is similar—here’s what to check:

• If you’re using GA4 (the current supported version), Hugo has built-in support. Add your measurement ID to config.toml:

  [params]
    googleAnalytics = "G-YOUR-GA4-ID"
  

  Then call the built-in partial in your baseof.html (before </body>):

  {{ partial "google-analytics.html" . }}
  

• If you’re using a custom partial for GA, double-check that the script includes your correct ID, that you’re calling the partial in your template, and that there are no console errors blocking the script from loading.

内容的提问来源于stack exchange，提问作者Marcus Nunes