web-dev-qa-db-ja.com

1ページのみのjQueryプラグイン/投稿

私はコーデックスの中のすべてのドキュメントを見ました、しかし、私はそれがうまくいかないので、私は何か間違ったことをしています!

私のウェルカムページにこのjQueryプラグイン( https://github.com/davidcrawford/typist-jquery )を実装したい( www.english.intermediavs.com )。

私は私のfunction.phpにこのコードを追加しました:

function my_typist() {
    if (!is_admin()) {

        wp_enqueue_script('jquery');

        wp_enqueue_script('jquery.typist', get_bloginfo('template_url') . '/wp-includes/js/jquery.typist.js', array('jquery'), '1.0', true);
    }
}
add_action('init', 'my_typist');

そして、私はまた、HTMLのrawプラグインを使って、 "welcome page"でこのコードを紹介しました:

<!--raw-->
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/wp-includes/js/jquery.typist.js">
jQuery(document).ready(function($) {

$('#terminal').typist({
  height: 300
});

$('#terminal').typist('Prompt')
  .wait(1500)
  .typist('type', 'greet')
  .typist('echo', 'Hello, world!')

});
</script>
<!--/raw-->

シモンズ:私はプラグインを使用していますGoogleのライブラリも使用します。

リンク: http://codex.wordpress.org/Using_Javascript

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

3
FZNB

1つのページでライブラリ "jquery.typist"のみを使用したい場合は、条件付きis_page()で追加するだけで済みますが、すべてのjsファイルを1つのファイルにまとめてください。それを圧縮してキャッシュします。複数の単一ファイルを使用するよりも、1つのjsファイルを圧縮してキャッシュすることをお勧めします。

また、ファイルを/ wp-includes/jsに置いたように見えますか?それはあなたのtheme-rootフォルダにあるべきです。

あなたの構造はmythemeのthemes/mythemeであると言うことができますあなたはjsフォルダを持っているべきです。もしそうなら、コードは次のようになります。

function wpse_75149() {
    // add  the id on the page whare you want the script
    if ( is_page('123') ) {

        wp_enqueue_script('jquery');

        wp_enqueue_script('jquery.typist', get_template_directory_uri() . '/js/jquery.typist.js', array('jquery'), '1.0', true);
        wp_enqueue_script('custom-script', get_template_directory_uri() . '/js/myscript.js', array('jquery');
    );
    }
}
// load js in footer 
add_action('wp_footer', 'wpse_75149');

Theme/jsフォルダーにmyscript.jsというjsファイルを作成して、以下を追加します。

jQuery(document).ready(function($) {

$('#terminal').typist({
  height: 300
});

$('#terminal').typist('Prompt')
  .wait(1500)
  .typist('type', 'greet')
  .typist('echo', 'Hello, world!')

});

http://codex.wordpress.org/Function_Reference/is_page - 右側のページにスクリプトを印刷するための条件付き http ://codex.wordpress.org/Function_Reference/wp_enqueue_script - スクリプトを読み込む方法

2

JSファイルの正しい場所を指定していません。あなたのファイルは

http://www.english.intermediavs.com/wp-includes/js/

でも、これ:

get_bloginfo( 'template_url') '/wp-includes/js/jquery.typist.js'

それにリンクしません、それはあなたの現在のテーマのディレクトリの中にwp-includesフォルダをロードしようとします、代わりにこれが欲しいです:

home_url() '/wp-includes/js/jquery.typist.js'

2
Steve Claridge