Hãy đăng ký thành viên để có thể dễ dàng trao đổi, giao lưu và chia sẻ về kiến thức đồ họa.
  1. Hãy đăng ký subscribe kênh Youtube mới của Việt Designer tại địa chỉ: Youtube.com/VietDesignerChannel để theo dõi các video về thiết kế đồ họa. Do trước đó kênh cũ bị Youtube quét không rõ lý do, trong thời gian chờ kháng cáo nếu các bạn thấy video trên diễn đàn bị die không xem được thì có thể vào kênh mới để tìm xem video sơ cua nhé.
    Loại bỏ thông báo

[VNXF] - Html5 video và audio đính kèm Player cho Xenforo (mp3, mp4, ogg,webm,wav)

Chủ đề thuộc danh mục 'Hướng dẫn - Thủ thuật Xenforo' được đăng bởi PCO, 3/2/16.

Lượt xem: 5,526

  1. PCO Thành viên cấp 2

    Đây là một cách nhanh chóng và dễ dàng để chơi file đính kèm âm thanh và các tập tin video trong diễn đàn của bạn thay vì tải về nó.

    Tôi đã gỡ bỏ các player bây giờ và nó hoạt động hoàn toàn vào html5 nhưng có thể không hoạt động trên một số trình duyệt cho một số phần mở rộng.

    Đầu tiên: thêm phần mở rộng tập tin đính kèm mà bạn muốn trong trang tùy chọn tập tin đính kèm, như mp3, mp4, webm. Những điều khác không phải là phổ biến.

    Trong template "attached_files" tìm:
    (appearance > templates > attached_files)
    Code:
    <h6 class="filename"><a href="{xen:link attachments, $attachment}" target="_blank">{$attachment.filename}</a></h6>
    Bên dưới nó thêm code sau cho audio player:
    Code:
    <xen:if is="{$attachment.extension} == 'mp3' ">
         <audio  width="auto" height="24" src="{xen:link attachments, $attachment}" controls="controls" preload="none">
    
         </audio>
    </xen:if>
    Thay mp3 với wav nếu bạn muốn

    Tôi không chắc chắn làm thế nào để thêm nhiều phần mở rộng tập tin đính kèm trong code này như thể hiện bên dưới câu này:
    Code:
    <xen:if is="{$attachment.extension} == 'mp3' ||'wav' ">
    Đối với một số trình duyệt một số phần mở rộng có thể không làm việc vì vậy tôi đề nghị bạn đi đến địa chỉ này để xem các trình duyệt hỗ trợ những gì phần mở rộng tập tin đính kèm w3schools.com/html/html5_audio.asp

    Bạn cũng có thể thêm các tương tự cho một player đính kèm video như này, thêm nó bên dưới code audio nếu bạn thêm một trong đầu tiên:
    Code:
      <xen:if is="{$attachment.extension} == 'webm' ">
         <video  width="auto" height="240" src="{xen:link attachments, $attachment}" controls="controls" preload="metadata">
    
         </video>
    </xen:if>
    Thay webm với mp4 hay ogg nếu bạn muốn.

    Một số tập tin đính kèm có thể không làm việc một lần nữa trong các trình duyệt nhất định để kiểm tra: w3schools.com/html/html5_video.asp

    Các thuộc tính preload làm cho nó để băng thông của bạn sẽ không bị lãng phí. Tôi đã sử dụng siêu dữ liệu cho các đoạn video để mọi người có thể nhìn thấy một hình ảnh thu nhỏ. Nhưng bạn có thể chỉ là một cách dễ dàng đặt nó là "none" như âm thanh nếu bạn muốn.

    đây là một số thuộc tính khác bạn có thể thêm hoặc loại bỏ:
    Bạn có thể gây rối xung quanh với css chính mình, nhưng tôi đã làm nó như thế này, trong attached_files.css tìm:
    Code:
    .attachment
            {
                float: left;
                width: 50%;
                max-width: 300px;
            }
    Thay thế bằng:
    Code:
    .attachment
            {
                float: left;
                width: 100%;
                max-width: 100%;
            }
    Bây giờ bạn nên có một cái gì đó như thế này.

    assolbD.png
    Chúc các bạn thành công.

    Nguồn: VNXF.VN​

    ...
  2. Cổ Thiên Lạc

    Cổ Thiên Lạc Thành viên cấp 1

    Bác để nguyên tiếng Anh đọc cho dễ hiểu, đọc tiếng Việt dịch kiểu Google translate khó hiểu wá @@

Ủng hộ diễn đàn