Support / WordPress
Publish to WordPress.
A lightweight official plugin puts your Brackits designs into any page or post, and can render a header and footer site-wide.
Setup
Install and connect.
Requires WordPress 6.0 or later and PHP 7.4 or later. Tested up to WordPress 7.0. Start in WordPress, not in Brackits — the plugin connects itself.
01
Download the plugin.
Download the Brackits plugin — it's also on the Integrations page in your team sidebar.
You only do this once. Later releases show up on your Plugins screen like any other update.
02
Upload and activate.
In WordPress, go to Plugins → Add New → Upload Plugin, choose the ZIP you downloaded, install it, and activate.
03
Connect.
Go to Settings → Brackits and click Connect to Brackits. Approve the site and you'll be sent straight back — no keys to copy.
04
Point a project at the site.
In Brackits, open the project whose designs you want on this site and pick it under Project settings → WordPress site.
Skip this and the plugin connects fine but lists nothing.
05
Publish, then place.
Publish a design in Brackits. It then appears in the design library on that site — open it from the Brackits Design block, or from Add Brackits design next to Add Media in the classic editor.
Two links, not one
Connecting the plugin links your site to your Brackits team. It does not decide which designs that site can see — that comes from the projects you point at the site in project settings. A connected site with no project attached shows an empty design list, and that is by far the most common reason people think the plugin isn't working.
You can attach several projects to one site. Only designs you have published appear.
Placing designs
Pick from the library, in either editor.
Your published designs show up as a browsable library with live previews, whichever editor your site uses. There's a shortcode too, for the places neither editor reaches.
Block editor
The block
Add Brackits Design, then Browse designs. The library opens with a live preview of every design, grouped by project. Click one and it's placed — no tokens to copy.
The chosen design renders in the editor itself. Replace design in the block toolbar reopens the library, and the sidebar carries the render mode and width settings.
Classic editor
The button
If your site uses the classic editor — on its own or behind a page builder — you get Add Brackits design next to Add Media. Same library, same previews.
The placed design renders in the Visual tab rather than showing raw shortcode, with buttons to swap or remove it. The Text tab still holds the shortcode, which is what actually gets saved.
Anywhere else
The shortcode
Drop [brackits item="TOKEN"] anywhere shortcodes run — a page builder's text element, a widget, or a template.
Get the token from Brackits: open the design, click Embed, and copy the ready-made shortcode under Use in WordPress.
Every page
Header & footer
In Settings → Brackits, pick a design for Site header and Site footer. They render on every page with no template editing.
The header hooks wp_body_open, the footer wp_footer.
Shortcode reference
- item
- Required. The design's embed token, from the Embed dialog in Brackits. A missing or malformed token renders nothing but an HTML comment, so check your page source if a placement looks blank.
- mode
-
Optional,
seoorjs. Overrides the site-wide render mode for this placement only. Omit it to follow the site default. - width
-
Optional,
contained. Designs run edge to edge by default; this keeps one inside your theme's content column instead. Floating designs ignore it — they position themselves against the viewport already.
Placing the same design twice on one page is safe — its styles and script are emitted once.
Render modes
In the page, or in a shadow root.
Set the default in Settings → Brackits → Render mode, and override it per
placement with the block's setting or the shortcode's mode attribute.
Default
SEO
Your server writes the design's real markup into the page. Search engines, SEO plugins, excerpts and your site's own search read it like any other content, and page caches serve it like any other HTML.
The design's CSS is scoped to its own wrapper, but a theme with very broad rules can still reach inside it.
Fallback
Isolated
The design loads with JavaScript into a shadow root your theme's CSS cannot touch. Use it when a design clashes with your theme and you'd rather have total isolation than indexable text.
Floating designs — announcement bars, sticky widgets — are always Isolated. They build their own host element, so there is no static equivalent.
However you place them, republishing in Brackits updates connected sites within seconds — we notify each site the moment a design changes. There is nothing to do on the WordPress side.
Troubleshooting
When something looks wrong.
The design list in the plugin is empty.
Almost always the project link. In Brackits, open the project holding those designs and set Project settings → WordPress site to this site. Connecting the plugin alone doesn't do it.
Then check the designs are published — the plugin only lists published ones. Finally, hit Refresh items in Settings → Brackits; the list is cached for five minutes.
“Connect to Brackits” doesn't complete.
The one-click connection needs Brackits to reach your site once, to confirm you own it. Sites on localhost, behind a VPN, or blocking outside requests can't complete that step.
Add the site from Integrations in your Brackits dashboard instead, then paste its site key into Settings → Brackits. Everything else works the same.
My automatic header doesn't appear.
Automatic injection uses the wp_body_open hook. Nearly every theme built since WordPress 5.2 calls it, but a few older or heavily customised themes don't.
If yours doesn't, place the design with the block or the shortcode instead — the result is identical.
I republished in Brackits but WordPress still shows the old version.
Brackits pushes a notification to every connected site on republish, so the change normally lands within seconds. If it hasn't, check the Integrations page in Brackits — a Last update not delivered badge on the site means we couldn't reach it, usually a firewall or a security plugin blocking our REST call.
Either way the plugin picks the change up on its own within five minutes, and Refresh items forces it immediately. If your site sits behind a page cache or CDN, clear that too.
A design clashes with my theme's styles.
Brackits scopes each design's CSS to its own wrapper, but a theme with very broad rules can still reach inside it.
Switch that placement to Isolated mode — [brackits item="TOKEN" mode="js"], or the block's render-mode setting — and the design renders inside a shadow root your theme can't touch. You trade the SEO benefit for total isolation.
My design runs edge to edge — how do I keep it in my content column?
That's the default from version 0.6.0 onwards. Brackits designs are built as full-width bands that manage their own inner column, so most themes' content padding would otherwise cut them short by 30px or so on each side.
To keep one inside your theme's column, use [brackits item="TOKEN" width="contained"], set Width to Theme content width in the block sidebar, or turn off Full width in the library before inserting.
Upgrading to 0.6.0 changes designs you had already placed, since they were never opted in either way.
A placement renders nothing at all.
View the page source. The plugin leaves an HTML comment saying why: an invalid token, or an item it couldn't find. An unknown token usually means the design isn't published, or its project isn't attached to this site.
How do I update the plugin?
From version 0.3.0 onwards you don't have to do anything special: new releases show up on your Plugins screen like any other update, and you can turn on auto-updates there too.
If you're still on 0.2.0 or earlier, that one upgrade has to be done by hand — download the current ZIP and upload it over the top in Plugins → Add New → Upload Plugin. After that, updates come to you. Your site key and settings survive either way.
Does the plugin send my visitors' data to Brackits?
No. The plugin only talks to Brackits from your server, to list your published designs and fetch their markup. Nothing about your visitors is sent.
Will it conflict with my caching or optimisation plugin?
In SEO mode designs are part of the page HTML, so page caches serve them like any other content. In Isolated mode a design loads from a script tag — if an optimiser inlines, defers, or combines scripts you may need to exclude the Brackits script from that rule.
What happens if I deactivate the plugin?
Placed designs stop rendering, and shortcodes become inert text. Nothing is deleted in Brackits. The plugin ships an uninstall routine that cleans up its own settings when you delete it.
Still stuck?
Send us your setup.
Tell us your WordPress version, active theme, and how you placed the design, and we'll work out what's happening.
Or email [email protected] directly.