Instructions
Watch the video tutorial and follow all the steps. Check out my example version for a blur background on a tooltip.
- Make sure you Elementor Pro installed on your website.
The custom css code
Custom css for the blur background
<style> .e-hotspot__tooltip { backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); } </style>
Example HTML for a button (paste this on the Elementor editor)
<button class="button1">Buy now</button>
Example CSS for a button with hover effect (paste this before the </style>)
.button1{ background-color: #fff; color: #C25BAB; border: none; border-radius: 99px; padding: 12px 30px 12px 30px; font-size: 15px; } .button1:hover{ background-color: #C25BAB; color: #fff; border: none; }
Don’t just copy and paste the code on your website. It only works if you follow the steps in the tutorial.