Themes

Blocksy : Complete tutorial of this free & versatile WordPress theme

WordPress themes are real assets for your website to give it a personal and unique touch. There are hundreds of them today and to know which one is right for you, you have to try several. Different criteria come into play when choosing a theme and I would say that the main ones are: performance (e.g. page loading time), design, ease of use and features that allow you to run your website the way you want.

Today we’re going to focus on the WordPress theme Blocksy which has more than 30,000 active installations and very good reviews with a rating of 5/5. Blocksy is a lightweight, feature-rich and block-based WordPress theme with all the essential functionality you’ll need for your website. Whether you want to create a blog, launch an e-commerce store, design a landing page, or create websites for sales agencies and businesses, Blocksy can be the right solution. In this WordPress tutorial on Blocksy, we will look at some of its features so you can understand if it is right for your needs.

Table of Contents

0 blocksy
Is Blocksy for you?

Finding the best WordPress theme keeps many of us busy. And, there are many things to consider before choosing a theme for your site. No matter what you are looking for a theme for, it should be well coded, fast and easily customizable. Fortunately, Blocksy meets all these requirements and offers great features and functionality.

Blocksy uses… Gutenberg blocks

Not really surprising with how big Gutenberg is getting. Blocksy was designed with the Gutenberg editor which is described as the future of WordPress. This theme is going to give you a solid block editor experience with a block-based design. If you are a fan of Gutenberg, you will love it.

Ultra light and fast theme

The speed of your website matters a lot to your visitors and to your overall business. The speed of the site has a profound impact on your company’s revenue. The slower your site loads, the more your revenue decreases. Because Blocksy is so lightweight, it loads much faster on visitors’ browsers. Blocksy is one of the fastest WordPress themes available today.

Blocksy has a native loading system to speed up the loading of sites. It is ranked high in most speed testing tools like Pingdom and Gtmetrix. With your website built with Blocksy, you don’t need to optimize much to get the expected site speed.

Installation

For the installation just follow these steps: Appearances > Themes and search for Blocksy in the search bar.

1 installation
Once the theme is activated, you will see a notification in your dashboard prompting you to install and activate the Blocksy Companion plugin. While not necessary and useful for everyone, the plugin gives you access to several pre-built site templates as well as additional features such as RGPD cookie notification, Mailchimp integration, social network icons, popular post widgets, and more. So it’s probably worth downloading to take it a step further.

If you want to download the plugin, just click on the blue Install Plugin button. You can then import a pre-built site by going to the Starter Sites tab.

starter sites

You can preview each site and click on the Import button to import them to your site. Keep in mind that you will need to install a Page Builder plugin like Elementor or Brizy if you don’t want to use Gutenberg.

Once your chosen site has been installed, you can proceed to customize the design and modify the pages individually to meet your specific needs.

If you don’t want the Blocksy Companion plugin, you can click the X button to disable the notification and proceed with the theme.

I emphasize that the Blocksy theme dashboard lists some useful plugins (see screenshot below) that you can install on your site, but which are not necessary for the theme to work properly. However, they allow you to extend the functionality of the theme.

useful plugins

Once you get to the homepage, you will have an overview of all the shortcuts that will allow you to customize your Blocksy theme.

home

home 2
Customization options

Blocksy theme has no shortage of customization options. You can easily change colors, choose from hundreds of Google fonts, upload your own logo, adjust the spacing between site elements, etc.

Blocksy theme includes several predefined layout options for blog posts as well as for other pages of your site. You can also insert your Google Analytics code and links to your social media profiles into the standard WordPress Customizer itself.

In addition to the built-in customization options, you can also modify every element of your website when you start editing your pages with one of the supported page builder plugins. You can change the style settings for each individual element on the page as well as for each section. This really expands what you can do with this otherwise fairly simple theme.

As I mentioned above, the Blocksy theme supports Elementor, Brizi and Beaver Builder. If you’re already using one of these plugins, you can easily switch to the Blocksy theme and use it for your site.

