Để làm Slideshow cho ảnh riêng lẻ thì có vô số phần mềm chuyên dụng (Proshow Gold, Bolide Slideshow Creator...) nhưng nếu như chỉ cần để nhúng vào Blog ta có thể chỉ cần sử dụng cách làm Slideshow với code HTML thôi !
Có lần tôi đã hướng dẫn các bạn làm Slideshow với code HTML ( các bạn có thể kích vào dòng chữ màu cành bên trái để xem lại)
Tuy vậy trong bài đó chỉ làm Slideshow đơn thuần mà không có chú thích cho ảnh nên lúc xem người đọc không biết ảnh đó là gì. Vì vậy hôm nay tôi chia sẽ cho các bạn cách làm Slideshow từ ảnh riêng lẻ có kèm theo chú thích nhé !
Một số lưu ý như sau:
- Bạn phải tập hợp các ảnh mà bạn muốn làm Slideshow rồi Upload (tải lên) một dịch vụ nào đó cho link trực tiếp như Photobucket, Dropbox...). Nên nhớ là phải điều chỉnh các ảnh cho kích thước đồng đều trước lúc tải lên mạng ! Để có một slide đẹp thì ngay công việc chọn ảnh đồng đều là quan trọng !
- Chú thích cho ảnh không nên quá dài (2 dòng thôi), nếu không slide không hiện hết đâu.
- Bạn chỉ chèn được 1 slide trong bài viết thôi, nếu không sẽ xẩy ra xung đột (Slide thứ 2 không hiện được).
- Chú thích cho ảnh không nên quá dài (2 dòng thôi), nếu không slide không hiện hết đâu.
- Bạn chỉ chèn được 1 slide trong bài viết thôi, nếu không sẽ xẩy ra xung đột (Slide thứ 2 không hiện được).
Để tạo slide có kèm chú thích cho ảnh, các bạn dùng đoạn code nhúng mẫu sau đây và thay thế những chỗ cần thiết cho Slideshow của mình (link ảnh, màu chữ chú thích của ảnh kích thước ảnh..)
Các bạn chỉ cần thay:
- URL nếu cần gắn liên kết : là địa chỉ trang web nào đó mà bạn muốn khi kích vào ảnh đang hiện hành trong trình chiếu thì trang đó sẽ được mở ra. Cái này nếu không cần thì bạn có thể bỏ qua
- Link ảnh 1, Link ảnh 2... là link ảnh trực tiếp của ảnh mà các bạn đã tải lên dịch vụ ở bước trước. Cái này bắt buộc phải có
- Có bao nhiêu ảnh trong Slideshow thì các bạn thêm bấy nhiêu dòng <a href="URL nếu cần gắn liên kết"><img src="Link ảnh 1" alt="Chú thích cho ảnh"></a> vào nhé
Trong code trên những chỗ cần thiết để bạn thay đổi cho hợp vởi ý mình tôi đã có chú thích bên cạnh để các bạn dễ thay đổi thông số ở những dòng code đó !
Ngoài ra nếu bạn nào am hiểu hơn về HTML thì có thể chỉnh sửa ở file.js trong code để có thể điều chỉnh khoảng cách dừng lại lâu hơn để người xem có thời gian đọc hết những chú thích dài trong Slideshow.
Lưu ý là chỉnh sửa file.js phải rất thận trong nếu không code nhúng sẽ không hoạt động. Chỉnh sửa xong các bạn phải tải lên dịch vu như DropBox để có link file.js này ! Nếu không am hiểu lắm các bạn tạm dùng file.js của tôi cho nhàn (chắc không làm bạn vừa ý lắm với Slideshow của riêng mình).
- Sau khi đã làm các bước thay đổi trên, các bạn copy đoạn code này và nhúng vào bài viết ở chế độ HTML rồi xuất bản là OK !
Các bạn hãy xem tôi làm DEMO ở phía dưới (ảnh hơi dài, các bạn kéo xuống phía dưới để xem chú thích)
0 nhận xét:
Đăng nhận xét