{"id":4365,"date":"2025-07-16T13:47:59","date_gmt":"2025-07-16T13:47:59","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=4365"},"modified":"2025-07-16T13:57:21","modified_gmt":"2025-07-16T13:57:21","slug":"how-to-create-a-shop-page-template","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetwoobuilder\/how-to-create-a-shop-page-template\/","title":{"rendered":"How to Create a Shop Page Template"},"content":{"rendered":"\n

The JetWooBuilder<\/em> plugin makes WooCommerce shop page customization effortless. This tutorial will guide you through the process step-by-step.<\/p>\n\n\n\n

The JetWooBuilder <\/em>plugin is enough for the shop template, but if you want to create a page template with a header, body, and footer, JetThemeCore<\/em><\/a> <\/em>is required.<\/p>\n\n\n\n

How to Create a Shop Template with the JetWooBuilder Plugin<\/strong><\/h2>\n\n\n\n
\n

Enable Shop widgets<\/strong><\/h3>\n\n\n\n

Go to WordPress Dashboard ><\/em><\/strong> Crocoblock > JetPlugins Settings > JetWooBuilder > Widgets<\/em><\/strong>, scroll to the Shop Product Widgets <\/strong>block, and enable the widgets you want to use while creating a Shop template.<\/p>\n\n\n\n

\"shop<\/a><\/div>\n\n\n\n

Create a template<\/strong><\/h3>\n\n\n\n

Proceed to the WordPress Dashboard > Crocoblock ><\/em><\/strong> <\/em>Woo Page Builder<\/em><\/strong> tab and click the \u201cCreate New Template<\/strong>\u201d button.<\/p>\n\n\n\n

There will be a starting pop-up window. Select the \u201cShop\u201d option in the This Template For<\/strong> drop-down menu and type in the Template Name<\/strong>. If you are confused about the shop page layout, choose a pre-set in the Select Layout Preset <\/strong>section. Afterward, click the \u201cCreate Template<\/strong>\u201d button.<\/p>\n\n\n\n

\"create<\/a><\/div>\n\n\n\n

For more visual instructions, watch the video tutorial<\/a> on creating a Shop page template with JetWooBuilder. <\/p>\n\n\n\n

Fill the Shop template with widgets<\/strong><\/h3>\n\n\n\n

You can start editing the Woocommerce shop page by filling it up with all the needed widgets. The shop template is applied when you open one of the product category pages, and it shows the elements you\u2019ve included in the template.<\/p>\n\n\n\n

There are eight widgets available for the shop template, so let\u2019s take a brief look at each of them.<\/p>\n\n\n\n

\"jetwoobuilder<\/a><\/div>\n\n\n\n

Products Description<\/h4>\n\n\n\n

This widget displays the description you wrote for the specific category. <\/p>\n\n\n\n

In the Style <\/strong>tab, you can choose the Typography<\/strong>, Color<\/strong>, Text Shadow<\/strong>, and Alignment<\/strong> of the displayed text.<\/p>\n\n\n\n

\"products<\/a><\/div>\n\n\n\n

Products Loop<\/h4>\n\n\n\n

The Products Grid<\/strong><\/a> widget displays a grid containing a specified number of products on the page, wherea<\/span>s the\u00a0Products List<\/a><\/strong>\u00a0widget displays the same products in a list. The Products Loop<\/strong> widget, besides showing an endless loop of products, allows you to switch between the grid and list views.<\/p>\n\n\n\n

The Products Loop<\/strong> widget shows the archive<\/strong><\/a> products template layout by default. Still, you can create a dedicated archive template with a dedicated product displaying design and attach it in the Template <\/strong>drop-down of the Products Loop <\/strong>section so that different product loops on different pages will show distinct template layouts.<\/p>\n\n\n\n

\"products<\/a><\/div>\n\n\n\n

In the Layout Switcher <\/strong>section, you can activate the Enable<\/strong> toggle to switch between the grid and list view. The following features are presented:<\/p>\n\n\n\n

\"products<\/a><\/div>\n\n\n\n