Share Blogger Template Countdown Happy New Year [Update 2025]

Không khí Tết đang đến gần, chắc hẳn anh em Blogger đều muốn blog của mình thêm phần sinh động, mang đậm hương vị ngày xuân. Vì vậy hôm nay mình xin chia sẻ template Countdown Tết 2026 dành cho Blogspot.

Share Blogger Template Countdown Happy New Year.

Điểm nổi bật của template:

⏳ Đếm ngược thời gian đến giao thừa 2026.
🌸 Hiệu ứng hoa mai vàng rơi mềm mại, tự nhiên, không lag.
🎆 Pháo bông lung linh phía sau, tạo không khí rộn ràng.
⚡ Giao diện nhẹ, tối ưu SEO, dễ chỉnh sửa theo nhu cầu.
📱 Responsive, hiển thị tốt trên cả PC và mobile.

🚀 Xem Demo

Tải Template

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
  <title>Countdown Tết Nguyên Đán BÍNH NGỌ 2026</title>
  <meta content='width=device-width, initial-scale=1' name='viewport'/>
  <meta content='IE=edge' http-equiv='X-UA-Compatible'/>
  <meta content='Còn bao nhiêu ngày nữa đến Tết Nguyên Đán BÍNH NGỌ 2026? Đồng hồ đếm ngược đến Tết 2026' name='description'/>
  <meta content='Countdown Tết Nguyên Đán 2026' property='og:title'/>
  <meta content='https://www.anhtrainang.com/' property='og:url'/>
  <meta content='Đếm Ngược Đến Tết' property='og:site_name'/>
  <link href='https://fonts.googleapis.com/css?family=Dancing+Script:400,700&amp;subset=vietnamese' rel='stylesheet'/>
  <!-- Blogger chỉ cho 1 skin -->
  <b:skin><![CDATA[
    html,body{
      margin:0;
      padding:0;
      height:100%;
      background:url(https://i.imgur.com/1xQVdtx.png) #900 no-repeat center center fixed;
      background-size:cover;
      font-family:'Dancing Script',Helvetica,Arial,sans-serif;
      color:#fff;
      text-align:center;
    }
    h1{font-size:3em;margin-top:0.5em;}
    h2{font-size:1.6em;margin-top:1em;}
    #main{max-width:1000px;margin:auto;padding:2em;}
    .colorlight{text-shadow:0 0 10px #efe81d,0 0 20px #f80f1f,0 0 40px #f80f1f;}
    .clock-box{display:flex;justify-content:center;flex-wrap:wrap;margin-top:2em;}
    .clock{
      background:#fff;
      color:#222;
      border-radius:20px;
      width:150px;
      height:150px;
      margin:10px;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      box-shadow:0 0 15px rgba(0,0,0,0.5);
    }
    .clock .num{font-size:2.5em;font-weight:bold;}
    .clock .text{font-size:1.2em;margin-top:5px;text-transform:uppercase;}
    @media (max-width:600px){
      .clock{width:100px;height:100px;}
      .clock .num{font-size:1.8em;}
      .clock .text{font-size:1em;}
    }
  ]]></b:skin>
</head>
<body>
  <div id='main'>
    <h2 class='colorlight'>Đếm ngược đến Tết Nguyên Đán 2026</h2>
    <h1 id='tet-date'>17/02/2026</h1>
    <div class='clock-box'>
      <div class='clock'><div class='num' id='days'>0</div><div class='text'>Ngày</div></div>
      <div class='clock'><div class='num' id='hours'>0</div><div class='text'>Giờ</div></div>
      <div class='clock'><div class='num' id='mins'>0</div><div class='text'>Phút</div></div>
      <div class='clock'><div class='num' id='secs'>0</div><div class='text'>Giây</div></div>
    </div>
    <p>Chia sẻ bởi: <a href='https://www.anhtrainang.com/' style='color:#ff0;' target='_blank'>Anh Trai Nắng Blog</a></p>
  </div>
  <script type='text/javascript'>//<![CDATA[
    // Đặt ngày Tết Nguyên Đán 2026 (17/02/2026)
    const tetDate = new Date("Feb 17, 2026 00:00:00").getTime();
    function updateCountdown(){
      const now = new Date().getTime();
      const distance = tetDate - now;
      if(distance <= 0){
        document.getElementById("days").innerText = 0;
        document.getElementById("hours").innerText = 0;
        document.getElementById("mins").innerText = 0;
        document.getElementById("secs").innerText = 0;
        document.getElementById("tet-date").innerText = "Chúc Mừng Năm Mới 2026 🎉";
        return;
      }
      const days = Math.floor(distance / (1000*60*60*24));
      const hours = Math.floor((distance % (1000*60*60*24)) / (1000*60*60));
      const mins = Math.floor((distance % (1000*60*60)) / (1000*60));
      const secs = Math.floor((distance % (1000*60)) / 1000);
      document.getElementById("days").innerText = days;
      document.getElementById("hours").innerText = hours;
      document.getElementById("mins").innerText = mins;
      document.getElementById("secs").innerText = secs;
    }
    setInterval(updateCountdown, 1000);
    updateCountdown();
  //]]></script>
  <b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='yes'/>
<style>
.flower {
  position: fixed;
  top: -50px;
  pointer-events: none;
  z-index: 9999;
  width: 25px;
  height: 25px;
  background-image: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMC32utXR-YIUzn6O9l89EWchYoAJfQDQqMZjz9jXgjOIsRY1hG1cUp3wYl3Yn-4PQLqz9nFPsAV6aGLDtIFPSLKGQV70Se1yGYDDfN2vBaOI5KIg8XV9eq-ANlN7FJktD_gWdQY3j3YA/s1600/hoamai.png&quot;);
  background-size: cover;
  animation: fall linear forwards;
}
@keyframes fall {
  to {
    transform: translateY(110vh) rotate(360deg);
    opacity: 0.8;
  }
}
</style>
<script type='text/javascript'>//<![CDATA[
function createFlower(){
  const flower = document.createElement("div");
  flower.classList.add("flower");
  flower.style.left = Math.random() * 100 + "vw";
  flower.style.animationDuration = (4 + Math.random() * 6) + "s"; // tốc độ rơi ngẫu nhiên
  flower.style.opacity = Math.random();
  flower.style.transform = "rotate(" + (Math.random()*360) + "deg)";
  document.body.appendChild(flower);
  setTimeout(() => { flower.remove(); }, 10000); // Xóa sau 10s để không nặng
}
// tạo hoa mai rơi liên tục
setInterval(createFlower, 500);
//]]></script>
</body>
</html>

Anh em có thể trực tiếp click vào nút download trên khung code để tải trực tiếp file về hoặc là copy code ở đây đều được!

Cách cài đặt Template

Vào Blogger → Chủ đề → Chỉnh sửa HTML.
Xóa code cũ, dán code template mới vào.
Lưu lại và xem kết quả ngay trên blog.

👉 Lưu ý: Trong phần <head>, nếu có link Google Fonts nhớ đổi &subset= thành &subset= để tránh lỗi XML.

Kết luận

Với template này, blog của bạn sẽ tràn đầy không khí Tết, mang lại trải nghiệm thú vị cho độc giả. Anh em Blogger có thể sử dụng làm trang chờ Tết, đếm ngược sự kiện, hoặc landing page mini.

💬 Nếu thấy hay nhớ để lại bình luận, chia sẻ cho bạn bè nhé!