wordpressでサイトを管理できるようにするために、html→phpの移行をしております。
その際、wordpressでのjsの読み込みで、toTopのボタン以外のjsが読み込めないのはなぜでしょうか?
使用テーマは「_S」
http://underscores.me/
になります。
恐れ入りますが、何卒よろしくお願いいたします。
以下がfooter.phpです
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type='text/javascript' src='./library/js/jquery.js'></script>
<script type='text/javascript' src='./library/js/jquery-migrate.min.js'></script>
<script type='text/javascript' src='./library/js/libs/modernizr.custom.min.js'></script>
<script src="./library/js/jquery.matchHeight.js" type="text/javascript"></script>
<script src="library/js/jquery.sliderPro.min.js" type="text/javascript"></script>
<!-- Sidrスクリプトの呼び出し -->
<script src="./library/js/jquery.sidr.min.js"></script>
<script>
jQuery(document).ready(function() {
jQuery('#simple-menu').sidr();
});
</script>
<!-- /sidr -->
<script>
//スムーズスクロール
jQuery(function(){
// #で始まるアンカーをクリックした場合に処理
jQuery('a[href^=#]').click(function() {
// スクロールの速度
var speed = 400; // ミリ秒
// アンカーの値取得
var href= jQuery(this).attr("href");
// 移動先を取得
var target = jQuery(href == "#" || href == "" ? 'html' : href);
// 移動先を数値で取得
var position = target.offset().top - 40;
// スムーススクロール
jQuery('body,html').animate({scrollTop:position}, speed, 'swing');
return false;
});
});
</script>
<script>
//ページ間スムーススクロール
jQuery(function(){
var url = $(location).attr('href');
if (url.indexOf("?id=") == -1) {
// スムーズスクロール以外の処理(必要なら)
}else{
// スムーズスクロールの処理
var url_sp = url.split("?id=");
var hash = '#' + url_sp[url_sp.length - 1];
var tgt = $(hash);
var pos = tgt.offset().top - 40;
$("html, body").animate({scrollTop:pos}, 400, "swing");
}
});
</script>
<!-- toTop -->
<script type="text/javascript">
jQuery(function() {
var pagetop = jQuery('.toTop');
jQuery(window).scroll(function () {
if (jQuery(this).scrollTop() > 150) {
pagetop.fadeIn();
} else {
pagetop.fadeOut();
}
});
pagetop.click(function () {
jQuery('body, html').animate({ scrollTop: 0 }, 500);
return false;
});
});
</script>
<script>
jQuery('#sidr-menu-button').sidr({
name: 'sidr-nav',
source: '.wrap_nav',
speed : 500,
side : 'right'
});
</script>
<script type='text/javascript' src='./library/js/scripts.js'></script>
<script>
jQuery(function() {
jQuery('.footer-col').matchHeight();
});
</script>
<!-- Chromeでリンクが機能しないバグを修正するスクリプト -->
<script>
jQuery(document).ready(function(){
if(jQuery(window).width() > 767) {
// ウインドウサイズの幅が767ピクセルよりも大きい場合
jQuery("#top-slider .sp-slide a").each(function(){
jQuery(this).addClass("sp-selectable").css("cursor","pointer");
});
}
})
</script>
<script>
jQuery(document).ready(function(){
jQuery( '#top-slider' ).sliderPro({
width: 1200,
height: 300,
arrows: true,//矢印の有無
buttons: true,//ページャーの有無
autoplay: true,//自動スライドか否か
loop: true,//ループ再生か否か
visibleSize: '100%',//前後のスライドを表示(?)
forceSize: 'fullWidth' ,//幅いっぱいに表示
});
});
</script>
以下がfunctions.phpです
/**
* Enqueue scripts and styles.
*/
function kaimasu_net_scripts() {
wp_enqueue_style( 'style.css', get_stylesheet_uri() );
wp_enqueue_style( 'hover-min.css', get_stylesheet_uri() . '/library/css/style.css' );
wp_enqueue_style( 'font-awesome.min.css', get_stylesheet_uri() . '/library/css/font-awesome.min.css' );
wp_enqueue_style( 'slider-pro.min.css', get_stylesheet_uri() . '/library/css/slider-pro.min.css' );
wp_enqueue_style( 'jquery.sidr.light.css', get_stylesheet_uri() . '/library/css/jquery.sidr.light.css' );
wp_enqueue_style( 'sidr-menu.css', get_stylesheet_uri() . '/library/css/sidr-menu.css' );
// WordPress本体のjquery.jsを読み込まない
wp_deregister_script('jquery');
// jQueryの読み込み
wp_enqueue_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js', "", "170324", true );
wp_enqueue_script( 'jquery.js', get_template_directory_uri() . '/library/js/jquery.js', array(), '170324', true );
wp_enqueue_script( 'jquery-migrate.min.js', get_template_directory_uri() . '/library/js/jquery-migrate.min.js', array(), '170324', true );
wp_enqueue_script( 'modernizr.custom.min.js', get_template_directory_uri() . '/library/js/libs/modernizr.custom.min.js', array(), '170324', true );
wp_enqueue_script( 'jquery.matchHeight.js', get_template_directory_uri() . '/library/js/jquery.matchHeight.js', array(), '170324', true );
wp_enqueue_script( 'jquery.sliderPro.min.js', get_template_directory_uri() . '/library/js/jquery.sliderPro.min.js', array(), '170324', true );
wp_enqueue_script( 'jquery.sidr.min.js', get_template_directory_uri() . '/library/js/jquery.sidr.min.js', array(), '170324', true );
wp_enqueue_script( 'scripts.js', get_template_directory_uri() . '/library/js/scripts.js', array(), '170324', true );
wp_enqueue_script( 'kaimasu-net-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );
wp_enqueue_script( 'kaimasu-net-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );
}
add_action( 'wp_enqueue_scripts', 'kaimasu_net_scripts' );
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
checkベストアンサー
+1
footer.phpは置き換えました!
元テーマのfooter.phpを置き換えてしまっているのであれば、そもそもHTMLの構造自体が崩れてしまっていませんか?
それ以外に、wp_footer();
が実行されないと wp_enqueue_script
のフックがフッター時に働きません。
また、wp_enqueue_script
でスクリプトを登録しているにもかかわらずfooter.phpに script
タグが大量にありますが、重複して指定する必要はありませんし、パスが相対パスになっているのでページの階層によっては取得に失敗するはずです。
jQueryが2回登録されていたり、jQueryに依存関係にあるライブラリに適切な指定がされていなかったりもしますね。
【functions.phpでJSやCSSを一元管理する| WordPressテックラボ | [Smart]】
http://rfs.jp/sb/wordpress/wp-lab/wp_enqueue_script.html
【WordPress で CSS、JavaScript ファイルを読み込む正しい方法 | EastCoder;】
http://eastcoder.com/2014/07/proper-way-to-enqueue-scripts-and-styles-with-wordpress/
複雑なテーマはテーマを触り慣れていないとカスタマイズが難しかったりします。一度単純なテーマを自作し、必要なテンプレートを作ってから、高機能テンプレートをカスタマイズするのがお勧めです。
【WordPressのオリジナルテーマ作成フロー・基本マニュアル - かちびと.net】
http://kachibito.net/wordpress/theme-development-flow.html
【WordPressのオリジナルテーマを3時間で作成する手順 | WEBSEEYA(ウェブシーヤ)】
http://webseeya.com/2015/02/15/howto-wordpress-original-themes/
【Wordpress オリジナルテーマの作り方 3.0+ | Webクリエイターボックス】
http://www.webcreatorbox.com/tech/wordpress3-original-theme/
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 89.97%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる
質問への追記・修正、ベストアンサー選択の依頼
kei344
2017/03/25 12:59
使用されているテーマは自作テーマでしょうか?それとも公開されているテーマでしょうか?後者の場合は入手先をリンクつきで質問文に追記してください。
i_p_n
2017/03/25 13:12
ご返信誠にありがとうございます!追加いたしました!
kei344
2017/03/25 13:35
footer.phpは抜粋ですか?それとも質問文に書いてあるものに置き換えましたか?
i_p_n
2017/03/25 13:38
ありがとうございます、footer.phpは置き換えました!