لماذا يفضلها أصحاب المواقع الكبيرة؟
المواقع العالمية التي تقدم خدمات مجانية تعتمد على هذا النوع من الأزرار لضمان أن الزائر قد قرأ جزءاً من المحتوى بدلاً من "الدخول والخروج السريع" (Bounce). هذا السلوك يعطي انطباعاً إيجابياً لمحركات البحث بأن المحتوى ذو قيمة عالية.

<!-- Smart Download Button by Bigosti -->
<style>
.bigosti-dl-box { text-align: center; margin: 30px 0; font-family: 'Tajawal', sans-serif; }
#dl-btn-container {
  display: inline-block;
  padding: 15px 40px;
  background: #ff8c00;
  color: #fff;
  border-radius: 50px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(255,140,0,0.3);
  transition: 0.3s;
  text-decoration: none;
}
#dl-btn-container:hover { transform: translateY(-3px); background: #e65100; }
.timer-info { margin-top: 15px; color: #666; font-size: 14px; }
</style>

<div class="bigosti-dl-box">
  <div id="dl-btn-container" onclick="startDownloadTimer()">اضغط هنا للتحميل</div>
  <div id="timer-msg" class="timer-info"></div>
</div>

<script>
function startDownloadTimer() {
  const btn = document.getElementById("dl-btn-container");
  const msg = document.getElementById("timer-msg");
  let timeLeft = 15; // عدد الثواني
  
  btn.style.pointerEvents = "none";
  btn.style.opacity = "0.7";
  btn.innerText = "جاري تحضير الرابط...";
  
  const timer = setInterval(() => {
    timeLeft--;
    msg.innerHTML = `يرجى الانتظار <span style="color:#ff8c00;font-weight:bold">${timeLeft}</span> ثانية...`;
    
    if (timeLeft <= 0) {
      clearInterval(timer);
      btn.innerHTML = "✅ تحميل الملف الآن";
      btn.style.opacity = "1";
      btn.style.pointerEvents = "auto";
      btn.onclick = () => window.open("YOUR_LINK_HERE", "_blank");
      msg.innerHTML = "الرابط جاهز للتحميل المباشر!";
    }
  }, 1000);
}
</script>