{"id":811,"date":"2022-09-07T12:05:54","date_gmt":"2022-09-07T12:05:54","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/09\/07\/6538352-hostinger-website-builder-product-sections\/"},"modified":"2026-05-08T13:02:06","modified_gmt":"2026-05-08T13:02:06","slug":"6538352-hostinger-website-builder-product-sections","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6538352-hostinger-website-builder-product-sections\/","title":{"rendered":"Hostinger Website Builder: Product Sections"},"content":{"rendered":"

With Hostinger Website Builder<\/b>, you can easily add product sections to your site by following the steps below 👇<\/p>

\n<\/p>

1. Within the builder, expand the Pages and navigation <\/b>panel on the left and open the page where you wish to display products. On that page, click on Add section<\/b>:<\/p>

\n<\/p>

\"Store<\/div>

\n<\/p>

2. From the sections’ menu, select Online store<\/b>. On the right, you’ll find two types of product sections – product list<\/a><\/b> and single product<\/a> <\/b>– <\/b>click on the preferred section, and it’ll be inserted into your page:<\/p>

\n<\/p>

\"Online<\/div>

\n<\/p>

Product List Section<\/h2>

This type of section is used to display all your products or a particular product category<\/a><\/b>. By default, it shows all your products. To display products from a particular category, click on Edit section:<\/b><\/p>

\n<\/p>

\"Product<\/div>

\n<\/p>

Select the preferred category<\/b> here:<\/p>

\n<\/p>

\"Product<\/div>

\n<\/p>

Learn more about the product list section settings<\/b>:<\/p>

\n\n\n\n\n\n\n\n\n
\n

Category<\/b><\/p>\n<\/td>\n

\n

Display:<\/p>\n

    \n
  • \n

    All products, or<\/p>\n<\/li>\n

  • \n

    A specific product category<\/p>\n<\/li>\n<\/ul>\n<\/td>\n<\/tr>\n

\n

Layout<\/b><\/p>\n<\/td>\n

\n

Change the following:<\/p>\n

    \n
  • \n

    Product display style<\/p>\n<\/li>\n

  • \n

    Columns (products per row)<\/p>\n<\/li>\n

  • \n

    Top\/bottom padding of the section<\/p>\n<\/li>\n<\/ul>\n<\/td>\n<\/tr>\n

\n

Style<\/b><\/p>\n<\/td>\n

\n

Change the following:<\/p>\n

\n

Pagination<\/b><\/p>\n<\/td>\n

\n

Specify the number of products per page (within the product list section)<\/p>\n<\/td>\n<\/tr>\n

\n

Add to bag button<\/b><\/p>\n<\/td>\n

\n

Enable the Add to bag<\/b> button, so your clients can preview a product and\/or add it to the cart without opening the product page; you can also change the button style there<\/p>\n<\/td>\n<\/tr>\n

\n

Ribbons<\/b><\/p>\n<\/td>\n

\n

Change the following:<\/p>\n