Image Comparison Block

This block compare between two images in your web page.

Add Image Comparison Block: #

In your Gutenberg editor, find the Image Comparison Block and insert, just like others block.

Settings/Options: #

Sidebar Settings: #

Select the block, you will see the settings option in the right sidebar. There are the settings.

Comparison/Main Settings: #

This is your main settings, in this settings, you can change comparison width, border.

You can Upload Before After Image from here. There are another way to upload Images, that is in editor itself.

Also, you can swap images before to after, after to before.

Labels Settings: #

In labels settings, you can show/hide labels, change typography, colors(text and background) and padding.

To change labels text, you can change it from editor.

Caption Settings: #

In captions settings, you can show/hide caption, change typography, colors(text and background) and padding.

To change caption text, you can change it from editor.