サポート » 使い方全般 » 特定の固定ページのみ.js外部ファイルが読み込まれる様にしたい

  • 解決済 kiki222

    (@kiki222)


    WordPressを利用してサイトを構築したいと考えております。
    今まではhtmlで構築しておりましたので、
    ページのアドレスが変更されず
    それぞれの固定ページのアドレスが.htmlになる様に
    「Custom Permalinks」と言うプラグインを使用しています。

    そこで質問なのですが、
    特定の数ページのみのhead内に.jsファイルへの<link hrefの記載をしたいのですが、
    ファイル名を羅列するのではなくスマートに書く方法はあるのでしょうか?
    ページ名はart1.htmlからart15.htmlまでで、
    art.htmlには記載したくありません。
    現在は下記の様に記載しております。

    <?php if(is_page("art1","art2","art3","art4","art5","art6","art7","art8","art9","art10","art11","art12","art13","art14","art15")): ?>
    <script src="http://www.sample.com/js/jquery.fancybox.js"></script>
    <?php endif; ?>

    宜しくお願い致します。

5件の返信を表示中 - 16 - 20件目 (全20件中)
  • トピック投稿者 kiki222

    (@kiki222)

    nobita様
    書き方も良くして頂き、本当にありがとうございます!
    毎度毎度、本当に申し訳ないのですが
    教えて頂いたコードから自分なりに
    トップページにのみ挿入したいコードをwp_enqueue_scriptを足したりして見たのですが、
    まだまだ勉強不足で上手く表示する事が出来ません。
    トップページにのみhead内に

    <link rel="stylesheet" href="http://www.sample.com/css/jquery.bxslider.css" type="text/css">
    <script src="http://www.sample.com/js/jquery.bxslider.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      $('.bxslider').bxSlider();
    });
    </script>

    を挿入したいと思い、

    function my_add_style() {
    
        global $post;
    
        if ( has_shortcode( $post->post_content, 'myscripts' ) && is_singular() ) {
    
    			wp_enqueue_style('myfancyboxcss', 'http://www.sample.com/css/jquery.fancybox.css', array(), '2.1.5', 'screen');
    
    			wp_enqueue_script('myfancyboxjs', 'http://www.sample.com/js/jquery.fancybox.js', array(), '2.1.5', false );
    
    			// 第五引数falseで、ヘッダーに挿入
        } elseif  (is_front_page() ) {
    
    			wp_enqueue_style('mybxslidercss', 'http://www.sample.com/css/jquery.bxslider.css', array(), null, 'screen');
    
    			wp_enqueue_script('mybxsliderjs', 'http://www.sample.com/js/jquery.bxslider.min.js', array(), null, false );
    
        }
    
    }

    と加えてみたり、色々な場所に加えてみたりしたのですが
    fancyboxが上手く動作しなかったり、
    トップページのスライダーが動作しなかったりしました。
    本当に、何度も何度も申し訳ございませんが
    方法を教えて頂けないでしょうか?
    何卒、宜しくお願い致します。

    トピック投稿者 kiki222

    (@kiki222)

    nobita様
    出来ました!
    色々と試しているうちに、出来ました。
    とりあえず、ご報告します。
    後で、どの様に書いたかのコードを再度アップします。

    トピック投稿者 kiki222

    (@kiki222)

    nobita様
    返事を出していませんでした!
    申し訳ございません。
    現在、表示されるようになった書き方はこうです。

    <?php
    add_action( 'after_setup_theme', 'my_scripts_setup' );
    
    function my_scripts_setup() {
        add_action( 'wp_head', 'my_add_inline_script' );
        add_action( 'wp_head', 'my_add_inline_script2' );
       //wp_footerをwp_headに変更
        add_action( 'wp_enqueue_scripts', 'my_add_style' );
        add_shortcode( 'myscripts', 'my_add_script_source' );
    }
    
    function my_add_style() {
    
        global $post;
    
    if  (is_front_page() ) {
    
    			wp_enqueue_style('mybxslidercss', 'http://www.sample.com/css/jquery.bxslider.css', array(), null, 'screen');
    
    			wp_enqueue_script('mybxsliderjs', 'http://www.sample.com/js/jquery.bxslider.min.js', array(), null, false );
    
    			// 第五引数falseで、ヘッダーに挿入
        }
    
        if ( has_shortcode( $post->post_content, 'myscripts' ) && is_singular() ) {
    
    			wp_enqueue_style('myfancyboxcss', 'http://www.sample.com/css/jquery.fancybox.css', array(), '2.1.5', 'screen');
    
    			wp_enqueue_script('myfancyboxjs', 'http://www.sample.com/js/jquery.fancybox.js', array(), '2.1.5', false );
    
    			// 第五引数falseで、ヘッダーに挿入
        }
    }
    
    function my_add_script_source() {
        // jquery plugin等、依存関係があるときには、配列に handle を入れてください
    	// 実行するタイミングの関係で、ヘッダーに埋め込みは間に合わないようなので、空のショートコードにします。
    
    	return;
    }
    
    function my_add_inline_script() {
    
        $scripts= '$(document).ready(function() {
    		$(".fancybox").fancybox();
    	});';
    
        if ( wp_script_is( 'myfancyboxjs', 'done' ) ) {
    
            $html= '<script type="text/javascript">%1$s</script>'."\n";
    
            printf( $html, $scripts );
        }
    }
    
    function my_add_inline_script2() {
    
        $scripts= '$(document).ready(function() {
    		$(".bxslider").bxSlider();
    	});';
    
        if ( wp_script_is( 'mybxsliderjs', 'done' ) ) {
    
            $html= '<script type="text/javascript">%1$s</script>'."\n";
    
            printf( $html, $scripts );
        }
    
    }
    
    ?>

    何か問題ありそうでしょうか?
    もし、もっとスマートな方法があれば教えて頂けますと
    大変うれしいです。
    よろしくお願いいたします。
    色々とありがとうございました!

    コードを共有してくれてありがとうございます。

    サンプルURLについて、例示用URLに

    http://www.sample.com/

    が使われていますが、これは実在URLなので、

    http://www.example.com/

    IANAが、準備してくれているサンプル用のドメインを使うといいです。

    http://ja.wikipedia.org/wiki/Example.com

    トピック投稿者 kiki222

    (@kiki222)

    nobita様
    サンプルURLの件、分かりました。
    ありがとうございました。
    出来るだけ自分で解決していきたいですが、
    分からない事が多すぎてかなり立ち止っています。
    また、こちらで質問をする事があると思います。
    その時はまた宜しくお願い致します。
    ありがとうございました。

5件の返信を表示中 - 16 - 20件目 (全20件中)
  • トピック「特定の固定ページのみ.js外部ファイルが読み込まれる様にしたい」には新たに返信することはできません。