WP Manifestindependent plugin directory
manifest / themes / vb-responsive-header

VB Responsive Header

VB Responsive Header** gives you a professional, animated header anywhere you place the shortcode `[vb_header]`. It was designed to be

by Victor Busayo · github.com/busayor2020/vb-responsive-header · 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/busayor2020/vb-responsive-header/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/busayor2020/vb-responsive-header ↗

A fully responsive, WCAG-compliant site header via shortcode. Logo and CTA button areas are powered by WordPress widget areas — drop in any widget, block, or shortcode you like. Works seamlessly with Elementor.

Description

VB Responsive Header gives you a professional, animated header anywhere you place the shortcode [vb_header]. It was designed to be:

  • Widget-driven — The logo slot and the CTA/button slot are both WordPress Sidebar/Widget Areas. You can drop in an Image widget, Custom HTML, a WooCommerce cart button, an Elementor shortcode — anything WordPress supports.
  • Responsive — On desktop you get the full Logo + Nav + CTA bar. On mobile the nav and CTA disappear and a smooth hamburger icon takes their place. Tapping the hamburger reveals a full-width dropdown with the nav links and the CTA button at the bottom.
  • Accessible (WCAG 2.1 AA) — Correct ARIA roles, aria-expanded toggling, keyboard navigation, focus trap, and screen-reader text included out of the box.
  • Fully customisable — Every colour, size, font, z-index, shadow, and breakpoint is configurable via Appearance → VB Header Settings with live colour pickers. A Custom CSS textarea lets you go further.
  • Elementor compatible — Works inside Elementor Shortcode widgets, Text Editor widgets, and as raw shortcode output in any section.

Shortcode usage

Basic: [vb_header]

With a specific menu and an extra wrapper class: [vb_header menu="main-menu" class="dark-header"]

Quick start

  1. Install & activate the plugin.
  2. Go to Appearance → Menus and create (or choose) a menu.
  3. Go to Appearance → VB Header Settings, choose your menu, adjust colours, and save.
  4. Go to Appearance → Widgets and add widgets to:
    • VB Header — Logo Area (Image widget recommended)
    • VB Header — CTA / Button Area (Custom HTML or shortcode button)
  5. Paste [vb_header] into any page, post, or Elementor Shortcode widget.

Installation

  1. Upload the vb-responsive-header folder to /wp-content/plugins/.
  2. Activate via Plugins → Installed Plugins.
  3. Configure under Appearance → VB Header Settings.

Changelog

1.1.0

  • Added CTA / Button Container sizing panel: min-width, min-height, horizontal padding, vertical padding, gap between buttons, and vertical alignment controls.
  • CTA container now uses CSS flexbox with configurable gap — multiple buttons (e.g. Register + Login) display side-by-side without shrinking.
  • Both desktop and mobile CTA areas respect the new size variables.

1.0.0

  • Initial release.

Author

Victor Busayo