دليل المدون

2016-10-01

أضف عداد زمنى قبل الخروج عبر رابط التحميل أوالروابط الخارجية

بسم الله الرحمن الرحيم

والصلاة والسلام على أشرف المرسلين

سيدنا محمد وعلى آله وصحبه أجمعين

   هذه الإضافة هامة بالنسبة للمواقع التى تحتوى على العديد من الروابط  الخارجية أو روابط التحميل ، فبالرغم من أن كثير من هذه المواقع تحتوى على محتوى جيد ،تجد أنها تعانى من إرتفاع فى معدل الإرتداد وهو خروج الزائر بعد فترة قصيرة من زيارة الموقع وبالتالى يؤثر سلبًا على الإحصائيات وتقييم الموقع مما يترتب عليه تأخر بنتائج البحث.
ويرجع السبب فى ذلك أن الزائر بمجرد أن يجد رابط التحميل يخرج من الصفحة دون أن يهتم بقراءة المحتوى، وقد عرضت الكثير من الحيل لتخطى هذه المشكلة مثل:
  1. فتح الروابط الخارجية وروابط التحميل داخل صندوق الضوء
  2. أداة إظهار المحتوى المخفى بعد مشاركة الموضوع على المواقع الإجتماعية
  3. وأخيرًا أداة اليوم والتى تأخر خروج الزائر من موقعك عبر الروابط الخارجية والتى سأشرح إضافتها بطريقتين:
  • الطريقة الأولى:عرض عداد تنازلى قبل ظهور الرابط مع رسالة "إنتظر قليلا قبل ظهور الرابط"
  • الطريقة الثانية:وهى ظهور العداد الزمنى بعد الضغط على الرابط  وقبل التوجه إلى الصفحة الخارجية مع ظهور رسالة "إنتظر قليلا قبل التوجه إلى الصفحة"
countdown loading
 الإضافة مناسبة لجميع مواقع و صفحات الويب Html بما فيها مدونات بلوجر >>تابع شرح تركيب الكود لمدونات بلوجر:

كيفية تركيب عداد تنازلى يؤخر الخروج من الموقع لمدونات بلوجر

1. إذهب إلى لوحة تحكم بلوجر ثم تبويب قالب ( قم بالإحتفاظ بنسخة إحتياطية من القالب). 
** سواء كنت ستستخدم الطريقة الأولى أو الثانية أضف  الكود التالى قبل الوسوم </head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
إذا كان هذا الكود لديك فى القالب فلا داعى لإضافته مرة أخرى

2. إذهب إلى صفحة المشاركة التى تريد إضافة الرابط الخارجى أو رابط التحميل بها ثم أضف الكود التالى داخل تبويب HTML للمشاركة على حسب طريقة ظهور المؤقت الزمنى:

الطريقة الأولى: عرض عداد تنازلى قبل ظهور الرابط  الخارجى

معاينة
<script>
jQuery(document).ready(function() {
var sec = 5
var timer = setInterval(function() {
   $("#condaianllkhir span").text(sec--);
   if (sec == 0) {
$("#DrRO").delay(1000).fadeIn(1000);
$("#condaianllkhir").hide(1000) .fadeOut(fast);}
},1000);
});
</script>
<center>
<br/>
<br/>
<a class="button" href="http://www.Youraddress.com/" id="DrRO" rel="nofollow" style="display: none;" target="_blank">رابط التحميل</a>
<div id="condaianllkhir">
<b></b>
<div style="font-size: large;">
<b>إنتظر قليلا حتى يظهر الرابط <br/> <br/> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDaahbl_dPzmhzwOjW2HFLEVTkOO0KJ43pAEXq_unqZHokHz7FKnvAwuCeDVVtVok72mjP5GCUdb6pFtbGCrkaEEj_0PIRkg2Xcr1obu7j7vH1qUzaN5VZpBuf1kvZdmhrwQ-9c_nLUdxp/s1600/circular_loader_282_red.gif" /> <br/><br/><span>5</span> sec </b></div>
</div>
</center>

الطريقة الثانية: عرض العداد الزمنى بعد الضغط على الرابط  وقبل إعادة التوجيه إلى الصفحة الخارجية

