Di Blocks – Awesome WordPress Blocks for Gutenberg Editor

Beskrywing

Di Blocks is specially designed for new WordPress editor also knows as Gutenberg editor. It allows bloggers, professionals, or businesses to design their own creative blocks using Gutenberg Editor.

It allows you to add regular blocks with more advance controls. You can apply possible styles to any block like heading, paragraph etc. Di Blocks is very flexible to use & it’s designed by DiThemes. The main aim of Di Blocks is to provide customization with ease. You can create a perfect WordPress web page using it. You don’t need any hectic coding knowledge to use this plugin. It’s just a one-click insertion.

Di Blocks plugin allows you to add animations, insert 440+ cool icons, and design the heading of your page in your own way. Di Blocks provide greater user control over the page-designing process blocks for Gutenberg Editor beyond what the theme can offer.

Di Block plugin is a useful tool that has all these features and more for WordPress Gutenberg editor. So if you don’t want your content to get lost and if you’re looking for adding some cool animation tricks or visual effects to your content or blog this Di Blocks is best fit for you.

Another important aspect of this Gutenberg blocks is that it also provides spacing options to give proper padding and margin to your content with zero impact on the CSS code. Therefore, Di Block plugin seems to be an integral addition to the overwhelming library of plugins in the WordPress library.

List of Blocks added by Di Blocks plugin

Heading Block

Heading is the most important part of any web page. It must look attractive to attain the impression of a visitor. Di Blocks helps you to customize the design of heading in a very attractive way. You can set the color of heading text; also it allows you to use many types of animation like fade-in or fade-out.

  • Heading Block
    • Heading Block Content Tag
      • Heading Tag
    • Heading Block Color
      • Heading Color
      • Heading Background Color
      • Heading Links Color
      • Heading Links Hover Color
    • Heading Block Typography
      • Font Family of heading
      • Font Weight of heading
      • Font Subset of heading
      • Font Size of heading
      • Line Height of heading
      • Letter Spacing of heading
      • Text Transform of heading
    • Heading Block Spacing
      • Heading Block Padding
        • Padding Top
        • Padding Right
        • Padding Bottom
        • Padding Left
      • Heading Block Margin
        • Margin Top
        • Margin Right
        • Margin Bottom
        • Margin Left
    • Heading Block Border
      • Heading Block Border Radius
      • Heading Block Border Style
      • Heading Block Border Width
      • Heading Block Border Color
    • Heading Block Motion Effect
      • Heading Block Animation

Icon Block

As we said, you can use 440+ cool icons where you want without any hassle. Generally, people are not able to find desired icons due to limitations but in Di Blocks, we have 440+ daily used icons which help you out from the situation.

  • Icon Block
    • Icon Block Contents
      • Icons list to select
      • Icon Size
      • Icon Rotate
    • Icon Block Colors
      • Icon Block Color
      • Icon Block Background Color
    • Icon Block Spacing
      • Icon Block Padding
        • Padding Top
        • Padding Right
        • Padding Bottom
        • Padding Left
      • Icon Block Margin
        • Margin Top
        • Margin Right
        • Margin Bottom
        • Margin Left
    • Icon Block Border
      • Icon Block Border Radius
      • Icon Block Border Style
      • Icon Block Border Width
      • Icon Block Border Color
    • Icon Block Motion Effect
      • Icon Block Animation

Paragraph Block

An effective paragraph is usually designed in a very appropriate way. It must look beautiful so readers can be engaged with it. Di Blocks typography feature helps you to design beautiful paragraphs. You can use different types of fonts, transform text to upper case, and set line spacing. Paragraph blocks also allow you to use animation effects to apply to paragraphs.

  • Heading Block
    • Paragraph Drop Cap
      • Enable / Disable Drop Cap
      • Drop Cap Size
      • Drop Cap Gap
      • Drop Cap Color
    • Paragraph Block Color
      • Paragraph Color
      • Paragraph Background Color
      • Paragraph Links Color
      • Paragraph Links Hover Color
    • Paragraph Block Typography
      • Font Family of heading
      • Font Weight of heading
      • Font Subset of heading
      • Font Size of heading
      • Line Height of heading
      • Letter Spacing of heading
      • Text Transform of heading
    • Paragraph Block Spacing
      • Paragraph Block Padding
        • Padding Top
        • Padding Right
        • Padding Bottom
        • Padding Left
      • Paragraph Block Margin
        • Margin Top
        • Margin Right
        • Margin Bottom
        • Margin Left
    • Paragraph Block Border
      • Paragraph Block Border Radius
      • Paragraph Block Border Style
      • Paragraph Block Border Width
      • Paragraph Block Border Color
    • Paragraph Block Motion Effect
      • Paragraph Block Animation

Google Map Block

It is the unique feature of Di Blocks, which makes it different from other Gutenberg blocks plugins.
We know how much your physical store matters to you. We consider this and give you space to embed Google map on your web page. Moreover, you can change its frame size, add padding and margin according to your design, and add animations.

  • Google Map Block
    • Google Map Block Contents
      • Google Map Location
    • Google Map Block Style
      • Google Map View
      • Google Map Height
      • Google Map Zoom Level
    • Google Map Block Spacing
      • Google Map Block Padding
        • Padding Top
        • Padding Right
        • Padding Bottom
        • Padding Left
      • Google Map Block Margin
        • Margin Top
        • Margin Right
        • Margin Bottom
        • Margin Left
    • Google Map Block Motion Effect
      • Google Map Block Animation

More awesome blocks are coming soon….

Screenshots

  • Blocks
  • Heading Block

Blokke

This plugin provides 5 blocks.

di-blocks/blocks
Di Blocks - Awesome WordPress Blocks for Gutenberg Editor
di-blocks/headline
Heading
di-blocks/google-map
Google Map
di-blocks/icon
Icon
di-blocks/paragraph
Paragraph

Installation

Traditional Installation

  1. Go to: Plugin > Add New menu.
  2. Here, search for ‘Di Blocks’
  3. Now click on ‘Install’ and then ‘Activate’

Manual Installation

  1. Download plugin zip file from : https://wordpress.org/plugins/di-blocks/
  2. Open Dashboard of your WordPress website.
  3. Open: Plugins > Add New > Upload Plugin > Browse… (select downloaded zip file) > Install Now
  4. Now simply activate plugin.

Kwel-vrae

Where can i find blocks

  1. Open edit screen of a page or post.
  2. Click on (+) add new block icon.
  3. Click on Di Blocks category.
  4. Click on needed block.

I need support

Please create support topic Here

Aanbevelings

There are no reviews for this plugin.

Contributors & Developers

“Di Blocks – Awesome WordPress Blocks for Gutenberg Editor” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.0.3

  • Added: Border to heading block
  • New: Paragraph block

1.0.2

  • Fixed: Class prefix

1.0.1

  • Fixed: Enqueue styles instead direct tag
  • Fixed: Readme file issues

1.0.0

  • 14 June, 2020
  • First Release