Introducing BlockArt – New WordPress Gutenberg Custom Blocks Plugin Free

Introducing BlockArt Gutenberg Blocks Plugin

The BlockArt plugin is a Gutenberg custom block plugin. Packed with features, this plugin gives a smooth website building experience. 

Whether you’re a beginner or an experienced user, the BlockArt plugin offers a variety of tools and templates to make web pages for your site. Therefore, you can bring your imagination into reality with these tools. 

Moreover, BlockArt provides six different blocks with complete control to customize them. Further, it provides pre-built templates if you don’t want to create a page from scratch. Convenient, isn’t it? 

So, without further ado, let’s explore BlockArt. 

What is BlockArt?

Gutenberg is the default block editor provided by the WordPress Core Team. This feature was introduced with WordPress 5.0 version in 2018. In simple terms, Gutenberg offers various blocks such as Heading, Image, Paragraph, Video, Gallery, etc. to create a page/post. 

However, even Gutenberg has some limitations. Hence, custom Gutenberg WordPress block plugins are available in the market to overcome these shortcomings. Some of the custom block plugins are Genesis Block, Kadence Blocks, Ultimate Blocks, and more. And BlockArt is one such plugin. 

BlockArt BlockArt WordPress Plugin

This Gutenberg plugin has 3000+ active installations as of today. The plugin has also been tested up to the latest WordPress version. Along with that, it’s compatible with PHP version 7.0 or higher. And, it’s regularly updated. 


Key Features BlockArt Has to Offer

BlockArt has the following features to offer. So, let’s discuss each of them briefly:

Optimized for Speed:

The BlockArt plugin is lightweight hence loads faster. Apart from that, the plugin reduces page size by limiting markups. Did you know that it only loads used CSS and Google fonts on the page? 

To add more, it’s fully compatible with the caching plugins; hence, you don’t have to worry about the BlockArt plugin making your site slow. 

Pre-built Templates:

BlockArt provides many unique blocks and allows full customization. However, it also comes with pre-built templates created by professional UI/UX designers. Furthermore, you can import any sections/pages from any starter packs with just a click.

Also, the contents are customizable according to your liking. For a better experience, related templates are listed on the settings while editing blocks. Above all, you can see all the changes you make with the help of a live editing feature. 

Copy and Paste Style:

If you like the style of some blocks you created and want the same style in other places, then the BlockArt plugin provides that option as well. Simply click on the toolbar and select the Copy option. Next, paste it into your desired place. 

Copy Block Style

Responsive Editing:

All the blocks are highly responsive. Meaning the added blocks will look good on all the devices such as mobiles, tablets, iPad, desktops, and more. Editing tools help easily control the font size, line height, margin, padding, alignment, etc., of a block. 

Dashboard Widget Area and Customizer Widget Editor:

You can effortlessly use BlockArt blocks in the sidebar as well. To add more, it works perfectly, just like a page builder. Hence, you can create a beautiful page with just a few tweaks. 

BlockArt Widget

Blocks Offered by BlockArt

If you’re wondering what kinds of blocks does the BlockArt plugin offers, we’ve mentioned them below. Moreover, we’ve mentioned what makes them different from the Gutenberg blocks as well. 

  1. Section: Add rows and columns inside the section to create different and unique layouts. 
  2. Heading: Add different headings to your page from H1 to H6. Separating headings can make your page or post look aesthetic. Not to mention, it helps your page/post to rank higher on the search engine. 
  3. Paragraph: With this block, you can add a paragraph and customize its typography, size, weight, line height, and more. 
  4. Button: Create buttons to redirect your users to important pages. 
  5. Spacing: Add spaces between blocks to make your page. 
  6. Image: Make your post or page more interactive and visually appealing with the help of the image block.

Use BlockArt to Create WordPress Pages/Posts

Above, we mentioned the blocks offered by the BlockArt plugin. Now we’ll use these blocks to create a WordPress website page or a post. 

Step 1: Install and Activate BlockArt

BlockArt comes in-built with Zakra – a popular multipurpose theme. Hence, if you install Zakra, you don’t need to install BlockArt separately. However, BlockArt is a free, independent plugin so that you can install it individually from the dashboard as well. 

To start the installation process, log into your WordPress dashboard. Now go to Plugins >> Add New menu from the sidebar. 

Click on Add New Plugins

Search BlockArt on the search bar; once it appears on the search result, click on the Install button. Lastly, Activate the plugin. 

Install and Activate BlockArt Plugin

Step 2: Getting Started With BlockArt

After the plugin activation, it’s time to set it up. A Welcome to BlockArt message will appear. You can either View Documentation to understand the plugin better or start to Create Your First Page.

Other than that, you can also Contact the support team if you come across any trouble. 

This tutorial is to create a WordPress page using BlockArt hence, let’s focus on that. After you click on the Create Your First Page button, it takes you to the page editor. 

Welcome to BlockArt

Step 3: Create Post/Page with BlockArt blocks

On the page editor, first, add a Title. Then, click on the Plus + icon located at the top left. 

BlockArt Blocks

You can notice all the six blocks that BlockArt provides.

Add Section and Columns

When you select the Section block, you can choose different layouts. Either leave the section as it is or you can add columns inside the section. You can add up to 4 columns inside one section. 

Add BlockArt Section

Add General Blocks Inside Columns

If you decided to add a section then you can add other remaining blocks ( Heading, Paragraph, Button, Image, Spacing) to it. Further, if you add two columns, then you can add two blocks to those columns. Likewise, four columns accommodate four different or the same blocks. 

Add BlockArt Columns

To add blocks inside a column, click the Plus + icon. Now, on the search bar, type BlockArt. All the blocks provided by the BlockArt plugin will appear. Simply select the block of your choice. 

