اضافة الانضمام للمدونة بزر منبثق

طريقة التركيب

<style scoped='' type="text/css">
/*<![CDATA[*/
.arlinafollowForm p {font-size: 13px;}
a.arlinafollowButton.followActive {background-color: #f79400;color: #fff;}
a.arlinafollowButton {color: #FFFFFF;background: #456B8E;}
#arlinafollowSubscribe{    background-color: #010c2b;
    width: 263px;
    color: #fff;
    position: fixed;
    z-index: 999;
    right: 10px;
    bottom: 0;
    box-shadow: 0 0 3px rgba(0,0,0,.05);
    border: 4px solid #f79400;
}
.arlinafollowButton{background:#464646;color:#fff;font-size:13px;line-height:28px;padding:0 10px;text-decoration:none;position:absolute;top:-28px;right:0;display:block;border-radius:2px 2px 0 0;height:28px;font-weight:700}
.arlinafollowButton span{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-FBwBcDjtqDtdoXVTIBvbLGG35Os-hX9qY3-OgE1v2hVEbjGfmXz4uMMHYunNjGg8u_lW9Vg9-Gb6xH2FDa1PeYBUR1kDy0HHqCS657EmH850w6O7wz84mTN-tjy8FJp7BX2HDzkoVJ1g/s1600/follow-blogger.png") no-repeat scroll 0 3px transparent;padding-left:15px}
.arlinafollowButton:hover,.arlinafollowButton:focus,.followActive,.followActive:hover{color:#fff}
.arlinafollowButton:hover span,.followActive span{background-position:0 -37px!important}
.followactive{background-color:#333}
.arlinafollowForm{padding:15px;margin:auto;text-align:center;font-size:12px}
.arlinafollowForm p{margin:10px 0}
.arlinaFollowFooter{text-align:center;font-size:11px;padding:7px 0;margin:0 0 -15px;border-top:1px solid #3c3c3c}
.arlinaFollowFooter a{color:#aaa;background:none;text-decoration:none}
.arlinaFollowFooter a:hover{color:#fff;background:none}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
!function(e){e(document).ready(function(){e.extend(e.easing,{easeOutCubic:function(e,o,t,a,n){return a*((o=o/n-1)*o*o+1)+t}});var o=e("#arlinafollowSubscribe"),t="-"+o.outerHeight()+"px";o.hide().css({bottom:"-510px"}),setTimeout(function(){o.show().animate({bottom:t})},500),e(".arlinafollowButton").click(function(a){o.hasClass("followOpened")?(e(this).removeClass("followActive"),o.removeClass("followOpened").stop().animate({bottom:t},{duration:300,easing:"easeOutCubic"})):(e(this).addClass("followActive"),o.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})),a.preventDefault()})})}(jQuery);
/*]]>*/
</script>
<div id="arlinafollowSubscribe" style="bottom: -971px;">
  <div class="arlinafollowForm">
    <a class="arlinafollowButton" href="#" title="متابعه"><b style=" font-size: 13px;  font-weight: 100;">تابعنا هنا</b></a>
       <br />
    <a href="http://www.Blogger.com/follow-blog.g?blogID=4545171181207469156" title="إنضم إلينا الأن" onclick="window.open(this.href, 'dmfollow', 'toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=no,width=700,height=600');return false;" style="text-align:center;font-weight:bold;text-decoration:none;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyvECTHmHfTeU_td9AHVm-rXAIUhl3NmxbHpslkqX0rRannQpbTsLYvKiSa961MsKGO7utYjwB3QLEvClFew6aWQWi7MQEhMllvcJpwno2tGquHEXu_GqI0FSX10mv3J3jCyXQx18rw18/s1600/wdbloog.png" alt="إنضم إلينا الأن" /></a>
    <br />
    <p>إنضم الينا ليصلك كل ما هو جديد </p>
  </div>
</div>

ملاحظة