معاينة

<script>
$(function () {
    $("#condaianllkhir").click(function () {
        var seconds = 5;
        $("#CountDown").show();
  $("#condaianllkhir").hide();
        $("#DrRO").html(seconds);
        setInterval(function () {
            seconds--;
            $("#DrRO").html(seconds);
            if (seconds == 0) {
                $("#CountDown").hide();
                window.location = "http://www.Youradress.com/";
            }
        }, 1000);
    });
});
</script>
<center>
<br/>
<br/>
 <input type="button" id="condaianllkhir" value="إضغط هنا للتحميل" />
<br />
<br />
<div id="CountDown" style="display: none">
<b>إنتظر قليلا قبل التوجه إلى صفحة التحميل <br/> <br/> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDaahbl_dPzmhzwOjW2HFLEVTkOO0KJ43pAEXq_unqZHokHz7FKnvAwuCeDVVtVok72mjP5GCUdb6pFtbGCrkaEEj_0PIRkg2Xcr1obu7j7vH1qUzaN5VZpBuf1kvZdmhrwQ-9c_nLUdxp/s1600/circular_loader_282_red.gif" /> <br/><br/> <span id="DrRO"></span>&nbsp;seconds.
</div>
</center>

ملاحظات:
  • لا تنسى إستبدال الرابط http://www.Youradress.com/  برابط التحميل أو الرابط الخارجى الخاص بك
  • إذا أردت تغيير العداد التنازلى قم بتغيير رقم 5 الموجود بالكود
تابع المزيد من إضافات بلوجر
تنبيه : المرجو عدم نسخ الموضوع بدون ذكر مصدره المرفق بالرابط المباشر للموضوع الأصلي وإسم المدونة وشكرا  
تصميم مواقع إلكترونية و تطبيقات بأقل الأسعار

هناك 18 تعليقًا

  1. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
    الردود
    1. يمكن ذلك بإضافة الكود الجافاسكريبت ما بين العلامة </script> قبل الوسوم </head> داخل القالب
      ولكنك ستضطر إلى إضافة باقى الكود داخل تبويب Html للمشاركة

      حذف
  2. أزال أحد مشرفي المدونة هذا التعليق.

    ردحذف
  3. شكرا علي الاضافات الجميلة لكن عندي استفسار كيف اجعل الرابط يفتح في نافذة جديدة في الطريقة الثانية

    ردحذف
    الردود
    1. بالفعل تم تجربة الكود لإعادة التوجيه بصفحة جديدة ولكنه لا يعمل جيدًا مع جميع المتصفحات

      حذف
  4. شكرا جزيﻻ موضوع مهم

    ردحذف
  5. شكرا جزيلا ولكن هل هناك طريقة انشاء صفحة اعادة توجيه الروابط لمدونات بلوجر مع العداد

    ردحذف
    الردود
    1. سأحاول شرح هذه الطريقة فى الفترة القادمة بإذن الله

      حذف
  6. عايز اللينك يفتك فى تبويب جديد"نيو تاب" بس مش يخرج الزائر من موقعى

    ردحذف
    الردود
    1. بالفعل حاولت تطبيق هذا الاقتراح ولكن عند الفتح فى تبويب جديد لا يعمل الكود جيدا مع جميع المتصفحات

      حذف
  7. حاولت ارسال تعليق سابق بقصد الافاده لاكني لم اجد رد ..

    ردحذف
    الردود
    1. عذرا ..سأحاول بقدر الإمكان الرد على جميع الإستفسارات

      حذف
  8. الرجاءازلة شريط أدوات التواصل الاجتماعي الذي علي يمين الصفحة

    ردحذف
  9. السلام عليكم كيف اغير شكل زر اظغط للتحميل

    ردحذف
  10. مشكور الا تستطيع مساعدتي بهذه الاضافة في ووردبريس

    ردحذف
    الردود
    1. للأسف ليس لدى الإضافة على الووردبريس..شكرا للمتابعة

      حذف

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

Privacy-Policy | إعلن لدينا
جميع الحقوق محفوظة لــ كن داعيا للخير 2011-2022 ©

تصميم كن مدون