اضافة نافذة منبثقة للانضمام الى متابعي المدونة
اهلا بمتابعي مدونة نكهة التقنية الكرام في درس جديد على قسم إضافات بلوجر, سنقدم لكم اليوم إضافة جديدة وحصرية طبعا وأضن انكم لاحظتم الاضافة الجديدة التي نستعملها على المدونة فهي تنبثق على المدونة عند الدخول اليها, وكانت هذه الفكرة لطالما بحث عنها العديد منكم فهي تساعد على كسب متابعين أكثر حيت يمكنك استعمالها سواءا للحصول على متابعين على مدونتك او استعمالها كآداة للحصول على معجبين على مواقع التواصل الاجتماعي كالفيسبوك وتويتر وغيرها, إذن تابعو معي الشرح 👌
شرح تركيب الآداة
اولا: عليك تحرير قالب مدونتك ثم البحث باستعمال Cntr+f عن الوسم

]]></b:skin>
ثم قم بوضع الأكواد فوقها
.nak1ha .Nak1haText {
margin: auto;
}
a.RcloseNak1ha:hover {
color: #555;
}
a.closeNak1ha {
position: absolute;
top: 0;
right: 0;
font-size: 18px;
margin-right: 7px;
color: #888;
display: block;
}
.Nak1habox {
width: 35%;
margin: auto;
position: relative;
height: 240px;
background: #fff;
box-shadow: 0 0 19px 3px rgba(0, 0, 0, 0.33);
text-align: center;
display: flex;
flex-direction: column;
}
.nak1ha {
display: flex;
position: fixed;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.53);
z-index: 99999999;
visibility:hidden;
opacity:0;
top: 0;
}
a.Nak1halink:hover {
opacity: 0.88;
}
a.Nak1halink {
background: #243750;
display: inline-block;
color: #fff;
padding: 4px 11px;
font-size: 16px;
border-radius: 3px;
margin-top: 16px;
}
.Nak1haText h5 {
font-size: 18px;
font-weight: 500;
}
.nak1ha.show {
visibility:visible;
opacity:1;
}
.nak1ha a, .nak1ha {
transition:0.35s;
}

ثانيا: إبحث عن الوسم

<body

وضع اسفله هذه الأكواد

<div class='nak1ha'>
<div class='Nak1habox'>
<a class='closeNak1ha' href='#'><i class='fa fa-close'/></a>
<div class='Nak1haText'>
  <h5>
انضم الى متابعي المدونة الأوفياء ليصلك جديد مدونتنا !</h5>
<a class='Nak1halink' href='https://goo.gl/fIuSG5' target='_blank'><i class='fa fa-user-plus'/>
إنضم الان</a>
</div>
</div>
</div>

ثالثا: يتبقى السكريبت المسؤول عن انبثاق الإضافة وإغلاقها يكفيك البحث عن هذا الوسم

</body>

وقم بوضع هذا السكربت فوقه

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function(){
$(".nak1ha").delay(20000).addClass("show");
  $(".closeNak1ha").click(function(){
$(".nak1ha").removeClass("show");
});
});
//]]>
</script>

وأخيرا: عليك تغيير الرابط الملون بالأحمر في الخطوة الثانية واستبداله برابط الانضمام لمتابعة مدونتك
ومبروك عليك الإضافة

إلى هنا نكون قد وصلنا الى نهاية درسنا لهذا اليوم
😊
دمتم في أمان الله
اضافة نافذة منبثقة للانضمام الى متابعي المدونة

اضافة نافذة منبثقة للانضمام الى متابعي المدونة

هناك 4 تعليقات:

  1. امر جميل ولكن هل من الممكن ان تساعدني فانا اريد عمل تطبيق لموقعي ارجوا ان تساعدني

    ردحذف
    الردود
    1. يمكنك عمل تطبيق لموقعك عن طريق موقع Appyet بسهولة وهناك عدة دروس وفيديوهات حول انشاء تطبيق لموقع
      يكفيك البحث عنها في اليوتيوب

      حذف

جميع الحقوق محفوظة نكهة التقنية | تصميم : الروسافي عمر