Put Sonic Weaver on your website

Any visualizer look can play on your own website: WordPress, Squarespace, Webflow, Shopify, Wix, Ghost or plain HTML. It loops, moves to a built-in beat or to the music player already on your page, and links back to Sonic Weaver with a small "Made with Sonic Weaver" mark. It plays on your visitors' devices, so it costs your site nothing to run.

You choose where the motion sits. The three layered ways add motion to the site you already have: nothing in your theme is rewritten.

• In the page: a box in your content, in any of the six shapes (16:9, 9:16, 1:1, 4:5, 4:3, 21:9).
• Behind a section: it fills a section, such as your hero, behind that section's own text and buttons.
• Behind the whole page: it sits behind everything on the page, so your layout stays exactly as it is and simply gains motion.
• Over a section: see-through motion over a picture or a banner. Clicks pass straight through to your site.

Every way of embedding takes the same settings, so the WordPress block, the shortcode and the one-line script always agree.

• The look: any listed visualizer, by its engine and mode.
• Sound: the built-in beat at your tempo (60 to 180 BPM), a calm drift, or your page's own audio or video player.
• Reactivity, speed (25 to 300 percent of the look's own) and your brand colours.
• Autoplay, the controls (shown on hover, always, or hidden), quality and frame rate.
• Corners, opacity for the layered ways, an accessible title, and which corner the mark sits in.

The free Sonic Weaver Embed plugin adds a Sonic Weaver block with every setting in its sidebar, a [sonicweaver] shortcode, and a site-wide option under Settings that puts the motion behind every page without touching your theme. Pasting a Sonic Weaver template link on its own line turns it into a player too. Until the plugin is listed in the WordPress plugin directory, download it from the Embed on your website page and install it with Upload Plugin, or paste the one-line script into your theme's header code.

• Embed on your website (and the plugin)

Copy the one-line script into the place your builder takes custom code: Squarespace Code Injection, Webflow custom code, Shopify's theme.liquid, Ghost Code injection or Wix custom code. Where scripts are not allowed, such as Wix Embed HTML or Notion, use the iframe version, which plays the built-in beat.

Choose "Your page's music" and the look follows the audio or video player on the same page, or the one you name with a CSS selector such as #my-player. It reads the music only when it can do so without muting it: a file on your own site, or one your player loads with crossorigin. Otherwise it keeps the built-in beat and says why. It never uses a microphone.

Every embed carries a small "Made with Sonic Weaver" mark that links to the look's page. To have it removed for your account, message us from the contact page and tell us where you embed.

• Contact us

The embed sets no cookies, shows no ads and sends no personal data. Layered motion always comes with a Pause motion button, and visitors who ask their device for reduced motion see a still frame with a Play button.