web-dev-qa-db-ja.com

bootstrap in Wordpressプラグイン開発に含める方法は？

プラグインを開発していますが、プラグインにbootstrapを含めたいと思います。含めるのに最適な方法は何ですか？これに関連するものは見つかりませんでした。これまでにいくつか見つけました。 bootstrapプラグイン、必要ありません。プラグインにbootstrapのjs要素とcss要素を含める必要があります。bootstrapは初めてです。

また、WPテーマに含めるようなものを試しましたが、機能しませんか？

あなたがより多くの情報を必要とするならば、私に尋ねてください、私はあなたに提供します

WPテーマをメインファイルindex.phpに入れようとしました：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<!-- Latest compiled and minified JavaScript -->
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
wordpresstwitter-bootstrapincludewordpress-plugintwitter-bootstrap-3
13
user3042036

Jsにはwp_register_script()を使用してからwp_enqueue_script()を使用する必要があります。

Cssにはwp_register_style()を使用してからwp_enqueue_style()を使用する必要があります。

次のjsの例を参照してください...

wp_register_script('prefix_bootstrap', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js');
wp_enqueue_script('prefix_bootstrap');

そして今、cssについても同じことをします...

wp_register_style('prefix_bootstrap', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
wp_enqueue_style('prefix_bootstrap');

Ajaxを使用する場合に備えて、これらを再利用可能な方法で配置することをお勧めします。このように、ajaxメソッド内のすべてのスクリプトまたはスタイルシートを再リストする必要はありません。

function prefix_enqueue() 
{       
    // JS
    wp_register_script('prefix_bootstrap', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js');
    wp_enqueue_script('prefix_bootstrap');

    // CSS
    wp_register_style('prefix_bootstrap', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
    wp_enqueue_style('prefix_bootstrap');
}

「prefix_」を使用すると、競合を防ぎ、長期的には問題を回避できます。

12
zgr024

'wp_head'アクションを使用して、ページが読み込まれるたびにサイトのヘッダーにコードを追加できます。次のようなものをプラグインに入れます。

    add_action('wp_head','head_code');

function head_code()
{

$output = '<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>';    
$output .= '<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>'; 
$output .= '<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>';

echo $output;

}
0
Marc