Configure Sections, Columns, and General Blocks Settings

After you add blocks; it’s time to configure block settings. BlockArt plugin is unique from others because it provides hassle-free settings options. 

When you select a block, you can see the settings option on the left sidebar. BlockArt plugin offers separate setting options for separate blocks. We’ll list them below. 

Heading Block

Settings:

GeneralIn the General setting option, you can change the alignment and size of the text. Further, you can select HTML markup from H1 to H6. 
TextAdjust the font family, size, weight, and line-height from this option. It also provides the advanced typography option. 
SpacingAdd a margin to the top, bottom, left, or right. 
ColorThis option allows you to add color to your text. Further, you can also add a background color or an image. 
BorderFrom this setting option, adjust the border type and radius. You can add different border-radius to the top, bottom, left, and right. Moreover, it also allows you to enable box-shadow. 
Heading Settings Option

Advanced:

Advanced Add block margin and padding as per your liking. The Z-index option is also available if you want to overlap two blocks. 
ResponsiveThree different options are available – Hide on Desktop, Tablet, and Mobile. If you enable one of the options, that block will not be shown on that device. If you know to code, you can also add CSS ID. 
Additional CSS ClassesIf you know how to code, you can add additional CSS class(es) from here. 
Heading Advanced Option

Image Block 

Settings

General You can add the Alignment, URL, and Alt Text. Besides, you can add an image from your local computer or add an external image.  
ImageAlter the width, max-width, height, object-fit, and opacity of the image.  
BorderAdd the type, adjust the radius, and you can also enable the box-shadow. 
Image Settings Option

Button Block

Settings:

GeneralYou can add the URL link here. Also, you can also open the link in a new tab. 
LayoutModify the size, alignment, and type of the button. 
IconsOnce you enable the icons options, various icons will appear. You can also search the icons and place them on either left or side of the button. Moreover, you can adjust the size and gap as well. 
TextChange the font family, size, weight, and line-height. An advanced typography option is also available. 
Color Add color of your choice. You can also add a background image or a background color. Apart from that, you can also include a hover color. 
BorderFrom here, you can add border type, radius, and enable box-shadow to your button. 
Button Settings Option

Paragraph Block:

Settings: 

GeneralAdjust the alignment of the paragraph. 
TextAdd the font family, size, weight, line height, and advanced typography. 
SpacingSet the margin of the paragraph. 
ColorAdd the color, background color, and image. You can also add hover color. 
Paragraph Settings Option

Spacing Block:

Settings: 

General Specify the height of the block. 
ColorAdd color, Background Color, and Image. Moreover, hover color can be added as well. 
BorderYou can add the normal or hover type, radius, and box-shadow. 
Spacing Settings Option

If you’re wondering about the Advanced Settings, it’s the same for all the blocks. Hence, go through the Heading Blocks’ Advanced Settings. 


Step 4: Add Inbuilt Templates to Your Site

Besides unique blocks and setting options, this plugin also offers inbuilt templates. Besides, you can easily import them and add them to your page/post. 

To add the templates, navigate to the Pages menu. Hover over to the page of your choice and select the Edit option. 

At the top, you can see the BlockArt Library button; click on it. A pop-up appears from where you can import  Sections, Starter Packs, and Templates

BlockArt Library

Further, these templates provide many options you can choose from as discussed below. 

Sections: Banner, CTA, Contact, Content, Countdown, Feature, Testimonial, Team, Service, Project, Pricing, Other, and Gallery. 

BlockArt Section

Starter Packs: It offers categories like Business and Non-Profit. Simply put, it’s a collection template with the help of which you can create a complete site such as Agencies, Freelancer, etc. 

BlockArt Starter Packs

Templates: Templates help you to create a stunning website page like a Landing page, About, Contact, Service. 

BlockArt Templates

You can easily import these Sections, Starter Packs, and Templates. All you need to do is hover over to the templates of your choice and click on the Import options. 

Import BlockArt Templates

Furthermore, you can add blocks inside the templates and configure the settings as well. 

Simply click on the Add Block option and add any BlockArt blocks. 

Add BlockArt Blocks

Once you’re satisfied, select the Publish button located at the top right of the page. 


Import Demo With Zakra and BlockArt

For your convenience, the developer team of the Zakra theme has created demos using the BlockArt plugin. Simply import these demos, do a little customization and your site will be ready in a few hours.

To explore the demos, visit the official page of the Zakra theme. Then select the Demos option from the top menu bar.

Zakra Demo

This takes you to the demo page. Zakra offers more than 80 ready-to-import demos.

To inquire about the demos created using Zakra and BlockArt, from the Page Builder drop-down menu select the Gutenberg option.

Zakra Gutenberg Demos

If you wish to import these demos, check out this article on – how to import WordPress theme demo content.


Wrapping It Up!

And that’s all about the BlockArt plugin. With the blocks and templates offered by this plugin, we’re pretty sure you’ll create a page/post within an hour or so.  

If you run into any sort of problem, then you can always reach out to their support team. They’ll get back to you as soon as possible. So, go ahead and install the BlockArt plugin today. 

Please share this article on your social media platforms if you found this article helpful. Also, follow us on Twitter and Facebook to get regular updates and exciting news. 

Disclaimer: Some of the links in the post may be affiliate links. So if you purchase anything using the link, we will earn affiliate commission.

Priyanka Panjiyar

An enthusiastic Technical Writer and a Blogger. She spends her free time painting, watching movies and series, and listening to music. You can also connect with her on Twitter @Priyanka9502 and LinkedIn @priyanka panjiyar

Leave a Reply

Your email address will not be published.

Scroll to top

Pin It on Pinterest