Beaf – Photo Comparison Block


Beaf is a custom Gutenberg Block based plugin that is developed with Gutenberg Native Components. You can easily showcase the Photo Comparison. It comes with different styles and settings so that you can easily customize it as per your needs. It is a lite version of Beaf Pro. To get more features and options, you can check the Beaf Pro.


Key Features

  • Simple, light-weight, and super-fast
  • Built with only Gutenberg Native Components
  • No Block Builder at all
  • 100% Responsive
  • Horizontal & Vertical View
  • Images Comparison Options
    • Before & After Label
    • Comparison start on Hover
    • Horizontal & Vertical Comparison
  • Easy to Use in Gutenberg Editor
  • Drag & Drop Use
  • No jQuery dependency

Beaf Pro features

  • 3 Content Types (Image, Video, Iframe – Google Map)
  • Custom Label Styles
  • Custom Label Position
  • Custom Label Typography
  • Labels Animation Options
  • Custom Comparison Starting Point
  • Custom Comparison Line
  • Custom Comparison Line Color
  • Custom Comparison Line Thickness
  • Custom Caption for beaf slider

Beaf Pro is a premium version of Beaf. You can get more features and options in Beaf Pro. Get Beaf Pro



This plugin provides 1 block.

  • Photo Comparison Showcase Images Comparision with different styles


This section describes how to install the plugin and get it working.


  1. Upload the plugin files to the /wp-content/plugins/image-compare-block directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress
  3. Simply go to Gutenberg Block Editor and you will find a new block at Media Category named “Image Compare”
  4. Drag and drop to use it.


What is Beaf Slider?

Beaf slider means Before and After Slider. It is a slider that showcases the before and after comparison between two images, videos, or iframes.

What is Beaf Pro?

Beaf Pro is a premium version of Beaf. You can get more features and options in Beaf Pro. Get Beaf Pro

How to upgrade to Beaf Pro?

Beaf Pro is the premium version of Beaf and it comes with a complete set of features and options. It is completely a separate plugin. You can simply deactivate the Beaf and install Beaf Pro. Then, you can start using it.

Is it compatible with the latest WordPress version?

Yes, it is compatible with the latest WordPress version.

Is it responsive?

Sure, it is 100% Responsive

Have you used any block builder?

No, it is built with 100% Gutenberg Native Components only.

How can I use it?

Please follow the video tutorial to see the uses of it.


February 13, 2024 6 replies
…the plugin always shows a message on every page in the dashboard asking for consent to some data colelction. I dont want it and I apreciate that you probably dont just take it anyway. But I dont’t like that I can’t say no. I can skip the message and in the next milisecond it will eppear right away again. … maybe consider fixing this. its annoying!I will definitly change this review once its fixed!
January 8, 2024 2 replies
Basic block settings, that just work.I tried another plugin first that had way more options, but lagged very badly on iPhone.After adding this block (into columns) I can’t select it again to edit by clicking on it directly, just via the block list. Clicking it directly just moves the split bar. That should be fixed.(Mac, Safari, WP 6.4.2, Gutenberg)
June 19, 2022
It works perfectly, and has lots of customization options. I am really surprised that it is not more popular. Works perfectly in Gutenberg without any issues. I hope the developer keeps actively updating this plugin because it is perfect
November 22, 2021
This plugin does one thing and it does it better than all the rest! I tried the image compare block included with Jetpack and it caused CLS (Cumulative Layout Shift) Issues on my page. I tried Two other plugins offering image comparison blocks with the same issue. This one just works! Also allows you to change the images once you add the block which the Jetpack block did not. Hope the developer keeps it updated and it becomes the go to image comparison widget!
Read all 4 reviews

Contributors & Developers

“Beaf – Photo Comparison Block” is open source software. The following people have contributed to this plugin.


“Beaf – Photo Comparison Block” has been translated into 1 locale. Thank you to the translators for their contributions.

Translate “Beaf – Photo Comparison Block” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.



  • Beaf Pro is now available
  • Labels position issue fixed
  • Admin page updated

1.5.0 – Checking Compatibility with the Latest WordPress version
1.0.0 – Initial Release