Get a fast, conversion-focused WooCommerce theme in 2021. Switch to Shoptimizer.

Home Documentation Shoptimizer Header Edit the secondary menu

Edit the secondary menu

This is the secondary menu in Shoptimizer. It appears within the header and there are icons above each menu label.

Secondary Menu using SVGs

Go to: Appearance > Menus – and select the Secondary Menu in the dropdown.

You’ll need to also click on Screen Options at the very top of the Menus screen and ensure that Description is ticked.

Secondary menu - SVGs

Edit a menu item and we’ll need to add a new SVG icon into the Description field for each and ensure that the CSS Classes field is empty.

Here is what it will look like:

Note that the CSS Classes field is empty.

And all that SVG code, where can you find that? Thankfully, Heroicons makes this very easy. You can search for an icon, hover over it and click Copy SVG.

Then, you can paste it into the Description field.

We’re using the Medium set in the theme demo but feel free to mix this up. Or indeed, use a different icon set entirely.

To make it even easier, this is the SVG code we’re using for each.

My Account:

Customer Help:

Checkout:

$50
Off

Do you want a whopping $50 off Shoptimizer for WooCommerce?

Click the button below to get Shoptimizer for only $49. (Regular price: $99).
This is a special launch offer for today only.
Get it before it is gone!
{"cart_token":"","hash":"","cart_data":""}