Jplayer和wordpress 3.6.x

Question

我正在將我的Jplayer代碼嵌入到我的網站中，但是在wordpress安裝中已經存在jquery，但是當我在代碼中複製我的代碼時被破壞，因爲它沒有顯示帶有x的音量圖標。當我包含外部jquery腳本時，它會打破entrie網站，但播放器正常工作。有沒有更好的方式將jPlayer加入我的WordPress站點？

Answer 1

jPlayer script enqueueing 必須按照WordPress規則播放。最簡單的（也許是唯一的）方法是使用Shortcode。有很多開發人員，主要是主題開發人員，他們忽略了這個we don't dequeue the bundled jQuery version並加載了某個CDN的任何版本（至少，我們不知道我們在做什麼）。

下面是一個粗略的測試，短代碼回調函數必須被拋光很多。

public function plugin_setup() // hooked into plugins_loaded 
{ 
    add_action('wp_enqueue_scripts', array($this, 'enqueue')); 
    add_shortcode('jplayer', array($this, 'shortcode')); 
} 

public function enqueue() 
{ 
    wp_register_script(
     'sj-jplayer', 
     $this->plugin_url . 'js/jquery.jplayer.min.js', 
     array('jquery'), // <------- Dependencies 
     false, 
     true 
    ); 
    wp_register_style('sj-skin', $this->plugin_url . 'skin/blue.monday/jplayer.blue.monday.css'); 

    wp_enqueue_script('sj-jplayer'); 
    wp_enqueue_style('sj-skin'); 
} 

public function shortcode($atts, $content) 
{ 
    ob_start(); 
    require_once('html-shortcode.php'); 
    $var = ob_get_clean(); 
    return $var; 
} 

文件html-shortcode是基本適應像this demo代碼：

<?php 
/* 
* Prints the shortcode 
*/ 
?> 
<script type="text/javascript"> 
    jQuery(document).ready(function($) // <------ WP noConflict 
    { 
     $("#jquery_jplayer_1").jPlayer({}); 
    }); 
</script> 

<div id="jquery_jplayer_1" class="jp-jplayer"></div> 

我測試了這個jPlayer簡碼內的另一個，做了jScrollPane，和它的工作在iPad上。