Thứ Ba, 22 tháng 10, 2019

Trang trí giáng sinh với Ông già Noel cho Blogspot

Trời dần chuyển lạnh như đang chào đón những ngày Noel sắp đến. Chúng ta đã dần cảm thấy cuộc sống xung quanh như đang chuẩn bị chào đón ngày Giáng sinh này. Các bạn có thể thấy ở rất nhiều cửa hàng, trung tâm thương mại đã trang hoàng để chào đón giáng sinh. Đó là ở bên ngoài, bước lên mạng internet, sẽ không có gì lạ khi bắt gặp những trang web đã thay đổi một giao diện tràn ngập giáng sinh. Vậy những Blogger như chúng ta cũng phải theo cho kịp xu thế chứ?
Vì vậy hôm nay mình  sẽ hướng dẫn các bạn cách tạo Ông già Noel bay trên trang Blogspot của mình để góp phần trang trí website chào đón ngày Giáng sinh sắp đến. Cách thực hiện vô cùng đơn giản, chẳng tốn nhiều công sức hay gây khó khăn cho bất kỳ Blogger nào. Cùng theo dõi nhé:
– Truy cập vào trang quản trị Blogger, tiếp tục vào Mẫu (Template), chọn Chỉnh sửa HTML (Edit HTML)
– Click vào vùng code, tìm đoạn code sau: </body>
– Sau đó thêm đoạn code này vào ngay bên trên nó, đây chính là đoạn code tạo Ông già Noel với đàn tuần lộc bay qua bay lại trên blog của các bạn:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
$(function(){
$('html').append('<img id="halo" title="Happy Noel" style="cursor:pointer;position:fixed;z-index:99999" height="120" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxsyVwLESrxNCY9iU96F2MFP1C_0qiKEXOJewzUMd3TR2XAMv6AjOCxW9jbfG0ZOe7Ki6ILaf6F1sGHpl3fNoatSbPOKYrhoROz5WUZhaDoZ7OQoVTPicM09KHhN3lZ6P9twc73cssO8M/s1600/tuan_loc_cho_qua_cua_ong_gia_noel_anh.gif"/>')
setInterval(function(){
var $X=Math.ceil(Math.random()*$(window).width())
var $Y=Math.ceil(Math.random()*$(window).height())
$('img#halo').animate({'left':$X,'top':$Y},5000)
},5000)
$('img#halo').click(function(){
window.open('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxsyVwLESrxNCY9iU96F2MFP1C_0qiKEXOJewzUMd3TR2XAMv6AjOCxW9jbfG0ZOe7Ki6ILaf6F1sGHpl3fNoatSbPOKYrhoROz5WUZhaDoZ7OQoVTPicM09KHhN3lZ6P9twc73cssO8M/s1600/tuan_loc_cho_qua_cua_ong_gia_noel_anh.gif','')
})
})
//]]>
</script> 

Chú ý, nếu blog của bạn đã có 1 đoạn js tương tự (không cần giống phiên bản 1.10.2) thì bạn nên bỏ đoạn js màu xanh của mình đi.

– Lưu lại Cũng trong chủ đề giáng sinh, ở bài viết trước mình đã hướng dẫn cách tạo tuyết rơi rồi, kết hợp với bài viết tạo Ông già Noel  thật thú vị phải không nào. Các bạn  muốn có hiệu ứng tuyết roi cho blogspot thì xem tại đây .

Bài viết liên quan:

0 nhận xét:

Chào bạn nếu có bất cứ thắc mắc nào hãy để lại ý kiến. Nhận xét của bạn đều rất quan trọng, tôi rất vui nếu bạn để lại nhận xét của mình