• Products
  • Resources
  • Blog
  • Contact

How to use Transform Effects Extension by Zoloblocks

  • BdThemes
  • How to use Transform Effects Extension by Zoloblocks

Table Of Contents

How to use Transform Effects Extension by Zoloblocks

This documentation we will show you how to use the Transform Effects Extension provided by Zoloblocks.

Enable the Transform Effects Extension

Enable the Transform Effects Extension
  1. Go to the WP dashboard > Zoloblocks plugin Dashboard.
  2. Click on the Extension Tab.
  3. Search the Extension name inside the search field.
  4. Enable the Transform Effect Extension.
  5. Click on the “save changes” button.

Where You Find the Transform Effects Extension

Basic Design - BdThemes

To start with the feature, let’s first take an existing design inside the page. This is for a better understanding of the functions of this feature. Here we take the Advanced Icon Box block to desmonstrate the feature.

Where You Find the Transform Effects Extension
  1. Select the block > Advanced Tab.
  2. Navigate the Transform section.

Customize the Transform Effects Extension

Customize the Transform Effects Extension

After enabling the Transform switcher, the all customization options will appear. Here you will get two tabs sections; Normal and Hover. Lets customize the normal tab section.

Normal Tab Section

Translate - BdThemes

1. Translate: The Translate feature in the Transform Effects allows you to move an element along the X (horizontal) and Y (vertical) axes without affecting its original position in the layout.

Translate X: Moves the element left or right.

  • Positive values move it right.
  • Negative values move it left.

Translate Y: Moves the element up or down.

  • Positive values move it down.
  • Negative values move it up.
Rotate - BdThemes

2. Rotate: The Rotate feature in the Transform Effects allows you to spin or rotate an element around its center point or axis. Enter a positive or negative value to control the direction of rotation:

  • Positive values rotate the element clockwise.
  • Negative values rotate the element counterclockwise.

Rotate 3D: If you want then you also can enable the Rotate 3D switch to apply a 3D rotation effect, which adds depth and dimension to your design.

Scale - BdThemes

3. Scale: The Scale feature in the Transform Effects lets you resize an element by increasing or decreasing its overall size. Either horizontally, vertically, or both.

Scale X: Adjusts the element’s width.

  • Values greater than 1 make the element wider.
  • Values less than 1 make it narrower.

Scale Y: Adjusts the element’s height.

  • Values greater than 1 make the element taller.
  • Values less than 1 make it shorter.

Keep Proportions: The Keep Proportions switcher in the Scale feature allows you to maintain the element’s aspect ratio while resizing it. When this option is enabled, both the Scale X (width) and Scale Y (height) values stay linked.

Skew - BdThemes

4. Skew: The Skew feature in the Transform Effects allows you to slant or tilt an element along the X and Y axes.

Skew X: Tilts the element horizontally (left or right).

  • Positive values tilt it to the right.
  • Negative values tilt it to the left.

Skew Y: Tilts the element vertically (up or down).

  • Positive values tilt it downward.
  • Negative values tilt it upward.
Flip - BdThemes

5. Flip: The Flip feature in the Transform Effects allows you to mirror an element horizontally or vertically, creating a reversed or reflected version of it.

  • Flip Horizontal: Flips the element from left to right, creating a mirror image along the X-axis.
  • Flip Vertical: Flips the element from top to bottom, creating a mirror image along the Y-axis.

Hover Tab Section

Hover - BdThemes

Come to the Hover tab section, you will get the exact customization as like in the normal tab section. Please try it yourself following the previous instructions.

Video Assist

The video will come soon. Please visit the demo page for examples.

Thanks for being with us.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 14-days money-back guarantee.

Call or WhatsApp for assistance:+880 1700 55 95 95

Our supported payment system and security badge