Resources

Hotspot tutorial

Instructions

Watch the video tutorial and follow all the steps. Check out my example version for a blur background on a tooltip.

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. 

Some of the links on this page could be affiliate links, where I earn a commission if you make a purchase via my link. This helps me continue to create the free content that I put out. I will only promote companies that I really believe are worth your money. Thanks a lot if use my links to make a purchase.