Skip to main content

flexweg-custom-code

flexweg-custom-code lets you inject site-wide HTML / CSS / JS into either the <head> or just before </body> of every published page. The classic use cases:

  • Analytics: Google Analytics 4, Plausible, Fathom, Matomo tracking snippet
  • Tag managers: Google Tag Manager, Segment
  • Chat widgets: Intercom, Crisp, Tawk.to
  • Fonts: extra <link> to a webfont host beyond what the active theme already loads
  • Custom CSS overrides: <style> block to override theme styles without forking the theme
  • Microdata / <meta> tags not covered by core-seo or your theme
  • A/B testing scripts (Google Optimize, VWO)

It's must-use because once you've wired analytics or a chat widget through it, disabling the plugin would silently strip the script tags from every page on the next regeneration. That's a footgun we'd rather not hand admins.

Settings​

/settings/plugin/flexweg-custom-code exposes two textareas:

  • <head> injection — added at the end of <head>, after every other plugin's contribution
  • Body end injection — added just before </body>, after every other plugin's contribution

Each textarea accepts raw HTML (including <script> and <style> tags). No sanitisation, no transformation — what you paste lands in the published HTML byte-for-byte.

The settings page warns about the security implications.

How it hooks in​

api.addFilter<string>("page.head.extra", (current, props) => {
  const code = readConfig(props).head;
  if (!code) return current;
  return [current, code].filter(Boolean).join("\n");
});

api.addFilter<string>("page.body.end", (current, props) => {
  const code = readConfig(props).bodyEnd;
  if (!code) return current;
  return [current, code].filter(Boolean).join("\n");
});

Both filters are synchronous; both reach into props.site.settings.pluginConfigs["flexweg-custom-code"] to pull the live config. Empty configs contribute nothing — no extra whitespace, no empty comment markers.

When changes apply​

  • Newly published pages include the new code immediately.
  • Already-published pages keep their old injected code until they're regenerated.

To roll out a change site-wide: Themes → Regenerate site → All HTML pages.

Caveats​

No sanitisation​

Anything you paste runs verbatim. A typo in a <script> tag can break every page on your site. Always test in an incognito window after saving.

Order matters​

The injection happens after every other plugin's contribution. So core-seo's Twitter Cards land first, then flexweg-favicon's <link>s, then your custom code at the end. If your snippet needs to run before another plugin's, you'd need to register a filter at a lower priority (which means writing your own plugin instead of using this one).

Per-page customisation​

This plugin is site-wide. There's no per-post toggle. For per-post head injection, use the Document → SEO sidebar in the editor (which contributes via post-level fields) or write a small plugin that filters page.head.extra based on props.post.

Internal details​

  • Source: src/mu-plugins/flexweg-custom-code/
  • Hooks used: page.head.extra filter, page.body.end filter
  • Translations: 7 locales

Continue​