Documentation

Header Account & Cart documentation

How to set up and use Header Account & Cart: install, settings, shortcodes and fixes for common problems.

Overview

Header Account & Cart adds an account dropdown and a mini cart to your site header, with an optional sign-in dropdown.

Where to find it: Settings → Header Account.

What you need

  • WordPress 6.2 or newer
  • PHP 7.4 or newer
  • WooCommerce for the cart and My Account links

Install

  1. With The Vault (easiest): open The Vault in your WordPress menu, find Header Account & Cart and click Install. It is installed and activated for you.
  2. By hand: download it free from the plugin page, then go to Plugins → Add New → Upload Plugin, choose the zip and activate it.

Updates arrive automatically from wpwizards.com, like plugins from WordPress.org.

Quick start

  1. Place the shortcode. Add [wpw_header_tools] to a Text or Code module in your Divi header, or any widget or block.
  2. Set the signed-out view. Choose the button label and whether clicking it goes to My Account or opens a sign-in dropdown.
  3. Set the signed-in view. Choose the greeting and which links appear in the dropdown.

Settings

Signed out

Button label What visitors see before they sign in.
When clicked Go to the My Account page, or open a sign-in dropdown that signs in without reloading the page.
Dropdown heading and intro Optional text at the top of the sign-in dropdown.
Links Show Forgot Password? and Create Account (when registration is open).
Show Continue with Google Uses the free Nextend Social Login plugin with its Google provider set up. The button stays hidden until that is done. Works with the sign-in dropdown only.

Signed in

Greeting %s is replaced with the first name, e.g. “Hi, %s”.
Show the email address / Show Log Out Extra rows in the dropdown.
Menu links Leave empty to use the WooCommerce account menu. To set your own, one per line: Label | target. The target can be a My Account endpoint (dashboard, orders, edit-address, edit-account) or a URL.
Hide account links Comma-separated endpoints to leave out of the WooCommerce menu.
Extra links Added after the menu links. One per line: Label | URL.
After logging out Where the visitor lands.

Cart and look

Show the cart total next to the icon Adds the amount beside the cart.
Empty cart Hide the cart until something is in it, or always show the icon.
Phones and tablets Open the dropdown as a side drawer on screens 980px and narrower.
Accent color Used for buttons and highlights.

Shortcodes

[wpw_header_tools]

Cart and account menu together.

[wpw_account_menu]

Account menu only.

[wpw_header_cart]

Cart only.

Place a shortcode in a Divi Text or Code module, a Shortcode block, or a widget.

Troubleshooting and questions

The Google button does not show.

Install and activate Nextend Social Login, set up and enable its Google provider, then tick Show Continue with Google. The settings page tells you which step is missing.

The cart icon is missing.

By default the cart hides until something is in it. Change Empty cart to always show the icon.

Does it work without WooCommerce?

The account menu works with your own links. The cart needs WooCommerce.

For developers

wpw_ha_links Filter the links in the signed-in dropdown.
wpw_ha_logged_in Filter whether the visitor is treated as signed in.
wpw_ha_mobile_max Filter the screen width (default 980) below which the drawer is used.
wpw_ha_login_events Filter the browser events that refresh the menu after sign-in.

Get help

Stuck on something this page does not cover? Contact us and tell us which plugin and version you are on. Need it to do something it does not do yet? We build custom plugins too.