1. Hình thu nhỏ video trong wordpress là gì?
WordPress đi kèm với chức năng tích hợp để thêm hình ảnh nổi bật hoặc hình thu nhỏ của bài đăng và hầu hết các chủ đề WordPress đều hỗ trợ tính năng này. Tuy nhiên, nếu bạn muốn làm nổi bật nội dung video của mình từ YouTube , thì bạn cần giới thiệu nội dung đó bằng hình thu nhỏ của video.
2. Thiết lập Plugin Video Thumbnails trong WordPress?
Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Video Thumbnails . Sau khi kích hoạt plugin, bạn cần đi tới Setttings » Video Thumbnails để định cấu hình cài đặt plugin.
Ở đây có các tuỳ chỉnh các bạn nên chuyển sang tiếng Việt để dễ lựa chọn và check hơn.
3. Tạo hình thu nhỏ video trong bài viết WordPress
Bh hãy tạo hình thu nhỏ video bằng cách thêm URL video vào bài đăng WordPress. Để làm điều đó, bạn cần tạo hoặc chỉnh sửa một bài đăng WordPress và thêm URL video của bạn vào khu vực chỉnh sửa bài đăng. Sau khi xuất bản bài đăng, bạn sẽ thấy rằng plugin đã tạo hình thu nhỏ video cho bạn và thêm nó vào bài đăng của bạn.
4. Hiển thị Hình thu nhỏ Video trong Chủ đề WordPress của bạn
Plugin hình thu nhỏ video sử dụng chức năng Hình thu nhỏ của bài đăng WordPress. Hầu hết các chủ đề WordPress được thiết lập để tự động hiển thị hình thu nhỏ của bài đăng. Điều này có nghĩa là chủ đề của bạn sẽ tự động hiển thị hình thu nhỏ của video cùng với nội dung bài đăng hoặc đoạn trích của bạn. Tuy nhiên, nếu chủ đề của bạn không hiển thị hình thu nhỏ của video, thì bạn cần chỉnh sửa tệp chủ đề của mình và thêm mã này vào mẫu mà bạn muốn hiển thị hình thu nhỏ.
<?php the_post_thumbnail(); ?>
5. Cách thêm nút phát hình thu nhỏ video trong WordPress
Mục đích của việc này là giúp người dùng, người xem phân biệt hình thu nhỏ hình ảnh thông thường với hình thu nhỏ video của mình. Điều này sẽ cho người dùng của bạn biết rằng có một video trong bài đăng và họ có thể nhấp vào nút phát để xem bài đăng video.
Truy cập vào các tệp của chủ đề của bạn như index.php, archive.php, category.php, or content.php
tìm dòng mã này:
<a href=”<?php the_permalink(); ?>”><?php the_post_thumbnail(); ?></a>
Bây giờ chúng ta cần thay thế mã này bằng mã sau:
<?php
if
( in_category(
'video'
)) : ?>
<a href=
"<?php the_permalink(); ?>"
><?php the_post_thumbnail(); ?><span
class
=
"playbutton"
></span></a>
<?php
else
: ?>
<a href=
"<?php the_permalink(); ?>"
><?php the_post_thumbnail(); ?></a>
<?php
endif
; ?>
Bước tiếp theo là tải lên một tệp hình ảnh từ Media »add news . Hình ảnh này sẽ được sử dụng làm nút phát. Khi bạn đã tải lên tệp hình ảnh, hãy lưu ý vị trí tệp hình ảnh bằng cách nhấp vào liên kết Chỉnh sửa bên cạnh hình ảnh.
Bước cuối cùng là hiển thị nút play. Sử dụng CSS để hiển thị và định vị nút phát trên hình thu nhỏ của video. Để làm điều đó, bạn cần sao chép và dán mã CSS này vào biểu định của chủ đề bằng cách nhấp vào Appearance » Editor.
.playbutton {
background
:
url
(
'http://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
;
}
Đừng quên thay thế url hình nền bằng URL của tệp hình ảnh nút phát mà bạn đã tải lên trước đó. Vậy là xong chúc các bạn thành công.