WP Manifestindependent plugin directory
manifest / editor / ambient-backgrounds

Ambient Backgrounds

A WordPress plugin that adds animated, ambient, and customizable background blocks to the page editor.

by Tarek Zaher · github.com/tarek-zaher/ambient-backgrounds

★ 0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/tarek-zaher/ambient-backgrounds/archive/refs/heads/main.zip
Readme github.com/tarek-zaher/ambient-backgrounds ↗

A WordPress plugin that adds an animated, ambient, and customizable background block to the page editor. After activating the plugin you will see Ambient Background in your list of block options. Add it to the page like any other block and add any content inside. Pick a background style — Blur or Starfield — from the Type dropdown, and customize the animation in the Block Editor side panel to match your brand or liking.

Features

  • Block-editor native (Gutenberg)
  • Live animated preview inside the editor
  • Selectable background styles (Blur and Starfield) from a dropdown
  • Customizable colors and animations
  • Inner blocks: place any content on top of the background

Development

npm install
npm start        # watch mode
npm run build    # production build (outputs to build/)

The plugin reads from build/ambient-background/block.json at runtime, so you must run a build before activating.

Installation

  1. Run npm run build.
  2. Copy or symlink this folder into wp-content/plugins/.
  3. Activate Ambient Backgrounds in the WordPress admin.

Testing with wp-env

Follow the steps outlined in the official WordPress Developer Docs here to test the plugin using wp-env.

Roadmap

  • Additional background types in the Type dropdown
  • Better default formatting for Inner Blocks