Tao hieu ung hinh anh dep trong blog Wordpress voi plugin Lightbox JS 2.04 Hôm nay mình xin giới thiệu với các bạn plugin Lightbox JS 2.04 cho blog Wordpress, nó dùng để hiển thị hình ả
Trang 1Tao hieu ung hinh anh dep trong blog Wordpress voi
plugin Lightbox JS 2.04
Hôm nay mình xin giới thiệu với các bạn plugin Lightbox JS 2.04 cho blog
Wordpress, nó dùng để hiển thị hình ảnh bằng cách che trang web hiện tại và tạo hiệu ứng để hiển thị Thật khó có thể giải thích, bạn có thể xem rõ hơn bằng cách xem demo sau (click vào ảnh):
Cài đặt:
Để có được hiệu ứng như vậy đầu tiên các bạn download plugin Lightbox JS 2.04 tại đây và giải nén ra
Trang 2Tiếp theo upload file “lightbox.php” và thư mục “lightbox” vào
“/wp-content/plugins/” rồi activate plugin này.
Sử dụng:
Có 2 cách sử dụng đó là sử dụng hiệu ứng cho từng ảnh riêng lẻ hay cho từng nhóm ảnh
1 Để sử dụng cho từng ảnh riêng lẻ thì thêm thuộc tính rel=”lightbox” vào thẻ a như sau:
<a href= "images/image-1.jpg" rel= "lightbox" title= "Tieude">image1</a>
Ví dụ rõ hơn nè, khi bạn chèn một hình vào bài viết thì chèn luôn cả link đến hình ảnh đó, xem đoạn code sau:
<a href= "http://www.blogthuthuat.com/wp-content/uploads/2008/03/dno061.jpg" title= "dno061.jpg"
rel= "lightbox">
<img src= "http://www.blogthuthuat.com/wp-content/uploads/2008/03/dno061.jpg" alt= "dno061.jpg"
width= "100" />
</a>
2 Tương tự như vậy, để sử dụng cho từng nhóm ảnh thì thêm thuộc tính
rel=”lightbox[roadtrip]” vào thẻ a như sau:
<a href= "images/image-1.jpg" rel= "lightbox[roadtrip]">image1</a>
<a href= "images/image-2.jpg" rel= "lightbox[roadtrip]">image2</a>
<a href= "images/image-3.jpg" rel= "lightbox[roadtrip]">image3</a>