Tạo Slideshow bài viết mới nhất ngoài trang chủ Blogspot

Chúng ta thường thấy ngoài trang chủ các template blogspot hay có những slide bài viết đẹp và được trang trí với một thanh trượt nhằm mục đích làm đẹp và mượt blog.
 Hôm nay thủ thuật blog giới thiệu một dạng slide khá phổ biến mà các bạn thường thấy


Bắt đầu tiến hành thủ thuật (Nếu bạn nào chưa rành về blogspot thì nên Sao lưu template trước khi tiến hành thủ thuật)

Bước 1: 
  1. Đăng nhập vào blogger với tài khoản của bạn
  2. Sau đó nhấp vào Layout> Edit HTML, chọn kiểm tra mở rộng mẫu tiện ích con
  3. Đặt mã code sau đây trên ]]>
 #featured{margin-bottom:8px}
.sliderwrapper{position: relative;overflow: hidden;height: 240px}
.sliderwrapper .contentdiv{visibility: hidden;position: absolute;left: 0;top: 0;padding: 0px;height: 100%;}
.pagination{text-align: left;padding:8px 0px}
.pagination a{font-size:11px;color:#fff;padding: 3px 6px;background:#1b75d6}
.pagination a:hover, .pagination a.selected{color:#dedde5;background-color:#535352}
.featuredPost{width:360px;padding:10px 10px 0;background:#191919;filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;color:#dedde5;position:absolute;bottom:0}
.featuredPost a{color:#fff}
.featuredPost a:hover{color:#dedde5}
.featuredPost h2{margin:0;font-size:12px;line-height:1}
.featuredPost span{font-size:10px}
.featuredPost p{font-size:11px}

Bước 2: Đặt mã code sau đây trên 

Trong label1 = "misteri"; thay nhãn misteri bằng nhãn của bạn

mã code img width = "370" height = "240" là các thanh trượt chiều rộng và chiều cao, điều chỉnh mẫu của bạn.

Bước 3: Đặt mã code sau đây trên 

Bước 4: Bước cuối cùng, mà là để gọi thanh trượt để nó xuất hiện trên trang đầu của id='main-wrapper'> 



Bước 5: Bước cuối cùng Save / lưu mẫu, tạo ra thanh trượt hình ảnh dựa trên một danh mục cụ thể được hoàn tất.


Read more: http://www.share123.vn/2013/04/thu-thuat-tao-slideshow-bai-viet-moi.html#ixzz2UbqWKz27

0 comments: