Guides / WordPress, for developers
The plugin supports two personalisation methods. Slots fill content client-side after page load and work with any caching plugin. Zones render content server-side before the page is sent, with no shimmer and no caching conflicts.
This page covers installation and rendering setup. If you are writing or reviewing the content itself, see the WordPress guide for marketers. To bring an existing site’s pages in as a starting content library, see importing your existing content.
Zone blocks, caching compatibility, and a full API reference for developers evaluating Spectare in depth.
From: WordPress install in 30 minutes starting from the plugin directory, Zone blocks client-side slots and the legacy slot path, Compatible with caching plugins
Slots
Client-side, works everywhere
Use for blog sidebars, WooCommerce pages, or any site where disabling page caching is not practical.
Zones
Server-rendered, no shimmer
Use for marketing pages and landing pages where first-paint quality matters and you can accept a slightly slower uncached load.
Slots and zones are independent methods that work alongside each other, not an either/or choice. Slots fill client-side after the page loads; zones render on the server before the page is sent. Most sites use one method per page, matched to the page: zones on marketing and landing pages where first paint and SEO matter, slots on cached pages, blog templates, and sidebars where you would rather not disable page caching or manage an API key. You can also combine them on a single page, for example a zone hero with slots further down.
Returning visitors
Spectare keeps a visitor’s recent page history in their own browser, and it is the strongest signal it has: someone who read your pricing page last week and comes back directly carries no referrer and no campaign tags, so without that history they look like a brand new visitor and get your default content.
Slots read it directly, because they run in the browser. Zones render on your server, which cannot see the visitor’s browser storage. To give zones the same signal, turn on Returning visitors in zones under Settings, Spectare. The visitor’s last three page paths are then stored in a first-party cookie on your own domain, and your server passes them to Spectare with the zone request.
It is off by default because it adds a cookie to your site, so check your cookie policy before enabling it. Nothing is stored on Spectare’s side and the cookie is never sent to another domain. Slots are unaffected either way.
One plugin covers both methods. The API key is only required if you use zones.
Download and activate the plugin
Enter your workspace slug
Settings, Spectare
Add your API key
zones only
Add a slot or zone block
in the Gutenberg editor
The API key step is only needed if you plan to use zones.
Install the plugin
In your WordPress admin, go to Plugins, then Add New, and search for Spectare. Install and activate Spectare Personalisation from the official WordPress plugin directory. You can also download the zip from the homepage and upload it manually.
Enter your workspace slug
Go to Settings, then Spectare. Enter your workspace slug, the short identifier for your organisation, visible in your Spectare admin URL and on the Settings page.
Add your API key (zones only)
If you plan to use server-rendered zones, copy your API key from Spectare admin under Settings. Paste it into the API key field in Settings, Spectare. Leave blank if you are only using slots.
Add a slot or zone to a page
Open any page in the Gutenberg editor. Search for "Spectare Slot" or "Spectare Zone" in the block inserter. Drag it onto the page, choose your slot name or zone, and publish.
From version 1.7.0 the plugin needs no ongoing attention. Two things run without setup:
Updates install themselves
The plugin checks for new versions and updates through the normal WordPress update screen, like any directory plugin. The zip you upload at install time is the only one you ever handle.
Conversions track themselves
Paid WooCommerce orders report with the real order total and currency. Gravity Forms, WPForms and Contact Form 7 submissions report as leads. Clicks on phone numbers, email links and booking platforms count too, since those journeys never reach a thank-you page. Each appears in your analytics under its own goal name, and each has an off switch in Settings or via a filter.
Slots are filled by spectare.js after page load. Use the Gutenberg block or shortcodes.
Gutenberg block
Search for Spectare Slot in the block inserter. Choose a slot name in the block settings panel. The three below are the common ones; the block also offers two extra supporting slots and a custom name for additional placements. Optionally set a reserved height to prevent layout shift while content loads.
primaryMain content block. Place above the fold or at the top of your content area.
supportingSecondary block. Place in the middle of the page or alongside the primary slot.
secondaryThird block. Use for a CTA area, sidebar, or bottom of page.
Shortcodes
[spectare_slot name="primary"]
[spectare_slot name="supporting"]
[spectare_slot name="secondary"]Reserving height to prevent layout shift
The height parameter reserves vertical space before content loads. Value is in pixels. 200 is a sensible default for a feature card.
[spectare_slot name="primary" height="200"]Zones are rendered server-side by the PHP plugin before the page is sent. Requires an API key. Page caching is bypassed automatically on any page that contains a zone.
Gutenberg block
Search for Spectare Zone in the block inserter. Choose a zone in the block settings panel. Each zone renders component types matched to its position on the page.
heroHero banners and image overlays. Above-fold position.
HeroStatement, ImageCtaHero
bodyFeature cards, stats, code blocks, comparison tables.
AtomCard, StatGrid, CodeBlock, FeatureList, ComparisonTable
proofSocial proof and case studies.
TestimonialCard
ctaCall-to-action strips.
CtaStrip
Shortcodes
[spectare_zone zone="hero"]
[spectare_zone zone="body"]
[spectare_zone zone="proof"]
[spectare_zone zone="cta"]How caching is handled
Any page containing a [spectare_zone] shortcode or zone block sets the DONOTCACHEPAGE constant and sends Cache-Control: no-store headers. All major caching plugins (WP Rocket, W3 Total Cache, WP Super Cache, LiteSpeed Cache) recognise this constant and skip caching for that page. No manual cache configuration is needed.
Cold cache load time
On the first uncached request, the plugin calls the Spectare API to classify the visitor and assemble content. This adds 2 to 8 seconds to the server response time for that visitor. Subsequent visitors with the same intent pattern (same UTM source, medium, and campaign) hit the Spectare assembly cache and receive content in under 100ms. For key landing pages, you can warm the cache by visiting the page with representative UTM parameters before your campaign goes live.
All shortcodes work in any page builder via an HTML or Code element. Zone shortcodes work the same way as slot shortcodes.
Elementor
Add an HTML widget. Paste the shortcode inside it.
Divi
Add a Code module. Paste the shortcode inside it.
Beaver Builder
Add an HTML module. Paste the shortcode inside it.
WPBakery
Add a Raw HTML element. Paste the shortcode inside it.
Bricks Builder
Add a Code element. Paste the shortcode inside it.
Classic editor
Switch to the Text tab and paste the shortcode where you want it to appear.
If you prefer not to use the plugin, add the script tag manually and place data-spectare-slot divs in your templates. Zones require the plugin since they need server-side PHP execution.
<script
src="https://spectare.ai/spectare.js"
data-org="YOUR_WORKSPACE_SLUG"
data-base-url="https://spectare.ai"
></script>Slots fill via JavaScript after the cached HTML page loads, so page caching does not affect them. Zones bypass page caching automatically via DONOTCACHEPAGE.
WP Rocket
Slots: CompatibleZones: Bypassed automaticallySlots: Works out of the box. If you have JS delay enabled, add spectare.js to the excluded files list under Settings, File Optimisation, Delay JavaScript Execution.
Zones: Zone pages set DONOTCACHEPAGE so WP Rocket skips them. No configuration needed.
W3 Total Cache
Slots: CompatibleZones: Bypassed automaticallySlots: Page caching does not affect slots. If you use JS minification, exclude spectare.js from the minify list.
Zones: Zone pages set DONOTCACHEPAGE. W3 Total Cache respects this constant automatically.
WP Super Cache
Slots: CompatibleZones: Bypassed automaticallySlots: No configuration needed. Slots fill after the cached HTML page loads.
Zones: Zone pages set DONOTCACHEPAGE and nocache headers. WP Super Cache skips these pages.
LiteSpeed Cache
Slots: CompatibleZones: Bypassed automaticallySlots: Works without configuration. If you use JS defer, add spectare.js to the JS Defer Excludes list.
Zones: Zone pages set DONOTCACHEPAGE. LiteSpeed Cache honours this constant.
Cloudflare Rocket Loader
Slots: CompatibleZones: Not applicableSlots: If you see empty slots, add spectare.js to the Rocket Loader exclusion list in your Cloudflare dashboard under Speed, Optimisation.
Zones: Zone rendering is server-side and is unaffected by Rocket Loader.
Autoptimize
Slots: CompatibleZones: Not applicableSlots: Exclude spectare.js from JS optimisation via the "Exclude scripts from Autoptimize" field.
Zones: Zone rendering is server-side. Autoptimize JS handling does not apply.
Slots appear empty after page load
Check that spectare.js is not being deferred or blocked by your caching plugin. Open browser DevTools, go to the Network tab, and confirm spectare.js loads with a 200 status. Also confirm your workspace slug is correctly entered in Settings, Spectare.
Empty slots with Cloudflare Rocket Loader enabled
Add spectare.js to the Rocket Loader exclusion list. In your Cloudflare dashboard, go to Speed, Optimisation, and find the Rocket Loader exclusion field. Add the full script URL: https://spectare.ai/spectare.js.
Slot pages jump when content fills in
Add the height parameter to your shortcode: [spectare_slot name="primary" height="200"]. This reserves vertical space before content loads so the layout does not shift.
Zone pages return a blank area or no content
Check that your API key is entered correctly in Settings, Spectare. The key starts with sk_. Then check the base URL field: it should be https://spectare.ai (or your custom domain if self-hosted). Open your browser network tools and look for a failed request to /api/assemble/ssr.
Zone pages are slow to load
The first uncached request calls the Spectare API and can take 2 to 8 seconds. Subsequent requests with the same UTM pattern use the assembly cache and load in under 100ms. Warm the cache before campaigns go live by visiting the page with representative UTM parameters.
Zone pages are being cached by my caching plugin
The plugin sets DONOTCACHEPAGE and Cache-Control: no-store headers automatically. If your caching plugin is still caching these pages, check that the plugin supports the DONOTCACHEPAGE constant (all major plugins do). As a fallback, add the page URL to your caching plugin's excluded pages list.
Content does not change between visits
Spectare assembles content based on visitor signals. If there are no UTM parameters, referrer, or page context signals, the same default content appears. Add UTM parameters to your campaign links to give Spectare stronger intent signals.
Email us at [email protected] and we will help you get Spectare working on your site.