Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.
Step 2. Now Click on Template -> Edit HTML.
Step 3. Now Search for ]]></b:skin> or </style> by Pressing Ctrl+F keys.
Step 4. Copy the below CSS code and paste it just before the ]]></b:skin> or </style> tag.
/* CSS Breaking News Ticker */
.bsd-ticker{display:block;text-align:center;margin:0 20px 20px 20px;padding:3px;background:#fefefe;border:1px solid rgba(0,0,0,0.1);border-left:5px solid #415471}
.bsd-ticker>span{display:inline-block;background:#415471;padding:0;font:700 12px 'roboto',sans-serif}
.bsd-ticker>span>a{color:#222;text-decoration:none}
#ticker{height:46px;overflow:hidden;background:#ffffff;text-align:left}
#ticker ul{padding:0;margin:0;list-style:none}
#ticker ul li{height:46px;white-space:nowrap}
#ticker ul li img{float:left;width:36px;height:36px;margin:5px 7px 5px 5px}
#ticker ul li h3{margin:0;font:700 16px 'roboto',sans-serif}
#ticker ul li h3 a{color:#666;text-decoration:none;line-height:26px!important}
#ticker ul li .authorticker{font:400 12px 'roboto',sans-serif;line-height:21px!important;color:#666}
Step 5. Now Search for the closing tab </body> and add the below java script just above/before the </body> tag.
<script type='text/javascript'>
//<![CDATA[
// 2016 Breaking News ticker by http://www.bloggersstand.com
function getauthorundefinedt){forundefinedvar e=0;e<t.length;e++)var i=t[e].name.$t;return i}function getmetaundefinedt){var e=[];e[1]="Jan",e[2]="Feb",e[3]="Mar",e[4]="Apr",e[5]="May",e[6]="Jun",e[7]="Jul",e[8]="Aug",e[9]="Sep",e[10]="Oct",e[11]="Nov",e[12]="Dec";var i=t.substringundefined0,4),a=t.substringundefined5,7),n=t.substringundefined8,10),r=e[parseIntundefineda,10)]+" "+n+" "+i;return r}function bloggersstandtickerundefinedt){var e=document.querySelectorundefined"#ticker"),i=t.feed.entry,a="<ul id='ticket-wrapper-inner'>";ifundefinedi){forundefinedvar n=0;n<i.length;n++){forundefinedvar r=i[n],s=0;s<r.link.length;s++)ifundefined"alternate"==r.link[s].rel){var l=r.link[s].href;break}try{var o='<img src="'+r.media$thumbnail.url+'"/>'}catchundefinedt){var o=""}var u=r.title.$t,c=getauthorundefinedr.author),d=getmetaundefinedr.published.$t);a+="<li>"+o+'<h3><a href="'+l+'">'+u+'</a></h3><div class="authorticker"><span>'+c+"</span> - <span>"+d+"</span></div></li>"}a+="</ul>",e.innerHTML=a}$undefined"#ticker").bsdtickerundefined)}!functionundefinedt){var e={speed:700,pause:4e3,showItems:1,mousePause:!0,height:0,animate:!0,margin:0,padding:0,startPaused:!1},i={moveUp:functionundefinedt,e){i.animateundefinedt,e,"up")},moveDown:functionundefinedt,e){i.animateundefinedt,e,"down")},animate:functionundefinede,i,a){var n=e.itemHeight,r=e.options,s=e.element,l=s.childrenundefined"ul"),o="up"===a?"li:first":"li:last";s.triggerundefined"bsdticker.beforeTick");var u=l.childrenundefinedo).cloneundefined!0);ifundefined0<r.height&&undefinedn=l.childrenundefined"li:first").heightundefined)),n+=r.margin+2*r.padding,"down"===a&&l.cssundefined"top","-"+n+"px").prependundefinedu),i&&i.animate){ifundefinede.animating)return;e.animating=!0,l.animateundefined"up"===a?{top:"-="+n+"px"}:{top:0},r.speed,functionundefined){tundefinedl).childrenundefinedo).removeundefined),tundefinedl).cssundefined"top","0px"),e.animating=!1,s.triggerundefined"bsdticker.afterTick")})}else l.childrenundefinedo).removeundefined),l.cssundefined"top","0px"),s.triggerundefined"bsdticker.afterTick");"up"===a&&u.appendToundefinedl)},nextUsePause:functionundefined){var e=tundefinedthis).dataundefined"state"),i=e.options;e.isPaused||2>e.itemCount||a.next.callundefinedthis,{animate:i.animate})},startInterval:functionundefined){var e=tundefinedthis).dataundefined"state"),a=this;e.intervalId=setIntervalundefinedfunctionundefined){i.nextUsePause.callundefineda)},e.options.pause)},stopInterval:functionundefined){var e=tundefinedthis).dataundefined"state");e&&undefinede.intervalId&&clearIntervalundefinede.intervalId),e.intervalId=void 0)},restartInterval:functionundefined){i.stopInterval.callundefinedthis),i.startInterval.callundefinedthis)}},a={init:functionundefinedn){a.stop.callundefinedthis);var r=jQuery.extendundefined{},e);n=t.extendundefinedr,n);var r=tundefinedthis),s={itemCount:r.childrenundefined"ul").childrenundefined"li").length,itemHeight:0,itemMargin:0,element:r,animating:!1,options:n,isPaused:n.startPaused?!0:!1,pausedByCode:!1};tundefinedthis).dataundefined"state",s),r.cssundefined{overflow:"hidden",position:"relative"}).childrenundefined"ul").cssundefined{position:"absolute",margin:0,padding:0}).childrenundefined"li").cssundefined{margin:n.margin,padding:n.padding}),isNaNundefinedn.height)||0===n.height?undefinedr.childrenundefined"ul").childrenundefined"li").eachundefinedfunctionundefined){var e=tundefinedthis);e.heightundefined)>s.itemHeight&&undefineds.itemHeight=e.heightundefined))}),r.childrenundefined"ul").childrenundefined"li").eachundefinedfunctionundefined){tundefinedthis).heightundefineds.itemHeight)}),r.heightundefinedundefineds.itemHeight+undefinedn.margin+2*n.padding))*n.showItems+n.margin)):r.heightundefinedn.height);var l=this;n.startPaused||i.startInterval.callundefinedl),n.mousePause&&r.bindundefined"mouseenter",functionundefined){!0!==s.isPaused&&undefineds.pausedByCode=!0,i.stopInterval.callundefinedl),a.pause.callundefinedl,!0))}).bindundefined"mouseleave",functionundefined){undefined!0!==s.isPaused||s.pausedByCode)&&undefineds.pausedByCode=!1,a.pause.callundefinedl,!1),i.startInterval.callundefinedl))})},pause:functionundefinede){var i=tundefinedthis).dataundefined"state");ifundefinedi){ifundefined2>i.itemCount)return!1;i.isPaused=e,i=i.element,e?undefinedtundefinedthis).addClassundefined"paused"),i.triggerundefined"bsdticker.pause")):undefinedtundefinedthis).removeClassundefined"paused"),i.triggerundefined"bsdticker.resume"))}},next:functionundefinede){var a=tundefinedthis).dataundefined"state");ifundefineda){ifundefineda.animating||2>a.itemCount)return!1;i.restartInterval.callundefinedthis),i.moveUpundefineda,e)}},prev:functionundefinede){var a=tundefinedthis).dataundefined"state");ifundefineda){ifundefineda.animating||2>a.itemCount)return!1;i.restartInterval.callundefinedthis),i.moveDownundefineda,e)}},stop:functionundefined){tundefinedthis).dataundefined"state")&&i.stopInterval.callundefinedthis)},remove:functionundefined){var e=tundefinedthis).dataundefined"state");e&&undefinedi.stopInterval.callundefinedthis),e=e.element,e.unbindundefined),e.removeundefined))}};t.fn.bsdticker=functionundefinede){return a[e]?a[e].applyundefinedthis,Array.prototype.slice.callundefinedarguments,1)):"object"!=typeof e&&e?void t.errorundefined"Method "+e+" does not exist on jQuery.bsdticker"):a.init.applyundefinedthis,arguments)}}undefinedjQuery),$undefinedfunctionundefined){var t=document.createElementundefined"script");t.src="http://"+$undefined".bsd-ticker").dataundefined"domain")+"/feeds/posts/summary?alt=json&callback=bloggersstandticker",t.type="text/javascript",document.getElementsByTagNameundefined"body")[0].appendChildundefinedt)});
//]]>
</script>
Step 6. Now Add the following code between the <body> </body> tag.<div class='bsd-ticker' data-domain='www.bloggersstand.com'>
<div id='ticker'>
</div>
</div>
Now Save your template Done..! Customization:- Replace www.bloggersstand.com with your website url.
