This lesson shares a theme often used when building cross-border independent websites: Blocksy.

Blocksy theme features:

Let’s first go to the theme’s official website and take a look at some of its features. First of all, Blocksy is a very fast theme, similar to what we used before this theme provides a free version, which is one of the reasons why this theme is used by so many people.

Blocksy speed performance:

Of course, what we are going to show you here is the free version and the PRO version. Let’s take a look at its features. Its biggest feature is its fast speed. We can see that if you install this theme, the official instructions are that if you use Google’s speed testing tool can basically reach more than 95%, and the testing speed of other testing tools is also very fast.

1 Blocksy theme dyno data

Compatible with mainstream builders:

In addition, we see its main features: the first is fast, the second is compatibility with Gutenberg and code separation. It is also compatible with this multi-language module, and the code is relatively neat. In addition, this theme is It is compatible with 4 types of page construction that we often use, such as our Gutenberg, Brizy, Elementor including Beaver Builder, which are all compatible.

1 Blocksy theme compatible with multiple page builders

Then we can see its layout, its header, and the bottom sidebar can be set, and it provides us with many header layouts. Of course, this must be installed with the PRO version to use it. Then we see Its color, background color, and fonts can all be modified, including our product list and article list. In addition, it is compatible with Gutenberg, so Gutenberg is a page builder often used in new versions of WordPress. , but we are usually accustomed to using Elementor, so we ignore such an ancient castle page builder.

3 wordpress default gutenberg page editor

If we go to create a new article, and now enter this page, it is Gutenberg, so Gutenberg is the same, it is official and it has modularized these modules by default. For example, if we insert a paragraph or insert a picture, it will There are specific modules, but this module is relatively simple. Based on this, blocksy has made some visual drag-and-drop modules, so it will be more convenient for you to edit. In addition, it also provides a lot of themes, including woocommerce compatibility, woocommerce integration, and some frequently used marketing plug-ins. Then we can also preview its demo.

Blocksy demo style:

Now we open one of the toc sites, and we see that the response speed of the entire site is very fast. Then when we open one of the products, we see that the overall speed is very fast, and our product details page should have All are available. If not, you can also install some compatibility plug-ins. There is no problem with these.

4 Blocksy theme demo template

So this theme has been prepared for you. Of course, what we have prepared for you here is its PRO version. The PRO version is a plug-in. Because we just told you about this theme, it has a free version, so you need to Install the free version of blocksy first and then install the PRO plug-in to activate the commercial version.

Blocksy theme installation:

First, we enter our backend, then find the theme installation, and then we click to install a new theme. Here we do not upload the theme directly, but find Blocksy among some popular themes provided by WordPress. Of course, you can also directly Go to search, because Blocksy itself ranks relatively high, so we can see it at this location.

5 Blocksy theme search installation

But you can also search for it directly if you search for it. For example, if we search for Blocksy, what we see now is this theme. We need to install the free theme first, activate the theme after the installation is successful, and then activate it successfully. Of course, Now we can use this theme.

6 Blocksy theme installation and configuration plugin

But this theme is a free version, so there will be a reminder on it, which advises you to install its PRO version, so here we need to install its PRO plug-in so that you can see it on the left Theme setting items can also add the functions we just browsed on its homepage, such as the setting drag and drop module on its header, etc. These require the PRO version to be activated, so we install the plug-in, and then Click Install and select the plug-in we have prepared. Here we will directly install the PRO plug-in and click to open the installation.

After the plug-in is installed successfully, we will activate it. Fortunately, there is no above prompt now, and he took us directly to We can take a look at the Blocksy settings interface. First of all, there will be a lot of settings here. The settings here are not placed in the background but in our customization.

7 Blocksy theme settings interface

If we want to modify the color of our site, the first one here is the document, and the second one is click settings. For example, our new window opens, and then we can see it in our customization.

8 Blocksy theme customization settings

 

Blocksy theme settings:

It is our global settings, such as our basic settings, including our head area, so here you can drag and drop, or you can add modules. In addition, you can also target our tablets or our mobile phones. terminal, and then set up its module, then there are some other settings, including our bottom Sidebar, color font, performance settings, our blog page configuration page, etc. We will talk about this later. , we turn it off first, then the other settings are the same. If you click on any option, you will enter the settings we just saw, which can be used for our color, font, header and bottom, blog page, post, pages, and Sidebar can all be modified.

Then you can also see on the right that it has video tutorials and knowledge documents.

9 Blocksy theme template import interface

Then the second thing we see is its template import. Here it also provides a lot of templates. So we should pay attention to these templates. Some of them are built directly using Gutenberg pages, and some of them are compatible with Elementor. , so it depends on your own needs. If you are used to using Elementor, then you should choose those theme templates that are compatible with Elementor and import them.

