How To Add Snow Fall Effect in Blogger ?

How To Add Snow Fall Effect in Blogger

Hello Everyone, In This Post I Will Share How To Add Snow Fall Effect in Blogger. This effect will beautify the look of your blog and your blog will look alive with this snow effect.

However, for some reason the snow effect is so popular in today's blogger world, so few people use it. Maybe a lot of people say that setting up the snow effect is a start or some say it blocks the viewer of the reader.

However, in this post I will share how to affect the latest version of Snowflake on the blog. It looks beautiful, does not block the view of the reader and is not too cumbersome for the loading process of the blog. If you are interested in applying it to the blog, please follow the steps below.

How To Add Snow Fall Effect in Blogger :-

Step 1 :- First Go To Blogger.Com.
Step 2 :- Then Login Your Blogger Account.
Step 3 :- Then Click on Theme Menu.
Step 4 :- After Click on Edit Html.
Step 5 :- Then Copy The Given Css Code and Put it Above The </head>.
<!-- Snow Fall Effect Css By Www.SmartTechMukesh.Online -->
<style type='text/css'>
/* Snow Fall Effect Css By Www.SmartTechMukesh.Online */
.stm-snow-fall-container{height:100%;position:relative;overflow:hidden;z-index:1}
.stm-snow-fall{position:fixed;top:0;left:0;right:0;pointer-events:none;z-index:20}
</style>
Step 6 :- Then Copy The Given Html & JavaScript Code and Put it Above The </body>.
<!-- Snow Fall Effect HTML By Www.SmartTechMukesh.Online -->
<div class='stm-snow-fall-container'>
<canvas class='stm-snow-fall' id='stm-snow-fall'></canvas>
</div>
<!-- Snow Fall Effect JavaScript By Www.SmartTechMukesh.Online -->
<script type='text/javascript'>
//<![CDATA[
!function(){function t(t){var n=t.getContext("2d"),e=0,i=0,o=[],d=function(){this.x=this.y=this.dx=this.dy=0,this.reset()};function a(){e=window.innerWidth,i=window.innerHeight,t.width=e,t.height=i,function(t){if(t!=o.length){o=[];for(var n=0;n<t;n++)o.push(new d)}}(e*i/1e4)}d.prototype.reset=function(){this.y=Math.random()*i,this.x=Math.random()*e,this.dx=1*Math.random()-.5,this.dy=.5*Math.random()+.5},a(),function t(){n.clearRect(0,0,e,i),n.fillStyle="rgba(255,255,255,.3)",o.forEach(function(t){t.y+=t.dy,t.x+=t.dx,t.y>i&&(t.y=0),t.x>e&&(t.reset(),t.y=0),n.beginPath(),n.arc(t.x,t.y,5,0,2*Math.PI,!1),n.fill()}),window.requestAnimationFrame(t)}(),window.addEventListener("resize",a)}var n;n=function(){t(document.getElementById("stm-snow-fall"))},"loading"!=document.readyState?n():document.addEventListener("DOMContentLoaded",n)}();
//]]>
</script>
Step 7 :- Finally, Don't Forget To Click on Theme.

Conclusion :-

In this post I have shared tutorial on How To Add Snow Fall Effect in Blogger. I hope this tutorial can be useful for all Professional and Beginners Bloggers. Thank you for visiting our website.

Refrence :
Www.SmartTechMukesh.Online

Read Also :