Grid Item Hover Effect

Table of Contents

This block lets you add a gorgeous hover effect to an image, revealing extra content when you hover over it.

Required Setup

  • Nexter Blocks FREE Plugin installed & activated.
  • You need to have the WDesignKit plugin installed and activated.
  • Make sure you’ve created an account and logged into it.
  • Make sure you’ve downloaded the Grid Item Hover Effect block.

How to Activate the Grid Item Hover Effect Block?

Go to 

  • WDesignKit Widgets. 
  • Search the block name and select Gutenberg as the Page Builder.
  • Click on the Download icon.

How to Use the Grid Item Hover Effect Block in WordPress?

Add the Grid Item Hover Effect block to the page.

Content

From the Effect Type dropdown, you have to select a pre-defined hover style.

In the Media section, you have to add an image.

Top Box

From this tab, you can adjust the top box content that will show on hover.

From the Position dropdown, you can position the top box to the left or right.

Then in the Title field, you can add a title in the top box.

You can add a description from the Description field.

Bottom Box

From this tab, you can adjust the bottom box content that will show on hover.

From the Position dropdown, you can position the bottom box to the left or right.

Then in the Title field, you can add a title.

You can add a description from the Description field.

From the Style tab, you can customize the style further.