Trong không khí xuân đến, tết về thì việc trang trí thêm một chút cho Blog của bạn sẽ giúp mọi người cảm thấy ấm áp, vui vẻ và bạn đọc hơn. Nếu bạn đang sở hữu một blog hay website thì ngay bây giờ hãy bắt tay vào trang trí cho ngôi nhà thân yêu của mình thôi nào!
Tổng hợp Code trang trí Tết cho blogspot. |
Thông thường, khi trang trí tết cho các blog chúng ta thường sử dụng cành đào, cành mai, câu đối hay pháo hoa... chỉ cần trang trí đơn giản như vậy thôi cũng đủ làm nên không khí ngày tết cho trang blogspot của bạn rồi.
Code treo một nhành Mai trượt dọc
Các bạn sử dụng đoạn code sau dán trên thẻ </body>:
<b:if cond='data:blog.isMobileRequest == "false"'> <a href='/' style='display:scroll;position:fixed;Top:0px;left:5px;z-index: 999;'><img src='https://i.imgur.com/BTNPbnb.png' style='width:350px;'/></a> </b:if>
Có thể sửa css và link ảnh theo ý bạn cho phù hợp với Blog của mình.
Code Pháo Hoa cho blogspot
Tiếng pháo trong ngày Tết không chỉ mang ý nghĩa xua đuổi tà ma hay những điều xui xẻo, mà đằng sau ánh sáng lấp lánh trong tiếng nổ giòn ấy là những ước mong về năm mới bình an, may mắn.
Các bạn làm theo bài chi tiết này: Javascript code hiệu ứng pháo hoa cho blogspot
Code treo Câu đối Tết ý nghĩa
Phần này sẽ cho các bạn ý tưởng lời chúc năm mới với bộ câu đối miễn phí. Code cũng dễ làm chỉ với CSS và HTML thôi.
Code câu đối Tết cho blogspot. |
Viết CSS cho câu đối
Các bạn chèn đoạn code dưới đây vào trên thẻ ]]></b:skin> hoặc có thể cho nó vào cặp thẻ <style>...</style> chèn trên thẻ </body> cũng được:
.atn-tet-left{
position:fixed;
top:100px;
left:0;
z-index:0;
width:180px;/*kích thước câu đối bên trái, bạn có thể tăng hoặc giảm*/
}
.atn-tet-right{
position:fixed;
top:100px;
right:0;
z-index:0;
width:180px;/*kích thước câu đối bên phải, bạn có thể tăng hoặc giảm*/
}
/* ẩn banner khi kích thước màn hình nhỏ hơn 15 inch để tránh cho mất nội dung*/
@media(max-width:1524px){
.atn-tet-left,.atn-tet-right{
display:none!important}}
Hiển thị câu đối ra Blog
Các bạn sử dụng các cặp câu đối phía dưới đây để chèn trên thẻ </body> hoặc có thể bỏ vào widget HTML/Javascipt:
1. Cầu được ước thấy xuân như ý – Phúc lộc ngập tràn tết phồn vinh
<a class="atn-tet-left" ><img src="https://i.imgur.com/snmBZQe.png"/></a>
<a class="atn-tet-right" ><img src="https://i.imgur.com/R9gV6Z4.png"/></a>
2. Tân niên, tân phúc, tân phú quý – Tấn tài, tấn lộc, tấn bình an
<a class="atn-tet-left" ><img src="https://i.imgur.com/aUFWu51.png" /></a>
<a class="atn-tet-right"><img src="https://i.imgur.com/G8FtAi5.png" /></a>
3. Chúc tết đến trăm điều như ý – Mừng xuân sang vạn sự thành công
<a class="atn-tet-left" ><img src="https://i.imgur.com/ae4u53D.png" /></a>
<a class="atn-tet-right" ><img src="https://i.imgur.com/TXg70sn.png" /></a>
Chỉ vài bước đơn giản vậy thôi là các bạn có thể làm xong phần Câu đối cho Blog của mình rồi.
Hiệu ứng hoa mai vàng rơi
Ngoài ra, các hiệu ứng hoa anh đào rơi, hiệu ứng lá rơi (khi trời chuyển sang thu), hiệu ứng tuyết rơi, hiệu ứng sao rơi,…Thì cũng từ một đoạn code này ra.
Các bạn tham khảo bài này: Trang trí tết blog: hiệu ứng hoa mai vàng rơi tùy chỉnh
Popup chúc mừng năm mới
Đây có lẽ là một ý tưởng mới để tạo trang trí tết cho blogspot. Popup có nút tắt, có kết hợp trình phát nhạc. Tuy nhìn đơn giản nhưng nó là sự mới lạ.
Tạo Popup chúc mừng năm mới. |
Xem tại đây: Tạo popup Happy New Year có nhạc cực chất cho Blogspot
Background image không khí tết đơn giản
Background image này gồm có hoa mai, hoa đào, câu đối, fillter màu đỏ. Nhìn vào là thấy tết rồi.
Code:
body {background:url(https://i.imgur.com/NZh5sJb.png) no-repeat center fixed;background-size:cover;background-color: #3333330f;}
Template đếm ngược tết
Trước đây, thứ được tìm kiếm nhiều nhất đó là template blogspot đếm ngược thời gian đến tết. Còn nay thì ko biết sao nhưng mà thôi cứ cho vô đây luôn đi.
Lấy theme: Share Blogger Template Countdown Happy New Year
Lời kết
Đối với Blogspot thì khá là đầy đủ để trang trí Tết rồi đó. Năm mới sắp đến, sẵn đây xin chúc tất cả mọi người một năm mới thật nhiều niềm vui, may mắn và nhiều sức khỏe nhé. Xin cảm ơn!