If none of these page builders work for you, the Blocksy theme was designed with Gutenberg in mind and also supports all Gutenberg blocks. You can easily adjust block widths, use block templates, and create reusable blocks for later use when creating blog posts and page content for your site.

Colors

The colors can be modified according to your needs, whether it is the global colors, the text, the titles or the borders.

2 colors
At the top

You can have 3 rows for the header and footer. Each of these rows can have different sets of columns to place elements in.

You will find various elements to insert such as a logo that you have defined beforehand, buttons or icons for social networks. Everything is customizable from the typography to the colors and shapes.

3 in front
As you can see, you can manage the layout of your elements using drag and drop. This will save you a lot of time when you create a page on your website.

Blog

You will be able to define the blog structure among the proposed options (simple, classic, grid, improved grid), to add or remove columns and the number of publications on the same page.

4 blog
In the card options you will be able to define the card elements of the blog like the meta description, title or highlighted image for example.

4 blog (1)

In the design part, it is possible to adjust the font color of the title, excerpt, meta, map background and much more.

4 blog (2)
Pages

The page options are basic but effective; you will be able to manage the display of the content and its design, including the background of the page as well as the style of the content area and its vertical spacing.

5 pages

You can also enable/disable the highlighted image and comments.

Sidebar

As with the previous elements, you will be able to adjust the structure of the sidebar by choosing the display. You can also control the width of the bar, the outer margin and the vertical spacing of the widgets by setting the percentage with a slider gauge. Set the design type and colors directly here.

6 sidebar
Tags, sidebar visibility and position on mobile are also customizable

6 sidebar(1)
Footer

Blocksy footer offers several widget areas, an area for your social networks and footer menu. Everything is organized in three rows. You can also set its color in the Footers tab where you will find the color palette.

7 footer
Woocommerce options

When it comes to WooCommerce integration, the Blocksy theme has additional features to help you create an outstanding store. Your customers will be able to use the quick view feature to view the product and add it to their cart without having to navigate to the product page.

The theme also supports AJAX add to cart feature and several different product gallery layouts to present your products in a visually appealing way. These are features that many people expect from most online stores, so it’s a real advantage that Blocksy includes them here, especially when it comes to WooCommerce features. In other words, Blocksy allows you to create an online store as easily and directly as any other type of website.

Key features

Here are some of the key features that make Blocksy a very powerful theme. They are found consistently in its use.

  • Multiple layouts for archives and single pages: Blocksy comes with five types of modern, clean layouts that you can use for articles. You can easily set a different layout for a different list of articles (Categories, Authors, Search, etc.). The 5 archive layouts are Simple, Classic, Grid, Enhanced Grid and Gutenberg.
  • Colors and background: Blocksy offers several color palettes in the customizer. You can switch to any set you like. Moreover, you can customize the color of these sets as you wish. Blocksy also allows you to choose a global color for the base font color, link color, title color (H1 – H6) and text selection color.
  • SEO friendly code: Your site will be easy to find with built-in search engine optimization.
  • Sticky sidebars: This makes navigating your site easier and more intuitive for visitors.
  • Custom widgets for related items, trending items, etc: Add as many (or as few) as you like to better guide the site visitor’s browsing experience.
  • Multiple widget areas: Again, you can customize the layout of your site to have the features you prefer.
  • Built-in social media links: It’s easier to build a social network and a long-term following if you find ways to stay in touch with visitors even after they’ve bounced.
  • Advanced Typography: This advanced WordPress theme gives you the freedom to change the typography of every part of your website globally and locally. Also, it supports a wide variety of over 900 Google fonts.

Latest web technologies used by Blocksy

Blocksy uses proven and latest technologies to give you the best possible results. These are not things you see, but these technologies are the reasons why Blocksy is a high performing and fast loading WordPress theme.

The technologies Blocksy uses include:

  • React: Without a doubt, React is one of the most popular JavaScript libraries. React components have been used to create Blocksy options.
  • Webpack: The Webpack build pipeline provides a system for loading code only for the features you need, without slowing down your site.
  • Babel: Blocksy uses the latest Babel-enabled JS language features and helps them work well in all browsers.

