1. Home
  2. Docs
  3. Shoptimizer
  4. Create a full width category banner

Create a full width category banner

You can now create a full width category banner in Shoptimizer, with a background image if you wish. The result looks like this. Before beginning, make sure that you’re running the latest version of the theme by updating first.

Full width category banner

Step 1

Install the Advanced Custom Fields plugin.

Step 2

Download this file. You can right-click and Save As or open it in a new tab and Save Page.

Step 3

Go to: Custom Fields > Tools > Import Field Groups and choose the file you’ve just downloaded.

Step 4

Shoptimizer full width category banner
The new category banner field within Products > Categories – when editing a category

Now, when you edit a product category you should see an additional image upload option at the bottom called WooCommerce Category Banner. You can add an image to this if you would like a background image to appear.

Step 5

Add some text to the category description field if you like. A standard <ul> list will render as buttons. This is a great opportunities to link to other sub categories or even products.

Note: To see a nice editor in this space you should install and enable the Yoast SEO plugin.

Step 6

Finally, enable this category layout. Go to Appearance > Customize > Layout > WooCommerce – and under ‘Product Categories’ ensure that Below header is chosen.

Shoptimizer - find out more
The fast WooCommerce theme built for speed and conversions.

Was this article helpful to you? Yes No

How can we help?