Configure Grid Showcase

The Grid layout is ideal for displaying multiple categories in a structured and clean design. It keeps your products organized, making it easier for customers to explore your store. This guide walks you through the entire process of setting up a Grid Showcase in WC Category Showcase, from start to finish.

Step 1: Prepare Your Category Images

Before you start building, make sure each category has a clear, high-quality image. These images define the overall look of your showcase.

Follow this guide to learn how to add or update category images: Preparing Category Images

Use consistent image dimensions to keep your grid aligned and professional.

Step 2: Create a New Showcase

Once your images are ready, it’s time to create your first showcase.

Go to Category Showcase → Add New Showcase. Give your showcase a title and configure its basic layout.

Detailed instructions can be found here: Creating Your First Showcase

Step 3: Choose the Layout Type

When you reach the Layout Selection section, choose Grid Layout from the available options.

This layout displays your product categories in a structured grid with rows and columns.

To explore layout options in detail: Layout Selection

Step 4: Select Categories to Display

Next, go to the Category Selection section.

Choose which categories (and subcategories, if needed) you want to display. You can also control the order and visibility.

Learn how selection works here: Category Selection

Step 5: Customize the Title and Description

To make your showcase informative and engaging, enable titles and descriptions for each category from the Showcase tab.

This helps customers understand what each section represents.

Detailed setup instructions: Title & Description Settings

Step 6: Adjust Category Card Appearance

Each category in the grid is displayed as a card.

You can control how these cards look. Change borders, background colors, or hover effects.

Read more about it here: Category Card Settings

Step 7: Configure CTA Button

Then move to the Button Style Settings to customize your “View Products” or “Shop Now” buttons.

See guides for both: Button Style Settings

Step 8: Fine-Tune Fonts and Typography

Typography affects how your content feels.

You can adjust font size, color, and spacing in the Fonts Settings tab.

Detailed guide: Fonts Settings

Step 9: Publish and Preview

Once everything looks right, click Publish and preview your showcase on the front end.

You should now see a shortcode. You can copy this code and paste it inside any page using the shortcode block. Now, the product categories should be neatly displayed in a grid format.

Related Guides