WP Manifestindependent plugin directory
manifest / editor / moo-digital-media-text

Moo Digital Media and Text

A WordPress block plugin that replicates the native Media and Text block, with the addition of an image overlay colour and opacity control — matching the Cover block's overlay UI.

by Moo Digital Ltd. · github.com/moo-digital/moo-digital-media-text · website

★ 0stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/moo-digital/moo-digital-media-text/archive/refs/heads/main.zip
No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.
Readme github.com/moo-digital/moo-digital-media-text ↗

A WordPress block plugin that replicates the native Media and Text block, with the addition of an image overlay colour and opacity control — matching the Cover block's overlay UI.

Features

  • All standard Media and Text features (image/video, media position, stack on mobile, image fill, vertical alignment, media width)
  • Overlay colour picker — sits in the Colour panel in the block sidebar
  • Overlay opacity slider — appears when an overlay colour is set

Setup

Requirements

  • Node.js (v18+)
  • npm

Install dependencies

npm install

Build for production

npm run build

Start dev mode (watch)

npm run start

The compiled files will be output to the /build directory. This directory must exist (and contain the compiled assets) before the plugin will work.

Installation

  1. Build the plugin (npm run build)
  2. Upload the entire moo-digital-media-text folder to /wp-content/plugins/
  3. Activate via Plugins in the WordPress admin
  4. Find the block in the editor by searching "Media and Text Overlay"

Folder Structure

moo-digital-media-text/
├── moo-digital-media-text.php   Main plugin file
├── package.json                 npm config
├── src/
│   └── blocks/
│       └── media-text-overlay/
│           ├── block.json       Block metadata
│           ├── index.js         Block JS (edit + save)
│           ├── editor.css       Editor-only styles
│           └── style.css        Frontend + editor styles
└── build/                       Compiled output (generated)