Affectionate Click Effect: Enhancing Your Website With Love
Hi there, now I'll explain how to add the heart click effect to your blogger website. With just one script, you can incorporate the heart click feature on your Blogger website in a very simple way. The heart click effect will become active once you add this code to your website. Adding this effect to your website has the following advantages:
Advantages Of Using The Heart Click Effect On Websites
The inclusion of a heart click effect on your website can enhance user friendliness by producing a heart-shaped effect when users click on body text or other visually appealing elements. This is achieved through the use of JavaScript code.
1. Participation
2. Eye-Catching Appeal
3. Customization
4. Emotional Bonding
5. Possibility of sharing
How To Add Colorful Heart Click Effect On Your Blogger Website
1. Go to the Blogger Dashboard after logging into your Blogger account.
2. Select Theme Options From The Navigation Bar.
3. Press the Arrow Key, Then Select "Edit HTML."
4. Navigate Code Proceed to the Last Spot.
5. Find </Body> Closed Body Teg And Paste This Code In Above Close Body tag.
<script type='text/javascript'> //<![CDATA[ !function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document); //]]> </script>
Conclusion
This post will explain How To Add Colorful Heart Click Effect On Your Blogger Website. If you find this useful, please share it with your friends. If you still have questions, feel free to join our Telegram groups for more helpful content. The majority of the advice is exclusively available on Telegram Chenall, your preferred ShouXHere