WP Manifestindependent plugin directory
manifest / editor / wp-hero-block

WP Hero Block

A custom Gutenberg block for creating a Hero section with image or video background.

by code-mat · github.com/code-mat/wp-hero-block

★ 1stars

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/code-mat/wp-hero-block/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/code-mat/wp-hero-block ↗

A custom Gutenberg block for WordPress that renders a Hero section with:

  • Background image or video
  • H1 title
  • Optional overlay
  • Smooth scroll-to link

Built as a dynamic block with PHP render.php and bundled assets (@wordpress/scripts).

📦 Installation

  1. Clone or download this repository into your WordPress plugins folder:

    cd wp-content/plugins
git clone https://github.com/code-mat/wp-hero-block.git

  2. Install dependencies and build assets:

    cd wp-hero-block
npm install
npm run build

  3. Activate the plugin in WordPress Admin → Plugins.

⚡ Development

Start a development build with file watching:

npm run start

Build for production:

npm run build

Create a plugin zip for distribution:

npm run plugin-zip

🛠️ Block Features

  • Background
    • Image (uses <img> with object-fit: cover for better LCP)
    • Vimeo embed via `