JWplayer là một chương trình flash mã nguồn mở dùng để phát nhạc và video được sử dụng phổ biến tại các trang web và diễn đàn.
Bài viết này mình xin hướng dẫn cách tạo và sử dụng JWplayer để phát video trong Blogspot
1. Tạo một player tại trang chủ JWplayer
Đi vào trang JWplayer và tự tạo cho mình một tài khoản (miễn phí hay có phí là tùy bạn ).
Sau khi bạn tạo thành công và đăng nhập vào thì sẽ có giao diện như thế này.
Tiếp đó bạn kéo xuống Tab PLAYERS, chọn MANAGER, chọn tiếp NEW PLAYER để tự tạo player JWplayer có giao diện tùy chỉnh theo ý riêng mình!
Một số lưu ý khi tạo JWplayer
1. Đặt tên cho player của bạn (chủ yếu để phân biệt với mấy player khác của bạn chính bạn mà thôi, nó không hiển thị ở đâu cả)
2. Các thiết lập cơ bản:
- Dimension (kích thước):
- Rresponsive : theo một tỷ lệ nhất định, như trong hình là 16:9.
- Fixed : tự chỉnh kích thước cho phù hợp với kích thước player bạn thiết lập trong bài đăng blogspot của bạn.
- Playback Option (tùy chòn về việc phát video) gồm:
- Autostart: tự động bắt đầu phát video khi load trang xong
- Loop content: phát lặp lại
- Mute on start: lúc bắt đầu thì tắt tiếng.
- Preload: thiết lập về có cho phép load trước nội dung video không khi mà người xem vẫn chưa chọn bắt đầu phát.
- Rendering: Có mặc đinh phát video với Flash không (Nếu phát bằng Flash thì sẽ ngăn chặn được quảng cáo hiển thị trên video, còn nếu phát bằng HTML5 thì có thể cài đặt quảng cáo trên video được).
3. Design: (phần quan trọng cho bạn)
Đây là phần để bạn thiết kế giao diện cho JWplayer của bạn, nó rất trực quan và bạn hoàn toàn có thể tự làm, có gì thì cùng trao đổi.
4. Sharing (phần chia sẻ)
Phần này thì mình nghĩ là ít sử dụng, nếu được chọn thì trình phát video của bạn sẽ có thêm nút share để chia sẻ video với mọi ngưởi.
5. Analytics (phân tích)
Bạn sẽ được Google Analytics theo dõi, phân tích và đánh giá các số liệu liên quan đến trình phát này của bạn
6. Advanced (nâng cao)
Bạn không nên chạm đến phần này nếu không hiểu nó, nói chung là về vấn đề bản quyền .
7. Save Changes
Nhấp vào đây để lưu lại trình JWplayer của bạn.
Ok, vậy là bạn đã tạo xong cho riêng mình một trình JWplayer, việc còn lại của bạn là upload chúng lên Host của riêng mình và có thể chạy được rồi.
2. Sử dụng trình player mà bạn vừa tạo
Sau khi bạn đã tạo ra được player rồi thì sẽ có 2 sự lựa chọn cho bạn ở đây.
Cách 1: Bạn sử dụng luôn tài khoản JWplayer này của mình và sử dụng nhờ host của trang JWplayer luôn để làm nơi chứa mọi thứ về player mà bạn đã tạo, và sử dụng nó trong blogspot của mình.
Cách 2: Bạn muốn sở hữu riêng player này, không muốn lệ thuộc vào trang jwplayer nữa. Bạn sẽ upload những thứ cần thiết lên host riêng và sử dụng từ đó.
Đối với cách 1: Sử dụng host của JWplayer
Với cách này thì khá đơn giản. Đầu tiên, sau khi đã tạo thành công player cho mình thì bạn truy cập TOOLS của tab PLAYER .
Sau đó bạn click vào "Player Title" để chọn tên JWplayer mà bạn muốn đưa vào blog. như trong ví dụ phía trên của mình thì player là mufcmatch
Tiếp theo bạn copy đường dẫn như hình dưới đây
Như vậy phần lấy link nguồn đã xong, tiếp theo ta sẽ thực hiện khai báo trong template của blogspot. Để thực hiện thì bạn truy cập vào blogspot của bạn, vào phần Mẫu -> Tùy chỉnh HTML
(Nếu bạn sợ hỏng template của mình thì nên chọn sao lưu template trước khi vào tùy chỉnh HTML) Bây giờ sau khi bạn đã vào phần code thì hãy nhấp chuột vào code, ấn Ctrl + F để tiến hành tìm kiếm trong code, và tiến hành tìm kiếm cụm từ </head>
Việc này là nhằm ta thêm vào phần đầu của blogspot lệnh gọi đến tập tin JWplayer. Khi đã tìm thấy thì bạn hãy chèn dòng code sau vào trên dòng </head> đó.
Lưu lại template, như vậy là đã hoàn tất.
Đối với cách 2: Tự sử dụng host của chính mình
Đầu tiên bạn hãy dơwnload file *.zip của JWplayer về ( tại vùng khoanh đỏ như hình dưới)
Sau khi đã tải về thì bạn chọn giải nén ra và vào thư mục của nó mở file jwplayer.js ra, bạn nên mở với một trình soạn thảo code sẽ dễ xem hơn.
Sau đó, bạn copy đường dẫn như hình và đi đến đại chỉ đã copy đó
Sao chép toàn bộ nội dung trong trang như hình dưới
Sau đó quay lại file jwplayer.js bạn đã mở. Xóa hết các thứ trong file jwplayer.js này đi và dán những gì vừa sao chép được
Sau khi làm xong thì bạn quay lại trình duyệt và chọn copy đoạn mã bản quyền tại vùng khoanh đỏ như hình dưới.
Quay lại tập tin JWplayer của bạn, kéo đến cuối trang, và paste đoạn mã bản quyền vừa copy vào vị trí thích hợp như hình dưới đây.
Bên cạnh đó, tại những dòng phía dưới thì bạn cũng có thể thiết lập thông số mặc định cho trình phát của bạn như: có lặp lại hay không, chiều cao, chiều rộng mặc định, có hiển thị tiêu đề và mô tả hay không,...
Sau khi đã làm xong hết thì bạn lưu lại. Ok, tới upload thôi.
Bạn hãy upload cả thư mục mà bạn đã giải nén lên host của bạn. Sau đó copy lấy đường dẫn cập đến tập tin jwplayer.js trong thư mục đã upload.
Sau đó bạn truy cập vào blogger, vào phần tùy chỉnh HTML như cách thứ nhất, cũng tìm cụm từ </head> và chèn đoạn code sau vào phía trên thẻ </head> như cách 1:
Lưu lại mẫu và hoàn thành.
3. Đoạn mã đăng video trong bài đăng blogspot:
Vào ngay vấn đề chính, đây là đoạn mã chúng ta cần:
Trong đó, videoPlayer là tên tùy ý bạn đặt
file: "link video" là để cung cấp đường dẫn đến video muốn chèn.
Những thông số khác thì mình đã để trong phần cài đặt mặc định phía trên mà mình có nói nên ở đây mình không nhắc lại nữa. Ngoài ra, nếu bạn muốn tùy chỉnh lại JWplayer cho riêng bài đăng cụ thể thì cứ việc thêm thiết lập vào ở đây.
Vậy là hoàn tất, bạn cứ việc lưu lại bài đăng và video của bạn đã được chèn.
Chúc bạn thành công!
Không có nhận xét nào
Đăng nhận xét