Documentation

Everything you need to get started with Blocksy Theme and Companion

Product Archives

Creating your main Shop page with Blocksy is simple. We’ve designed the Product Archives section of the customizer just for that, letting even the most pretentious web designer achieve beautiful results. The advantage of doing it this way is that you get to see your changes being applied in real time, letting you make the critical design decisions you want.

Let’s check out the options that you have available.

Granular Controls

Shop Settings

The first section lets you define how your products look like inside the archive. From changing the overall look of the product card, to defining the number of columns and products per page to rearranging the product card elements. Please note that some of these options might be locked behind the Blocksy Pro package, so you may need to upgrade to a Pro license.

Three card designs showcase.

As you can see, the Type 1 design offers a classic view, where elements are laid out separately on the page. Type 2 offers an “inbox” view, where everything is grouped together nicely. And Type 3 offers a minimalist view, where the buttons become visible upon hovering over the product image.

Next up, we have the Columns & Rows options, which let you control the number of products that are shown on the page.

Card Options

Rearranging card elements in action.

Starting in Blocksy 2, every element of the product card can be rearranged and modified individually, for having that perfect shop look without looking like just another WordPress website. We will go into detail of what each element does, but please note that some of these might differ if you haven’t activated all relevant extensions from Shop Extra, or if you have configured a different product card type.

Content Alignment

This option should let you arrange the card elements to the left, centre or right of the card itself.

Cards Gap

This option should let you choose the spacing that’s between the product cards.

Product Image

Shows or hides the main featured product image. There are also options for setting its size, its aspect ratio or a nice mouse hover effect, when you mouse over it. And not to forget support for our video thumbnails feature.

Title

Shows or hides the title of the product, separate from the hero container.

Price

Shows or hides the product price.

Star Rating

Shows or hides the average rating of the product, as calculated from the reviews that a product might have.

Categories

Shows or hides the product categories.

Excerpt

Shows or hides the excerpt of the product, which is automatically generated from its short description.

Add to Cart

Shows or hides the “Add to Cart” button.

Content Block

Shows or hides the Content Block element, which lets you embed a Content Block hook inside the page. The element can be multiplied.

Swatches

Shows or hides variation swatches for quickly adding a variation of a product to the cart.

Brands

Shows or hides the “Brands” metadata layer, in case you have categorised the products by brands.

Page Elements

Results Count & Product Sorting

These two options should let you show or hide the default WooCommerce product counters and sorting options, that are usually displayed at the top of the archive page.

Sidebar

This option should let you show the sidebar on either the left or right side of the archive page. Widgets can be configured via the Appearance -> Widgets section of your WordPress dashboard.

Pagination

Pagination is quite a bit interesting. It will let you set the pagination (no pun intended) options for your shop pages. Standard, will display the classic page numbers and the previous/next buttons at the bottom of the page. Next/Prev will simply display those buttons at the bottom of the page, useful in case you wish to not let your visitors know directly how many products you have available for sale. Load More will let you have the page load additional products on demand. Once the user clicks on the button, the next set of products load in place. Infinite Scroll will let you load more products based on the user’s scrolling interaction, very useful if you wish to minimize page reloads and offer a speedy experience.

Not the solution you are looking for?

Please check other articles or open a support ticket.