The Annotation widget for Elementor enables you to create and animate hand-drawn style annotations on your website. With fully customizable options for style, animation duration, and delay, this widget offers a creative way to draw attention to key elements on your site while enhancing user interaction. Its intuitive design ensures you can achieve a professional look with minimal effort.
Let’s look at each of the options in the Annotation widget for Elementor below.
Add a Annotation Widget to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Annotation”
- Hover over the widget in the search results and click install
- Add the “Annotation” widget to any Elementor Page
General Settings
Shape
Select the shape for annotation.
- Underline
- Box
- Circle
- Highlight
- Strike-Through
- Crossed-Off
- Bracket
Stroke Width
Set the stroke width.
Annotation Color
Choose the annotation color.
Annotation Padding
Set the annotation padding.
Loop
Turn on the loop option for annotation.
Loop Interval
Set the interval for loop.
Animate
Turn on the animation for annotation.
Animation Duration
Set the duration for animation.
Dark Mode Mix Color
Choose a color to display the dark mode mix color.
Trigger Effect When In Viewport
Animation will trigger when it is in viewport.
Text Settings
Text Before
Type the text to show before the annotation.
Annotation Text
Type text for annotation text.
Text After
Type text to show after annotation text.
Link
Type or paste URL to link with annotation text.
Annotation Widget Styling
You have full control over the widget’s design, including colors, text and layout, ensuring it aligns with your website’s aesthetic and functions as you envision.
Before Text Styling
Set the typography, color and text shadow of before text.
Annotation Text Styling
Style the typography, color, and text shadow of annotation text.
After Text Styling
You can set the after text typography, color, and text shadow.
Annotation Design Examples For Elementor
Here are some live use cases for the Annotation Widget.
Highlight text annotation.
Crossed-off text annotation.
Thank you for exploring the Annotation Widget for Elementor! We hope this documentation has helped you understand its features and functionality. Whether you’re enhancing usability or adding a creative touch to your content, this widget is a powerful addition to your Elementor toolkit.
If you need further assistance or want to explore more widgets, don’t hesitate to reach out to our support team.
