Mạch Khóa Số Điện Tử Mạch Đếm Sản Phẩm Mạch Đèn giao thông Ngã Tư Mạch Trái Tim Final Mạch Trái Tim Final Mạch Trái Tim I Love U

May 16, 2011

Thêm Thông báo trượt Widget trong Blogger

SlideNote là một Plugin jQuery để hiển thị thông báo trượt trong blogger. Hiển thị thông báo (là một Widget) trên blog của bạn là một cách tuyệt vời để giới thiệu những thứ mà bạn nghĩ rằng độc giả của bạn nên được thông báo trước. Bạn có thể thấy rằng phổ biến nhiều blog bạn đang gặp là loại trượt thông báo ở khu vực có thể nhìn thấy khác với việc khi bạn di chuyển các trang về phía dưới cùng của trang, và nó đi ra vô hình khi bạn đang ở trên cùng của trang.




Chú ý; Nếu như bạn nào còn chưa thành thạo chèn Code thì nên Lưu temple lại rồi thực hiện cho thoải mái nha.

1.Đăng nhập vào blog của bạn từ Bảng điều khiển Blogger và đi đến Thiết kế chọn Chỉnh sửaHTML.

Bước 1. Sao chép mã dưới đây và dán nó ngay trước </ head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script src="https://sites.google.com/site/bloggerhowto/blogger-how-to/jquery.slidenote.min.js" type="text/javascript"></script>



Bước 2. Copy và dán mã dưới đây ngay trước ]]></b:skin>


/* -----CSS START------ */
.slidenote { width: 540px; height: 140px; background: #FBEC78; padding: 1em;
-moz-box-shadow: -0.2em -0.2em 0.7em #333; -webkit-box-shadow: -0.2em -0.2em 0.7em #333;}
.slidenote img { float: left; margin-left: -2em; margin-top: -2em; }
.slidenote img:hover { margin-top: -1.95em; }
/* ----- CSS END------ */


Bước 3. Bây giờ Sao chép mã dưới đây và dán nó ngay trước </ body>


<!-- BẢNG THÔNG BÁO CHẠY Start -->
<div class='slidenote' id='note'>
<div id='container'>
<h2>Welcome To Blog ChipKool</h2>
<span><em>Blog Chipkool đang trong giai đoạn xây dựng,sẽ còn nhiều sai sót mong các bạn thông cảm!Nếu bạn nào có niềm đam mê Điện Tử.Cùng Chip xây dựng blog Điện Tử.Các bạn liên hệ với mình qua YM:New_man9xone!!! :) </em></span>
<p>XEM 4RUM: <a href='http://clan-family.tk/'>Bắt Sóng Cảm Xúc</a>.......<br/><a href='http://www.chipkool.blogspot.com/2011/05/boi-tinh-yeu.html'>Bói Tình Yêu</a> | <a href='http://www.chipkool.blogspot.com/2011/05/boi-so-ien-thoai.html'>Bói Số Điện Thoại</a></p>
</div>
</div>
<script type='text/javascript'>
$(&#39;#note&#39;).slideNote({
closeImage: &#39;http://i1121.photobucket.com/albums/l502/chjpchjp1991/ICOlogout.png&#39;
});
</script>
<!-- BẢNG THÔNG BÁO CHẠY Ends -->



Lưu mẫu lại là xong!. Bạn có thể thay đổi giá trị của các lớp CSS theo nhu cầu của bạn. Di chuyển xuống cuối trang để dưới cùng của trang và bạn sẽ thấy thông báo.

Tải về toàn bộ plugin bao gồm cả mã nguồn minified-un, trang demo, README, và kiểu mẫu

Chúc các bạn thành công!^^

ChipKool (theo: bloghowtotips)

3 comments:

Anonymous said...
16/5/11
This comment has been removed by a blog administrator.
Lê Trung Hiếu said...
17/5/11

Xin gỏi chỗ bạn liên kết ở đâu thế...mình liên kết bạn rồi.

ChipKool_Online said...
17/5/11

Mình để liên kết cuối trang của mình đó.hihi.:).

Post a Comment

Bạn đọc hãy giúp chúng tôi xây dựng cộng đồng bằng cách để lại bình luận, chúng tôi luôn đón nhận mọi ý kiến của các bạn:
» Bình luận nghiêm túc và không chứa các liên kết quảng cáo.
» Vui lòng không Spam nhận xét với mọi hình thức.
» Rất mong bạn đề tên cho nhận xét của chính mình - Bằng cách chọn vào Tên/URL và điền tên bạn vào (Phần URL có thể bỏ trống ).

- Bạn có thể chèn Link nhạc (NCT), video(Youtube),Hình ảnh vào comment bằng cú pháp:
+ [youtube] Link video Youtube [/youtube].
+ [img] Link ảnh( định dạng PNG, JPG,GIF) [/img]
+Chèn link liên kết: <a href="LINK" rel="nofollow">Name</a>
-Bạn copy mã bên cạnh biểu tượng chèn vào nhận xét để bày tỏ cảm xúc!!

:) :( :)) :(( =)) =D> :D :P