Q&A
まだ質問が「受付中」になっていますが、いったん「解決済」にされてはいかがでしょうか。また、解決されていないなら状況を質問文に追記ください。
テンプレート「Twenty Seventeen」の子テーマを使用しています。
Seventeenの機能としてカスタマイズメニューで「外部css」を入れるとすぐに反映状態が
見れるというのがあり便利なのですが、全てヘッダーに表記されてしまいます。
出来ればソースを簡潔にしたいため、外部CSS（tsuika.css）にして読み込みたいと考えています。
style.cssに入れることも考えたのですが、その他にも外部css（main.css）があり、
デザイン的にもカスタム「外部css」内を削除して、外部css（tsuika.css）をもう一つ
増やし読み込ませたいのです。
現在は、下記の通りです。
●functions.php
php
1add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' ); 2function theme_enqueue_styles() { 3 wp_enqueue_style( 'parent-style', get_parent_theme_file_uri() . '/style.css' ); 4}
●header.php
php
1<link href="/css/main.css" rel="stylesheet" type="text/css" />
●読み込み必要なcss
・親style.css
・子style.css
・main.css
・tsuika.css
他の方のサイトを参考に、header.phpに下記のようにしてみたのですが、
読み込みが出来ていないようです。（main.cssも）
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/main.css" type="text/css" /> <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/tsuika.css" type="text/css" />--
ご確認頂けますようお願い致します。
【概要】
WordPress： 4.7.5
template： Twenty Seventeen
回答2件
0
ベストアンサー
子テーマのディレクトリから呼び出すなら、
<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/main.css" type="text/css" />
でなく、
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/main.css" type="text/css" />
だと思います。
関数リファレンス/get template directory uri
関数リファレンス/get stylesheet directory uri
参考まで。
投稿2017/07/20 05:17
総合スコア2352
参考URLもありがとうございます。
確認しながらやってみたのですが、反映されない状態です。
アドレスが間違っているのだと思いますので、もう少し確認してみます。。
何度も申し訳ありません。
反応しないのは下記コードになるのですが、こちらをheader.phpに入れる形で合ってますでしょうか？
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/main.css" type="text/css" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/tsuika.css" type="text/css" />
●cssの置き場所
public_html/css/main.css
public_html/css/tsuika.css
なら、たぶん、ワードプレスの管理外だと思うので、直接、フルパスを書かれた方が確実だと思います。
ありがとうございました。
教えて頂いていたのは、wp内に設置していた場合ということですよね…。
基本的なところ、申し訳ありません。
0
cssはどこに置いていますか？
置き場所によっては
home_url()やsite_url()の方が良いかもしれません。
投稿2017/07/20 05:09
編集2017/07/20 05:13
総合スコア80850
お返事頂きまして、ありがとうございます。。
それぞれの設置は所は、下記の通りです。
●cssの置き場所
public_html/css/main.css
public_html/css/tsuika.css
●wordpress置き場所
public_html/wp/wp-content/themes/twentyseventeen-child/
●サイトアドレス http://URL
●wordpressアドレス http://URL/wp
それだと home_url() の方ですかね。
参考URLに色々とパスの取得方法が書いてあるのでご自身の環境にあわせて修正してみてください。
下記コードにしてみましたが、上の方法同様反映しないので、
階層の認識間違いになりますでしょうか？
<link rel="stylesheet" href="<?php echo home_url(); ?>/css/main.css" type="text/css" />
<link rel="stylesheet" href="<?php echo home_url(); ?>/css/tsuika.css" type="text/css" />
<link rel="stylesheet" href="http://URL/css/main.css" type="text/css" />
<link rel="stylesheet" href="http://URL/css/tsuika.css" type="text/css" />
kei344 ありがとうございます。直にフルパス書いちゃえってことですよね＾＾；
mts10806さん kei344さん
ご返信ありがとうございます。
最初の方にフルパスで記載していたのですが、結構メイン部分のcssが反映されていないこともあり、
認識していないと勘違いしておりました。
そこで上記のような呼び出し方を色々調べてみて、ドツボにはまりご相談させて頂いていたようです。
8-0_nyan5さん、kei344さんに教えて頂いた通りフルパスで対応できたのですが、メイン部分に
ついては子style.css要素に上書きされているようで、反映されていないようになっていました。
今回は焦ってしまい、その部分について気が付かなかったです。。。。ありがとうございました。
テーマにぶら下げる場合とそうでない場合で用途をはっきりさせた上で適用させた方が良いですね。
CMSはサイト構築上は便利ですが管理下にないものを利用とすると結構難儀ですよね・・
あなたの回答
tips
プレビュー
