-->
العربي ويب العربي ويب
recent

آخر الأخبار

recent
recent
جاري التحميل ...

كيفية إضافة زر المتابعة منزلق على مدونتك بشكل احترافي


السلام عليكم ورحمة الله تعالى وبركاته

أسعد الله أوقاتكم بكل خير أحبابي في الله وأهلا ومرحبا بكم مجددا على مدونتكم العربي ويب
سنتعرف اليوم عن كيفية إضافة زر المتابعة منزلق على مدونتك بشكل احترافي 2017
إذا كنت تبحث عن فكرة أو أداة لزيادة متابعيك، أنت في المكان الصحيح زر المتابعة سوف يوفر لك فرصة كبيرة لتحويل زوار مدونتك إلى متابعين.


مشاهدة عرض توضيحي

خطوات تركيب زر المتابعة منزلق على مدونتك :

تابع معي ...

أولا - توجه إلى لوحة تحكم مدونتك  من هنا 
2 - قالب (المظهر) >> تحرير HTML >>

3 - إضغط Ctrl+F وإبحث عن الوسم التالي
]]></b:skin>
4 - أضف فوقه مباشرة الكود التالي.
#arlinafollowSubscribe {
    background-color: #464646;
    width: 220px;
    color: #fff;
    position: fixed;
    z-index: 999;
    right: 10px;
    bottom: 0
}
.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://4.bp.blogspot.com/-fc3-0J--iW8/VyPNjRmxJtI/AAAAAAAAD7U/emRRY6ntYEg3IaL-mev9XxE9M1OKh50fACLcB/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
}
5 - إبحث الآن عن الوسم
</head>
6 - أضف الكود التالي فوقه مباشرة
<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> 
7 - اضغط على زر حفظ المظهر.

8 - الآن توجه الى التخطيط >> إضافة أداة HTML >>

9 - وألصق الكود التالي في مربع HTML.
<div id="arlinafollowSubscribe" style="bottom: -971px;">
  <div class="arlinafollowForm">
    <a class="arlinafollowButton" href="#" title="Follow"><b>+ Follow</b></a>
    <br />
    <a href="http://www.Blogger.com/follow-blog.g?blogID=5984441404945568808" title="join this site" onclick="window.open(this.href, 'dmfollow', 'toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=no,width=599,height=521');return false;" style="text-align:center;font-weight:bold;text-decoration:none;"><img src="https://1.bp.blogspot.com/-HViEx99kxmQ/VyPMrPGAvEI/AAAAAAAAD7M/bWz5CKpHrHkxtVdgL0z-xJQa_nA_tK0gACLcB/s1600/Follower.png" alt="Join on this site" /></a>
    <br />
    <p>with Google Friend Connect</p>
  </div>
</div>
إستبدل المعرف 5984441404945568808 بمعرف مدونتك
إستبدل العبارة with Google Friend Connect 

إحفظ الأداة وتوجه لمدونتك لمشاهدة النتيجة. 


تم بحمد الله ...

 أي أسئلة أو إستفسار لا تتردد في طرحها
باب التعليقات مفتوح للجميع

كاتب الموضوع

محمد العربي

5 تعليق على موضوع : كيفية إضافة زر المتابعة منزلق على مدونتك بشكل احترافي

  • اضافة تعليق
  • وإياكم إن شاء الله
    يسلم مرورك الكريم أخي

    السلام عليكم ورحمه الله وبركاته
    هل تعني ب html/javascript ام ماذا
    بماذا نستبدل العباره with google frind connect نكتب إيه بدل عنها

    وعليكم والسلام ورحمة الله وبركاته
    أهلا وسهلا أخي الكريم
    يمكنك استبدال العبارة بـ انضم الى متابعي المدونة أو شيء مثل هذا القبيل

    اين اجيب معرف المدونه


    الأبتساماتأخفاء الأبتسامات



    ஜ العربي ويب ஜ | ஜ شعارنا إثراء المحتوى العربي ஜ

    إضغط على | إنضم لموقعنا + متابعتنا عبر مواقع التواصل | وكن أول من يتوصل بجديدنا

    إذا أعجبك محتوى مدونتنا نتمنى البقاء على تواصل دائم ، فقط قم بإدخال بريدك الإلكتروني للإشتراك في بريد المدونة السريع ليصلك جديد المدونة أولاً بأول ، كما يمكنك إرسال رساله بالضغط على الزر المجاور ...

    إتصل بنا

    اخر تعليقات بلوجر

    تغريداتي علي التويتر

    زوار المدونة

    Statistics

    احصاءات المدونة

    جميع الحقوق محفوظة لـ

    العربي ويب

    2017

    –>