WooCommerce Grid/List View

Description

WooCommerce Grid/List View is a simple plugin which adds a grid/list view toggle button to your product archives, allowing users to toggle between grid and list views of your products on your WooCommerce store.

The list view arranges products in a vertical list and pulls in the excerpt to give a more detailed overview.

The grid view you will be familiar with, as this is WooCommerce’s default layout for product archives.

The store owner can choose whether grid or list view be set as the default via the WooCommerce > Product Catalog section of the Customizer.

This plugin is loosely based on James Koster’s plugin, but with some improvements, such as:

  • PHP 7+ and 8+ compatibility
  • Tested up to WordPress 5.8.1
  • No jQuery dependency – updated jQuery Cookie from 1.2.1 to 1.4.1, and then replaced it with JS Cookie (3.0.1)
  • ES6
  • Less resources (combined 2 stylesheets into one)
  • Better UI (behind the scenes, though, as I have changed the original float layout with Flex CSS)

Installation

  • Upload woocommerce-grid-list-view to the /wp-content/plugins/ directory
  • Activate the plugin through the Plugins menu in WordPress
  • Choose the default setting on the catalog tab of the WooCommerce settings screen
  • Done!