Thiết kế web có khung phát nhạc MP3 và ZippyShare là một trong những kỹ thuật không hề mới, nhưng đối với nhiều người mới làm web có thể chưa biết tới.
Vì vậy, chúng tôi xin được viết một bài hướng dẫn cách làm cụ thể này. Bạn muốn có website chức năng nghe nhạc trong bài, đặc biệt là phát nhạc từ ZippyShare hoặc có thể phát nhạc từ một link mp3 bất kỳ, hãy làm theo hướng dẫn sau đây:
Quy trình thực hiện
Trong bài này chúng ta có thể làm rất đơn giản bằng chức năng custom field của WordPress. Để thuận tiện trong việc tạo field cũng như khuyến khích, mình sẽ sử dụng plugin Advanced Custom Field để làm.
Đầu tiên là chúng ta sẽ tạo 2 field khác nhau, một field để nhập link mp3 và một field là để nhập ID của bài hát trên ZippyShare. Sau đó chúng ta sẽ chèn cái player vào theme và gọi giá trị trong field ra để thay thế link cần phát nhạc là được. Quá dễ dàng.
Cách thực hiện
Trước tiên bạn tạo một field loại là Text với tên là link_mp3 như sau, các phần khác để nguyên cũng được:
>>> Xem thêm: Thiết kế web du lịch uy tín
Kế tiếp là tạo link ZippyShare với tên là link_zippyshare, cũng là loại Text luôn nhé
Tiếp theo, khi vào Post bạn sẽ thấy nó có hai khung nhập link như thế này:
– Tích hợp Player vào theme
Tích hợp MP3 Player (HTML5)
Bước này ta sẽ chỉ cần nhúng một file Javascript vào theme mà thôi chứ không làm gì nhiều đâu. Hãy tải file này về máy, giải nén nó ra và copy file audio.min.js và file player-graphics.gif trong thư mục audiojs vào thư mục theme đang sử dụng.
Sau đó mở file funtions.php chèn đoạn code sau vào:
/ * Mp3 Player lõi * /chức năng mp3_javascript () { wp_enqueue_script ('nghe kịch bản', get_template_directory_uri (). '/audio.min.js', array (), true);}add_action ('wp_enqueue_scripts', 'mp3_javascript');chức năng mp3_head () { tiếng vang '<script> audiojs.events.ready (function () { var như = audiojs.createAll (); }); </ script> ';}add_action ('wp_head', 'mp3_head');Kế tiếp mở file single.php, tìm the_content(); và thêm đoạn ở dưới lên trên hoặc xuống dưới nó.
<? php nếu (get_field ('link_mp3')) {?> <src audio = "<? php the_field ('link_mp3');?>" preload = "auto" /><? php}?>
Chèn player ZippyShare
Cũng mở file single.php và chèn đoạn dưới đây vào ngay bên trên hoặc dưới the_content():
<? Php if (get_field ('link_zippyshare')) {?> <Script type = "text / javascript"> var zippywww = "11"; var zippyfile = "<? Php the_field ('link_zippyshare');?>"; Var zippytext = "# 000000"; var zippyback = "# e8e8e8" ; var zippyplay = "# ff6600"; var zippywidth = 850; var zippyauto = false; var zippyvol = 80; var zippywave = "# 000000"; var zippyborder = "#cccccc";</ script >< script type = "text/javascript" src = "http://api.zippyshare.com/api/embed_new.js" ></ script ><? Php}?>Sau đó khi chèn nhạc ở phần ZippyShare, bạn chỉ cần điền ID của bài hát vào khung nhập link ZippyShare nhé. Ví dụ link một bài hát sẽ có dạng http://www11.zippyshare.com/v/97448700/file.html thì cái 97448700 chính là ID của bài nhạc.
Chỉ với những bước làm đơn giản như thế này bạn đã có một trang thiết kế web có tính năng nghe nhạc và phát nhạc từ ZippyShare.
