share

Thiết kế web cực dễ :)

Tạo slideshow dễ dàng với Skitter Slideshow

Lưu ý: Các link Mediafire trong các bài viết vẫn còn hoạt động. Các bạn copy link dán vào address của trình duyệt là dùng bình thường.

Bạn muốn trang web của mình có slideshow nhưng theme sẵn có, đừng lo bạn chỉ việc cài plugin Skitter Slideshow  là có ngay slideshow jquery đẹp, tiện dụng và quan trọng nhất là miễn phí ^^!

Download: http://wordpress.org/extend/plugins/wp-skitter-slideshow/

Demo: http://game.vuikhoe.net/

Sau khi kích hoạt xong bạn muốn slideshow hiển thị ở khu vực nào thì chèn đoạn mã sau:

<?php if ( function_exists('show_skitter') ) { show_skitter(); } ?>

Tiếp theo đến đoạn cấu hình. Chúng ta có 3 sự lự chọn cho những gì hiển thị trên slideshow.

  1. Chọn hình ảnh trong thư viện
  2. Chọn các bài trong 1 chuyên mục chỉ định
  3. XML

Bài viết này vuikhoe giới thiệu bạn sử dụng loại 1 vì khả năng tuỳ biến cao hơn và dễ dùng hơn.

Khi bạn chọn Media Library thì các hình ảnh có trong thư viện sẽ load ra cho bạn chọn, bạn click vào hình muốn dùng.

Lập tức sẽ hiển thị các lựa chọn cho hình của bạn. Ở mục Label sẽ hiện chú thích của hình trên slideshow Link là đường dẫn khi click vào hình và Animation là hiệu ứng chuyển của hình

Mục Customization là các tuỳ chỉnh cho slideshow. Vì tuỷ chọn rất nhiều nên mình chỉ giới thiệu các mục chính thôi nhé

  • Type of Navigation: lựa chọn nút chuyển trang
  • Crop image: Nếu bạn check vào thì ảnh đưa lên sẽ tự resize lại cho vừa với slide (nên check)
  • Interval: thời gian chuyển tính bằng mili giây
  • fullscreen: hiển thị full ảnh (không nên dùng)
  • hideTools: ẩn hiện nút chuyển
  • controls:ẩn hiện nút pause stop
  • controls_position: vị trí hiển thị của controls
  • preview: bật tắt chế độ xem trước khi rê vào nút chuyển

Đại khái là vậy :hihi: còn các phần như đổi màu nút, màu nền, thay đổi kích thước linh tinh thì các bạn tự vọc nhé

 

Sau một thời gian dài bận rộn và lười biếng Vuikhoe đã trở lại. Mình sẽ viết 1 loạt bài mới về kiếm tiền online, chỉnh sửa lại bài cũ và hệ thống lại để các bạn dễ tìm hiểu hơn. Mong nhận được ý kiến đóng góp và ủng hộ của các bạn :)

Nhanh tay mua host để được nhận ưu đãi cùng vui khoẻ dot net

10 comments

  1. Phong /

    Chào cậu, hiện tại mình đã chèn được slide. Nhưng mà nó k căn vào giữa trang. Mình phải làm thế nào :(

  2. Hoàng /

    bạn ơi cho mình hỏi, mình làm nó hiển thị ra ngoài đúng vị trí mà mình muốn rồi. cũng theo cách của bạn. Nhưng nó không hề load ảnh, ko có 1 tấm hình nào được index ra ngoài. Nó đen thui ah! bạn chỉ mình cách khắc phục với được ko?

    • Bạn phải chọn ảnh cho nó nó mới load chứ. Còn trường hợp thứ 2 là do xung đột code với 1 plugin nào đó.
      Ví dụ cái Jstackmenu của blog mình chẳng hạn nếu ko code lại thì nó cũng hỏng cái slideshoe, bạn phải tìm ra phần nào xung đột để điều chỉnh code lại.

  3. what /

    link theme day, ai add ho cai mediafire.com/?a2acj6ragsxla84

  4. what /

    thêm dòng vào file nào thế anh vui khỏe ? :udau:

  5. Nobita294 /

    Bạn nói là bạn còn học thi chắc chưa lớn tuổi nhỉ. Nhưng những bài viết của bạn thật hay và bổ ích. Cám ơn bạn nhiều và chúc bạn sức khỏe để đóng góp nhiều bài hay hơn nữa. Bạn có thể cho copy một số bài để làm phong phú blog của mình không?

  6. rất hay,do đang tìm tòi làm web nên có hơi quan tâm đến web của bạn,và đặt nhiều câu hỏi mong bạn thông cảm và không cảm thấy phiền.
    Sau khi đọc bài của bạn mình không hiểu khúc này:

    Sau khi kích hoạt xong bạn muốn slideshow hiển thị ở khu vực nào thì chèn đoạn mã sau:
    ?
    1

    Bạn có thể nói rõ hơn mình chèn đoạn mã này ở đâu,cho mình 1 ví dụ cho dễ hiểu nha.

    • Tuỳ themes và tuỳ vị trí bạn muốn chèn không thể chỉ cụ thể được bạn à. Bạn biết 1 ít php và css thì sẽ rất dễ dùng

    • Nguyễn Hoàng Nhã /

      Để hiển thị slideshow dưới Menu Theme như sau:
      Editor > Main Index Template > paste vào dưới đoạn mã “get_header();?>” như sau:

      get_header();?>

Leave a Reply

Vui lòng gõ tiếng Việt có dấu khi comment tại vuikhoe.net

Không nên chèn link vào comment, Akismet sẽ chặn comment của bạn vì cho là spam

:hihi: :chucmung: :udau: :hoi: :haha: :kiss: :chaymui: :sleep: more » Free WordPress Themes
Premium WordPress Themes