Skip to main content

Add custom HTML, CSS, and third-party scripts to your Fourthwall site

Updated August 1, 2026

Incorporate additional elements to enhance the flexibility of your Fourthwall site

You can add your own HTML, CSS, and third-party scripts, such as analytics tags, chat widgets, or embeds, to your Fourthwall site. This provides you with greater control beyond the built-in tools.

For step-by-step instructions, see: How to Add HTML and Unique Code to Your Site.

Options for adding custom code​

You have two main ways to add custom code:

  • Page-specific custom code
    • Add HTML sections to embed players, iframes, or custom buttons.
    • Add CSS to style just that page or section.
    • Useful for things like embedding a Spotify player, Google Maps, or a unique call-to-action block.
  • Site-wide custom code
    • Add global CSS or scripts from Site design > Style > Edit HTML code.
    • Supports both <style> blocks (CSS) and <script> blocks (header/footer).
    • Best for analytics (Google Analytics, Meta Pixel), live chat widgets, or site-wide styling.

All custom code lives in the Site design section of your dashboard. You reach the editor from Site design > Style, then scroll down to Edit HTML code. There's no separate "Customize" or "Edit" button to click on the Themes page: open a theme by clicking its card, and the editor tools appear in the left panel.

Add a site-wide script​

Site-wide scripts, like a live chat widget, load on every page of your site. Here's how to add one, using the Tidio live chat widget as an example:

  1. Copy the script snippet from your provider (for example, Tidio gives you a <script> tag to paste into your site).
  2. In your dashboard, go to Site design > Style.
  3. Scroll down and click Edit HTML code.
  4. Enable footer code.
  5. Paste your script into the footer code field.
  6. Click Save.

Use footer code for most third-party scripts so they load after the page content. Use header code only when the provider tells you the script must load in the <head> (for example, some analytics and verification tags).

Third-party scripts and widgets​

You can use this to connect with popular services:

  • Analytics: Google Analytics, Meta Pixel, etc.
  • Engagement: YouTube embeds or Twitter/X feeds
  • Support/live chat: Tidio, Klaviyo, Beehiiv, etc.
tip

Always check the provider's embed code. Most will give you a snippet to paste directly into a Custom HTML block or into the site-wide header/footer section.

Considerations​

  • Performance: Adding too many scripts can slow down your site.
  • Cookie policy compliance: The Fourthwall cookie banner won't track third-party scripts automatically. If your script uses cookies, you must ensure it respects visitor consent.
  • Support scope: Fourthwall Support can't debug third-party scripts. If something doesn't load, check with the provider.
  • Security: Only use code from trusted sources to protect your site and visitors.

Additional resources​

Was this helpful?