In this guide, we will show you how to add an “Annotation widget” to your Elementor website. The Annotation widget enables you to add hand-drawn-style annotations that enhance visual storytelling and guide user attention with ease. Perfect for highlighting key content or adding context, this interactive widget brings a dynamic, personalized touch to your designs. With customizable options for style, animation duration, and delay, the Annotation widget offers both creative flexibility and functional clarity for a more engaging user experience.
Let’s explore the customization options available in the “Annotation widget” for Elementor below.
Add an Annotation to Elementor
This widget requires “Unlimited Elements Pro” version installed and activated on your WordPress website.
Add an Annotation Widget to an Elementor Page
Elementor Annotation Widget General Settings
Shape
Select the annotation shape.
Stroke Width
Adjust the thickness of the annotation line.
Annotation Color
Set the color of the annotation.
Annotation Padding
Control the spacing around the annotation.
Loop
Toggle whether the annotation animation repeats continuously.
Loop Interval (ms)
Set the delay time (in milliseconds) between animation loops.
Animate
Enable or disable the annotation animation.
Animation Duration (ms)
Adjust the length (in milliseconds) of the animation.
Trigger Effect When In Viewport
Choose whether the animation activates only when the annotation enters the viewport.
Reveal on Scroll
Enable or disable the option to replay the animation when the element enters the viewport during scrolling.
Elementor Annotation Widget Style Settings.
Annotation Widget Design Examples For Elementor
Here are some live use cases for the Annotation widget.
Confetti Background with Elementor Annotation widget.
Audio Playlist with Elementor Annotation widget.
Thank you for using the Annotation widget for Elementor! Designed to bring hand-drawn style annotations to your website, this widget lets you highlight key content with eye-catching animations and interactive visuals. It’s perfect for guiding users, adding context, and drawing attention to important elements on the page. With customizable settings for style, animation duration, and delay, the Annotation widget gives you full creative control to enhance your site’s storytelling. If you have any questions or need assistance, feel free to reach out. For inspiration and live examples, be sure to check out the demo on our website.