Skip to main content
The Custom code settings let you inject your own markup, styling, and scripts into your public feedback portal. Use them to load a web font, add a verification or analytics snippet, restyle the page with CSS, or drop in a chat widget. If the built-in appearance settings do not get you all the way there, custom code fills the gap.
Custom code is available on the Pro plan and above. If a field is locked when you try to save, check your plan and billing first.
Custom code applies to your standalone portal only, the hosted page your visitors see at your Sleekplan address or custom domain. It does not run inside the embedded widget on your own site. The widget renders in an isolated frame and never loads tenant markup, so style and script the widget through its own settings, not here.

Where to find it

Everything on this page lives in Settings → Public Portal & Widget → Portal, in the Custom code section at the bottom of the page.
1

Open the Portal settings

2

Open the Custom code section

Scroll to the bottom of the page and click Custom code to expand it. The section is collapsed by default because it is advanced, so leave it closed if you do not need it.The expanded Custom code section showing the head markup, After body, Before body, and Custom CSS fields
3

Paste your code into the right field

Add your markup, styles, or script to the matching field (see The fields below). Each field targets a specific part of the page.
4

Save your changes

A save bar appears at the bottom of the page once you edit a field. Click Save to publish your changes to the portal.

The fields

There are six fields, each targeting a different part of the portal page. Enter your code directly: do not wrap CSS in a <style> tag or JavaScript in a <script> tag, because Sleekplan adds those wrappers for you.
FieldWhat it doesWhat is allowed
<head> markupAdds tags inside the page <head>: meta tags, web fonts, site verification, or analytics loaders.External <script src="..."> and <link> tags only. Inline scripts are not accepted here.
After <body>HTML placed right after the opening <body> tag, for example a background layer or a top banner.Plain HTML only. No <script>, <style>, or <link> tags.
Before </body>HTML placed right before the closing </body> tag, a good spot for late-loading markup.Plain HTML only. No <script>, <style>, or <link> tags.
Custom CSSRestyles the portal with your own CSS rules.Plain CSS. Enter the rules directly, without a <style> tag.
Custom JavaScriptRuns your own JavaScript on the portal (analytics, a chat widget, and so on). Requires a custom domain.Plain JavaScript. Enter the code directly, without a <script> tag.
Content Security PolicyAdds allowed sources to the portal’s Content Security Policy so your custom scripts and assets can load. Requires a custom domain.Valid CSP directives. Your sources are added to Sleekplan’s policy, they cannot remove or loosen it.
To target the portal with CSS, inspect the page in your browser to find the class you want to restyle. Portal elements use classes like .page-header, .content-home, and .page-brand. Keep your selectors specific so a future portal update does not override them.

Custom JavaScript and CSP need a custom domain

The Custom JavaScript and Content Security Policy fields only take effect when your portal runs on your own domain, like feedback.yourcompany.com. On a free .sleekplan.app address they are saved but ignored, and the section shows a reminder telling you which address the board is using. The Custom code section showing the notice that Custom JS and CSP need a custom domain, above the Custom JavaScript and Content Security Policy fields This is a safety boundary: scripts run in your visitors’ browsers, so Sleekplan only executes them once you have proven you own the domain they run on. To unlock these two fields, connect a custom domain first. The other four fields work on any portal, including your free Sleekplan address.

Good to know

  • Changes are validated when you save. If a field contains something that is not allowed, for example a <script> tag inside Custom CSS or an inline script in head markup, saving is blocked and you are told which field to fix. This keeps a stray tag from breaking the portal.
  • Your CSP can only add, never remove. Directives you enter are merged into Sleekplan’s built-in Content Security Policy. You can allow extra sources (a font host, an analytics domain), but you cannot strip out the entries Sleekplan needs to render the portal.
  • Test after you save. Open your portal in a new tab and confirm your changes look right and nothing else broke. Custom code runs on the live portal for every visitor.
  • Leave it blank if you are unsure. The portal works fully without any custom code. These fields are for advanced customization only.

Add analytics tracking

A worked example: add Google Analytics or any third-party tracker to your board.

Custom domain

Host your portal on your own subdomain, and unlock Custom JavaScript and CSP.

Install the widget

Embed the feedback widget in your own product. Styling the widget is separate from portal custom code.

Widget and a Content Security Policy

The CSP directives to allowlist when your own site enforces a policy.

Connect a custom email domain

Send portal notification emails from your own domain.