Cách lấy ảnh Thumbnail Youtube cho WordPress

Bạn đang xây dựng  một trang web mà cần sử dụng nhiều video, và cách tốt nhất để làm giảm tài nguyên của host và đạt hiệu quả cao chính là upload video lên youtube và chèn video youtube vào WordPress. Thế nhưng mỗ một bài viết đều cần có ảnh đại diện (ảnh Thumbnail) để những người truy cập vào website của bạn có thể thấy hình ảnh đầu tiên để có thể truy cập vào bài viết đó.

Mặc định trong WordPress không thể tự động lấy ảnh Thumbnail cho bài viết, Tuy nhiên WordPress lại được hỗ trợ nhiều sức mạnh bởi các Plugin, do đó để làm việc này tốt nhất là chúng ta sử dụng Plugin.

Thiết lập Video Thumbnails Plugin trong WordPress

Đầu tiên các bạn tải Plugin Video Thumbnail về tại đây sau đo cài đặt lên và cấu hình như  sau:

vào Setttings » Video Thumbnails

video-thumnails-options-general_imageTrong thẻ này là cấu hình mặc định xác định tất cả các hình thu nhỏ (Thumbnail) được tạo ra và đưa vào thư viện media trong wordpress.

Ở các lựa chọn tiếp theo, các bạn có thể thiết lập để quét tất cả các bài viết, các bài viết nào có video thì nó sẽ tự động lấy ra làm ảnh thumbnail. và kết quả sẽ là

generate-video-thumbnail_imageTrường hợp Theme WordPress của bạn không hỗ trợ Video Thumbnai

Trong trường hợp này bạn cần thêm vào dòng sau trong tập tin style.css

<?php the_post_thumbnail();

Các hình đại diện cho video nếu không có nút Play sẽ khiến cho các độc giả nhầm tưởng đó là bài viết văn bản chứ không phải video, và cách xử lý cho việc này như sau:

add-play-button_image

Bạn có thể tìm dòng mã băng cách vào Appearance > Editor > archive.php hoặc index.php hoặc content.php/category.php file. Tìm đến dòng có đoạn code sau:

<a href=”<?php the_permalink(); ?>”><?php the_post_thumbnail();

Và sau đó thay thế bằngdòng sau:

<? php if (in_category (‘video’)):>

? <a href=”<?php the_permalink(); ?> “> <? php the_post_thumbnail (); ?> <span class = “playbutton”> </ span> </a>

<? php khác:?>

? <a href=”<?php the_permalink(); ?> “> <? php the_post_thumbnail (); ?> </a>

<? php endif; ?>

Dòng mã trên chính là để hiển thị nút Play trên hình ảnh video, và nếu cần thiết các bạn có thể tùy chỉnh CSS cho nút play này, đây là một ví dụ:

.playbutton {
    background: url('https://example.com/wp-content/uploads/playbutton.png') center center no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 74px;
    height: 74px;
    margin: -35px 0 0 -35px;
    z-index: 10;
    opacity:0.6;
}
.playbutton:hover { 
    opacity:1.0;
}

Nhớ thay thế URL bằng URL của bạn nhé.

Kết luận:

Như vậy thông qua các bước trên, các bạn  hoàn toàn có thể lấy ảnh Thumbnail cho video Youtube một cách đơn giản, Ngoài ra bạn cũng có thể sử dụng cho video vimeo bằng cách làm tương tự như trên. Chúc các bạn thành công!

Chung hic

Tôi viết Blog với mong muốn giao lưu, học hỏi và chia sẻ những kiến thức mà tôi biết. Quan niệm của tôi là chia sẻ cũng là một cách để học và hiểu biết hơn. Tôi rất mong nhận được sự đóng góp cửa các bạn.

View more articles Subscribe
Leave a response comment6 Responses
  1. khanh
    Tháng Mười Hai 16, 14:45 khanh

    ko tim thay ham nay anh oi giup em voi blog em la muathamhat.com

    reply Reply this comment
  2. Xoan Nguyen
    Tháng Một 01, 17:52 Xoan Nguyen

    mình dùng genesis framework thì áp dụng để cho nó hiển thị nút play thế nào thế bạn

    reply Reply this comment
    • Chung hic
      Tháng Một 22, 10:52 Chung hic

      Theme Genensis Framwork cũng vẫn áp dụng cách trên để thêm nút Play bạn nhé. vì cơ chế hoạt động của các theme giống nhau

      reply Reply this comment
  3. Tuấn
    Tháng Tư 28, 21:01 Tuấn

    Bạn ơi… Mình làm để hiện playbutton ý nhưng ko được. Tìm trong archive.php, index.php, content.php/category.php file mà đều ko có đoạn mã như bạn đưa.
    Với cả Mình hỏi cái đoạn mã:

    ? <a href=” “>

    ? <a href=” “>

    +) Chỉ đoạn phim nào nằm trong Category (Theo mình hiểu là “Chuyên mục” mà mình tạo menu) thì mới hiện playbutton?
    +) nghĩa là gì bạn nhỷ 🙁

    reply Reply this comment
    • Tuấn
      Tháng Tư 28, 21:04 Tuấn

      Bạn ơi… Mình làm để hiện playbutton nhưng ko được. Tìm trong archive.php, index.php, content.php/category.php file mà đều ko có đoạn mã như bạn đưa.
      Với cả Mình hỏi cái đoạn mã:

      -? <a href=” “>

      -? <a href=” “>

      +) Chỉ đoạn phim nào nằm trong Category (Theo mình hiểu là “Chuyên mục” mà mình tạo menu) thì mới hiện playbutton?
      +) – nghĩa là gì bạn nhỷ 🙁

      reply Reply this comment
mode_editLeave a response

Your e-mail address will not be published. Also other data will not be shared with third person. Required fields marked as *

menu
menu