Blocksy theme hidden features and useful hacks

Blocksy is one of the most feature-rich themes out there and therefore, in this post I will point out 16 hidden features this theme has. Also, I will show you some neat hacks you can use to customize your theme. If you would like to know more about these features then start with the video here below.

Blocksy theme discount


Video: Blocksy theme hidden features

How to activate Woocommerce video thumbnails?

Dy default, Woocommerce shows image thumbnails, but Blocsky allow you to show video thumbnails instead. For example, you can show either Youtube, Vimeo etc. or your own custom video (MP4 file).

In order to activate this feature go to Customizer >> Woocommerce >> Product archives >> Card options and activate Video thumbnail option.

Now open a product and add a product image. Under it, you’ll see “ATTACHMENT VIDEO” option (see screenshot). Just paste a video URL or upload your own video, and you’re good to go.

NB! This is a Blocksy Pro feature

How to activate Woocommerce video thumbnails?

How to use Woocommerce variation gallery with Blocksy theme?

Blocksy allows you to add custom image galleries for your attributes. Just open up a variable product and upload your images (see the sceenshot below).

NB! This is a Blocksy Pro feature

How to use Woocommerce variation gallery with Blocksy theme?

How to display custom fields in archives and single post titles?

Blocksy has a Post Types Extra extensiot which enables support for Custom Fields inside archive cards and single page post title.

It also adds a reading progress bar for your posts and lets you set featured images and colors for your categories archives. So, go to Blocksy >> Extensions >> Pro extensions and activate it. See the video above in order to see how to display custom fields (ACF, Pods, Metabox etc) in archives and single post title.

NB! This is a Blocksy Pro feature

How to display post meta on archive image?

By default Blocksy allows you to choose where to display your post meta but if you take a look at the screenshot here below you’ll see that I’m showing it on image. So, if you like this style then do this:

Go to Customizer >> Post types >> Blog posts >> Cards options >> Cards elements and move Post meta block on top of everything.

Now go to Customizer >> Additional CSS and paste this piece of CSS inside the code box. Also, tweak it accordingly.

[data-layout*="grid"] .entry-card>*:not(:last-child).entry-meta {
    margin-bottom: -40px;
    z-index: 1;

NB! This can be done with Blocksy free and pro

How to open off-canvas elements with a link?

If you wuld like to open up some Blocksy off-canvas elements with a regular link then use these links.

NB! In order to open up a off-canvas cart you’ll need Blocksy pro

<a class="ct-offcanvas-trigger" href="#woo-cart-panel">Test Cart</a>

Off-canvas menu (see the video above because this describes how to configur off-canvas menu). Works with free and pro version.

<a class="ct-offcanvas-trigger" href="#offcanvas">Test Menu</a>

How to open a search modal with a button?

The here below will add a button and opens up a search form in a modal. Works with free and pro version.

<a href="#search-modal" class="ct-header-search ct-button" data-id="search">Search</a>

How to open a login modal with a button?

The here below will add a button and opens up a login/sign-up form in a modal. Works with free and pro version.

<a href="#account-modal" class="ct-header-account ct-button" data-state="out" data-id="account">Login</a>

How to add Blocksy search box with a shortcode?

Step 1: add this piece of code either inside your child theme’s functions.php file ot better yet, use Code Snippets plugin for it.

// Blocksy search form shortcode
add_shortcode('wpbsearch', 'get_search_form');

Step 2: use this shortcode anywhere on your site where you would like to show the Blocksy search box.


NB! This is a Blocksy Pro feature

How to display Blocksy wishlist only for logged-in users?

This is not a built in feature but can be done with a little piece of CSS. So, go to Customizer >> Additional CSS and add this inside it.

NB! This is a Blocksy Pro feature

/* Display Blocksy wishlist only for logged-in users */
.ct-wishlist-button-archive {
	display: none !important;
.logged-in .ct-header-wishlist,
.logged-in .ct-wishlist-button-single,
.logged-in .ct-wishlist-button-archive {
	display: flex !important;

How to customize Blocksy cart and checkout page?

This piece of CSS will add a dashed border and background to your cart and order totals section. See the screenshot.

How to customize Blocksy cart and checkout page?
/* Blocksy cart and checkout */
.ct-order-review, .cart_totals  {
	background: #fcfcfc;
	border: 2px dashed #ebebeb;
.payment_methods>li:not(.woocommerce-notice) {
  background: #ffffff;
	border: 1px solid #ebebeb;
#order_review table.shop_table tr>*:first-child {
    width: 45%;
.shop_table.cart.woocommerce-cart-form__contents th {
	border-bottom: 1px solid #ddd;
.shop_table td.actions {
	border-top: 1px solid #ddd;
tr.woocommerce-cart-form__cart-item.cart_item {
	border-top: 1px solid #ddd;
/* Thank you page */
@media (min-width: 690px) {
ul.order_details {
    background: #ffffff;
    border: 1px dashed silver;
    padding: 40px;
	margin-bottom: 2em;

Other useful Blocksy related tips

Here are some of my favorite WordPress tools

Thanks for reading this article! I hope it's been useful as you work on your own websites and e-commerce sites. I wanted to share some tools I use as a WordPress developer, and I think you'll find them helpful too.

Just so you know, these are affiliate links. If you decide to use any of them, I'll earn a commission. This helps me create tutorials and YouTube videos. But honestly, I genuinely use and recommend these tools to my friends and family as well. Your support keeps me creating content that benefits everyone.

Themes: Over the past few years, I've consistently relied on two primary themes for all sorts of projects: the Blocksy theme and the Kadence Theme. If you explore this website and my YouTube channel, you'll come across numerous tutorials that delve into these themes. If you're interested in obtaining a 10% discount for both of these themes, then:

Code Snippets Manager: WPCodeBox allows you to add code snippets to your site. Not only that, but it also provides you with the capability to construct and oversee your WordPress Code Snippets library right in the cloud. You can grab it with the 20% discount here (SAVE 20% Coupon: WPSH20).

Contact forms: There are hundreds of contact forms out there but Fluent Forms is the one I like the most. If you need a 20% discount then use this link (save 20% coupon is WPSH20).

Gutenberg add-ons: If I need a good Gutenberg blocks add-on then Kadence Blocks is the one I have used the most. You’ll get a 10% discount with the coupon SIMPLEHACKS here.

Website migration: While building a website you probably need a good plugin that can help you with the migration, backups, restoration, and staging sites. Well, WpVivid is the one I have used for the last couple of years. If you use this link along with the WPSH20 coupon you’ll get a 20% discount.

Woocommerce extensions: There are a bunch of Woocommerce extensions that I really like but the one that stands really out is Advanced Dynamic Pricing. Once again, you’ll get a 20% discount if you use this link here (save 20% coupon is WPSH20)

Web Hosting: If you would like to have a really fast and easy-to-use managed cloud hosting, then I recommend Verpex Hosting (see my review here). Btw, this site is hosted in Verpex.)

To see all my most up-to-date recommendations, check out this resource that I made for you!

Do you want to thank me and buy me a beer?

Every donation is entirely welcome but NEVER required. Enjoy my work for free but if you would like to thank me and buy me a beer or two then you can use this form here below.

Donation Form (#2)

Best selling plugins

Janek T.
Janek T.

I am a Wordpress enthusiast who has been making websites since 2011. In this site I am offering simple to follow tips on how to use Wordpress and Woocommerce.
If you want to be the first to be notified about the new tutorials then please subscribe to my Youtube channel here
Follow me in Twitter here

Articles: 102