> For the complete documentation index, see [llms.txt](https://help.gordonbyte.com/themes/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.gordonbyte.com/themes/halo-one/overview/category-products.md).

# Category Products

This section is dedicated to showcasing a particular category and presenting the products within that category. It enables users to conveniently browse through the products directly from the homepage.

## How to enable Category Product section? <a href="#id-1999972773-99ea77" id="id-1999972773-99ea77"></a>

To enable first navigate to your **Page Builder** [*(how to launch Page Builder?)*](/themes/halo-one/halo-one-theme.md#page-builder)

When using the Page Builder, locate and select the Category Products tab. The maximum number of category product sections that can be displayed is 4, which are labeled as the **First, Second, Third, and Fourth** Categories.

Look for the textfield labeled **Category id** in each section and enter the **ID** of the desired category you want to display.

To disable each section, simply leave the Category id textfield for that particular section empty.

## How to find category ID? <a href="#id-1454454087-16tg80" id="id-1454454087-16tg80"></a>

To locate your category ID, follow these steps:

1. Access your Bigcommerce web store admin panel.
2. Navigate to the **Products** menu and select **Product Categories**.
3. Select the name of a parent category or subcategory.
4. Once the category page loads, examine the URL to find the category ID number.

<figure><img src="/files/J2CaqLGkjSRPr7KEoGam" alt=""><figcaption></figcaption></figure>

## Display styles options

This feature provides you with the option to choose between a slider or a multi-row grid view for displaying your category products.&#x20;

The carousel view allows for a dynamic and visually engaging presentation, enabling customers to scroll through the products horizontally.&#x20;

On the other hand, the multi-row **grid** view offers a structured layout with rows and columns, allowing for a comprehensive display of multiple products within each category.&#x20;

With these versatile display options, you can customize the appearance of your category products section to suit your website's design and enhance the browsing experience for your customers.

## How to upload icon

To assign an icon image, the first step is to upload the image to the image manager in the admin panel. [*(How to upload using image manager?)*](https://support.bigcommerce.com/s/article/Using-the-Image-Manager#uploading)

After uploading the image, select the link labeled **View Full Size** under desired image. Then, in the browser address bar, copy the image name located between "**/uploaded\_images/**" and the "**?**" symbol.

*Ex: /product\_images/uploaded\_images/**banner\_image1.png**?t=1606861987&*

Once copied go back to the theme editor and paste in the textfield labeled **image link** and **save**.

{% hint style="info" %}
Recommended images size **35px x 30px**
{% endhint %}

## How to change Category title?

In this section, e-commerce merchants have the ability to customize the title text according to their preferences. To set the desired title, enter the appropriate value into the **Header** settings textfield.&#x20;

To disable this settings, leave the textfield blank.