Source Class of Output

Through the Source Tab, you can enable the ClassOutput functionality, this allows to apply the following effects:

  • SVG ImageMask;
  • FE_filterEffects;
  • SVG Distortion;

to any other widget on the page. In order to do this, you need to ascribe the class indicated in the options panel on Elementor.

NB: Source can be used with static trigger, not with animation, rollover or scroll.

SVG Imagemask

SVG FE_

SVG Distortion

How to apply the Class

Write in the CSS Classes field of the Advanced Tab - the one with the gear icon - the name of the output class indicated by the SVG Source widget.


This feature guarantees nice results with the following Elementor basic widgets:

  1. Image;
  2. Heading;
  3. Icon;
  4. Button.

This is a DEMO showing the widgets.


Compatibility

  • Chrome: Partially
  • Firefox: OK
  • Safari: Partially
  • Edge: Partially
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us