Free or paid version

As you know, most WordPress themes and plugins offer both free and paid versions of their products. Blocksy is no exception to the rule and therefore offers a paid version.

Here are the prices so that you have an idea of the budget needed to exploit the full power of its features:

You can choose between an annual subscription or a lifetime subscription (purchase of a permanent license).

Personal: this subscription costs about 30€/year and can be used on one site only. If you choose the lifetime version, you will pay about 90€.

Professional: this subscription costs about 40€/year or about 120€ for the lifetime license and allows you to use it on 5 sites.

Agency: this plan costs about 59€/year or about 180€ for the lifetime version. With this license, you can install the pro version on an unlimited number of websites.

All subscriptions offer the same features. The only difference is the number of sites on which you can install the Pro version.

annual subscriptions

lifetime subscriptions

While Blocksy’s free features will meet most of your needs, here is a comparison of the free and pro versions. Some features are not negligible and can justify a financial investment!

9 free vs pro
10 free vs pro (1)

11 free vs pro (2)

12 free vs pro (3)
13 free vs pro (4)
14 free vs pro (5)
Pro Features

Before concluding we will see some pro features that I think may be interesting to explore:

Content Blocks (Hooks) (PRO)

Blocksy’s content blocks are great features for building your site. These blocks are basically hooks that you can place anywhere on your site, guided by visual cues. You can create these content blocks and place them conditionally. You can easily create custom 404 pages, headers and footers and place them in different places.

Advanced options for blogs

Blocksy offers a lot of options that are dedicated to blog sites. It is now undoubtedly one of the best WordPress themes for blogs. If you are planning to start blogging, you can choose Blocksy because of its advanced blogging-specific features.

  • Decide what elements to highlight on the single page and listing page of the blog.
  • Take care of the blog cards and add effects to them.
  • Present elegant widgets by selecting the blog posts of your choice.
  • Display related articles and trending articles at the bottom of the page.
  • Change the typography of the whole site, globally and locally.

White Label (PRO)

If you run an agency and are looking for a WordPress theme that represents your brand, Blocksy is scalable. You can replace the original brand with your own. You can customize everything from text to theme authors to screenshots.

Custom Code Snippets (PRO)

You no longer need a third party plugin to add custom code to your website. Apply globally the header and footer scripts (a part of CSS or JavaScript) to be loaded on each page. This is very useful for loading various libraries or analytics snippets. You can also add snippets at the article and page level.

Custom sidebars (PRO)

You can make your WordPress site pages unique by assigning different sidebars to each of them. Blocksy gives you the ability to create multiple sidebars with an intuitive interface from the same place you’re used to managing widgets.

Conclusion

Blocksy saves you from installing many additional WordPress plugins. Although you have a full theme installed on your WordPress site, you may need to install other plugins for some additional functionality on your site. Blocksy, in this case, makes an exception. Blocksy’s advanced WordPress theme customizer supports these kinds of extra features and saves you from installing additional plugins on your site.

If you have Blocksy theme, you don’t need any additional plugin for cookie consent, custom sidebar, updated post tag, social sharing, header and footer builder, and many more.

In terms of support, the team behind Blocksy is very regular in releasing updates. New features, options, performance improvements and bug fixes are released in almost every update. Day by day, Blocksy becomes richer and more advanced in its features and customization possibilities.

The only drawback is that it offers a relatively small number of “starter sites” compared to other similar themes. On top of that, not all starter sites are compatible with all page builders. This limits the number of options you have (rather 2 than 6).

Finally, I’d say that if you’re looking for a free, feature-packed theme with fast load times and a modern design that can be extended via a useful, feature-rich premium plugin, the Blocksy theme is definitely worth a look. And since it’s free, you won’t risk anything by trying it out!

 

See also  Twentig customizes the default WordPress theme Twenty Twenty
Back to top button