10 Blocksy Theme

Blocksy theme premium extension:

Then the third one is its extension module. In order not to affect the speed, the extension module is not turned on directly. If we need it, we can turn it off. For example, the first one is our cookie, When a user opens our site, there will be a cookie reminder, that is, the customer can click to agree to obtain his information, such as his browser information, his IP address, etc.

Then the second one is the newsletter. Of course, this newsletter must be borrowed from a third party. For example, we can use Chimpanzee or some other newsletters. When we use it, we will explain it to you, including our product evaluation, The product evaluation is not the default rating in our products, but through this module, you can add an affiliate marketing module to our independent station. Here you can target a product and list its performance, and then You can add a link at the end. This link can be imported to Amazon’s alliance, or an alliance of Alibaba International Station, and then guide users to enter other products and then make purchases.

Blocksy must-have plugin:

Then the other thing is that its popular posts are also a module, including some other extensions below. Of course, these are all for the PRO version, including some extensions from our store, including our product extensions, as well as local fonts and customizations. Fonts or Adobe fonts, including super menus, etc., we will explain it to you later when we use it. It is actually an extension. Each of the extensions here requires you to install some plug-ins if you use other themes. , if its theme does not have it, then this theme is equivalent to integrating it into this module. Then when you need to use these modules, you just need to turn it on.

11 Blocksy Theme Recommendation Plugin

In addition, there are some recommended plug-ins. For example, the first one we saw was a Gutenberg extension plug-in. If the theme you import is using Gutenberg, then you can use Gutenberg’s extension plug-in. There are some others, for example, we saw the Elementor page builder, our translation module, etc., including our forms. These modules have commercial versions on our learning grid, and you can download them directly. In addition, Just take a look at its update log.

Blocksy theme style import demo:

Next, we will directly import a template style. For example, the demo site we just saw is a toc site. If you are building a toc site, you can import this template, but this template uses the ancient castle, so if you are used to using Elementor, just find an Elementor template and import it.

For example, if we see such a template now, we can preview it first. After opening it, we can see that this is a standard toc site. There are also products in it, and then we can open the products to take a look. The interface is also very beautiful. If this theme can meet your needs, then you can just import it directly.

12 Blocksy theme selection import template style

It is also compatible with Elementor, and then we click import. Here he recommends that we install its sub-theme, mainly based on your own needs. If you need to add some code to your theme later, our final It is best to install a sub-theme, so here we install it by default, then click next, and then we can choose its page builder. The first one is Gutenberg. In fact, this theme is compatible with Gutenberg. The speed is the fastest.

13 Blocksy theme support page builder

But it also depends on your habits. Just like what we usually suggest to you, we are not saying that we must pursue this speed, but that this theme first needs to meet our needs, and then based on this need, we can optimize the speed, rather than pursuing the ultimate speed.

Many novice independent websites will use some very simple themes, such as Astra Such a theme has very few functions in itself, and it cannot meet your needs, so you still have to install a lot of plug-ins later, which does not improve your speed at all. So everyone must pay attention here, that is when we choose a theme or page builder, the first one must meet the needs, and the second one must be convenient. It is not too complicated for you to use, otherwise, you still need to install a lot of plug-ins, and modifying a lot of code is no different from writing a theme template ourselves, so don’t be obsessed with technology, but first meet our needs.

There are many ways to improve the speed of independent stations, and no matter how complex the subject is, we can optimize it very fast even for the largest avatar, so we have to consider how fast the speed behind it is. , but to meet your needs first.

For example, we are often accustomed to using Elementor. We will choose Elementor here. Of course, the use of Gutenberg is the same. Later, we will continue to update some of Gutenberg’s extension plug-ins. Its applications are similar. Yes, it just doesn’t have Elementor. It is currently used frequently because Elementor has a lot of extension plug-ins. For example, we shared six or seven of them with you when we learned about Modern Network. These extension plug-ins can allow your independent station to achieve anything. The function you want, so this is what we want most.

So here we still use Elementor, and then click next, and then he needs us to install three default plug-ins. The first is our form, the second is the free version of Elementor, and the third physical control door we have already installed Okay, so we click to let him install the plug-in and click to install.

14 Blocksy theme essential plugin installation

After the import is successful, we can now refresh our site. We see that the entire site has been imported, but we see that there is a problem with the position of the top slide, and then we open one of them. Products and products are normal, then we can edit the homepage when the time comes, including our Shop page. The biggest advantage of the entire page is its speed, because we have very few plug-ins installed now, and this theme Its main focus is fast speed, which is also normal for its blog page. This is about the installation and data import of the Blocksy theme. In the next lesson, we will explain its settings to you.