子テーマのstyle.cssの記述が反映されません。

Simplicityの特徴 フォーラム 不具合報告 子テーマのstyle.cssの記述が反映されません。

このトピックには8件の返信が含まれ、2人の参加者がいます。2 ヶ月前わいひら わいひら さんが最後の更新を行いました。

  • 投稿者
    投稿
  • #51227 返信

    なっと

    自分のサイト:http://gadjetlife.com/

    先日からSimplicity2を利用させていただいています。

    初歩的な質問かもしれませんが、テーマの編集のstyle.css及びmobile.cssに記述しても反映されません。

    対策として、テーマのカスタマイズの最下部にある追加cssに記述したところ無事反映されました。
    ですが、相変わらずmobile.cssを編集する手段がないので困っています。

    環境は
     ・ロリポップサーバー
     ・子テーマ適応済み
     ・ブラウザキャッシュ削除済み
     ・プラグイン停止済み

    といった感じです。
    下手くそな文章で申し訳ありませんが、どなたか助言お願いします。

  • #51228 返信

    みき

    相変わらずmobile.cssを編集する手段がないので困っています。

    たしかカスタマイザーの完全レスポンシブがオンになっているときは読み込まれないはずです
    オフにしてみるとどうなりますか?

  • #51234 返信
    わいひら
    わいひら
    キーマスター

    どちらのファイルにも何も記述されていないので、今のところは反映しようもありません。
    ファイル自体は読み込まれているようです。
    http://gadjetlife.com/wp-content/themes/simplicity2-child/style.css
    http://gadjetlife.com/wp-content/themes/simplicity2-child/mobile.css
    動作を確認するには、できれば何か双方にスタイルを書き込んでください。

  • #51235 返信

    なっと

    完全レスポンシブの設定はオフになってます。

    取り敢えずmobile.cssの方に、

    .entry h2 a { font-size: 18px; }

    と記述してみました。

  • #51236 返信
    わいひら
    わいひら
    キーマスター

    mobile.cssのスタイルもちゃんと適用されています。
    スタイルが反映されないのは、以下のスタイルが疲れているからです。

    .entry h2 a { color: #4387e9; font-size: 1.2rem; font-weight: 700; line-height: 1.4; }

    これはおそらく、テーマカスタマイザーで書かれた部分だと思いますが、これ(もしくはテーマカスタマイザーで書かれた部分全部)をstyle.cssに移動してください。
    テーマカスタマイザーで書かれたCSSは、おそらく後から読み込まれるので、mobile.cssの設定を上書きしてしまっています。
    どうしても、テーマカスタマイザーで書く必要がある場合は、.entry h2 aより優先度の高いCSSセレクタをmobile.cssに書く必要があります。

  • #51237 返信

    Hidekichi

    > テーマの編集のstyle.css及びmobile.css

    いずれもファイルは読み込まれていますので、何かしら書いてもらわないと正しく適用されているかどうかの判断ができません。現在は記述がない、つまり書いてはみたけれどもその内容が保存されないというのが反映されないということなら、ファイルの適用自体はできてますがwordpress上からstyle.cssなど書き込みができないということかと思います。

    > mobile.cssを編集する手段がないので困っています

    基本的にはftpを使って下さい。cssといえど記述ミスがあれば表示が崩れることがあります。wordpress上で本番環境に直接手を加えてよいのは、だいたいのことをリカバリーできる人です。

    それ以外はローカルのPCで記述ミスがないかどうか、できればローカル開発環境やテスト開発環境で動作を確認した後、本番環境に適用させるのが望ましいです。

    cssの値を少し変えるぐらいならwordpress上で行っても構わないわけですが、バックアップを取ることを考えると、それでもftpで行うのが望ましいです。

    で、cssには読み込み順があるので最後に読み込まれたものがhtml、各セレクタに適用されます。wordpressの追加cssはインラインで、hradタグの中のstyleタグの中に出力されるかと思います。
    これは外部cssよりも優先度が高いので子テーマstyle.cssを上書きします。

    親テーマstyle.css
    子テーマstyle.css
    head内のstyleタグ内のインラインcss
    htmlタグのstyle属性のcss

    と、!importantがついていない場合は優先度は下に行くほど高くなります。またセレクタの書き方によっても変わりますが基本は上記のとおりです。

    これらは、親テーマのスタイルを基準に、同じセレクタの同じプロパティをあとで読み込むものが上書きしていくことで最終出力をします。これらはcssの基本なので覚えておいて下さい。

    で、本題ですが、確認すべきはまずパーミッションです。
    ロリポは過去の問題からセキュリティがガチガチにしてあると思うので、第三者の編集ができないようになっている可能性があります。

    パーミッションがガチガチでもftpからログインしたユーザーはオーナーになるのでファイルの上書きができます。
    wordpressにログインしたユーザーはwordpress上では管理者ですが、サーバーにあるファイルからしてみればサーバーにログインしたオーナーではありません。

    つまり、ここらをまず確認してwordpress上からファイルを上書きできる権限がサーバーの各ディレクトリ、ファイルに対して付けられているかをまず調べます。
    これを変更するということは、もし誰かがwordpressにログインしたら各phpファイルやcssを編集できるようになるということです。もしパーミッションが問題ということなら、これら理由を含めftpでやるほうが良いという事に更に意味があることを理解してもらえると思います。

    パーミッションの確認と、ftpで何かしら子テーマsyle.cssに書いたものをアップロードするのを基本に、念のため後でそれらをテーマ編集で変更できるかも確認して下さい。

    この手の質問は第三者が、サイトを見るだけではわからないwordpress内部やサーバーの使用などの話なので、まずはテーマに問題があるのか、サーバーなどの環境設定に問題があるのかを分ける必要があります。

    ロリポでwordpressを利用している人はたくさんいるでしょうから、それらの人が設定をどうやるか書いてると思います。それらをググって意味を理解した上で内容を適用して下さい。それらを行ってもなお、ファイルの編集をwordpress上からできない場合は、wordpressのテーマ編集などについて調べて下さい。

    Simplicityはwordpress上のファイル編集に対して何も手を入れてないと思います。上記のサーバーやwordpressの環境を整えてもなおテーマに問題があるかも知れないと思った時は、別のテーマで同じことができるかできないかを確認して下さい。

    ここまでやらってもらわないと問題の切り分けができないので、面倒くさいですが確認お願いします。
    ftpでやれば確認するまでもないですけどね(笑)

  • #51238 返信

    Hidekichi

    お、回答している間に返信があったようですな。

    なんだ書けるじゃん(笑)と思いました。
    見た時は中に何も書いてなかったので、てっきり書き込みができないものと想定して回答しましたが、書けるなら単にcssの問題ですね。

    インラインで書いたものを全部、style.cssやらに移す所からなので面倒くさいでしょうが頑張って下さい。

  • #51240 返信

    なっと

    解決しました。

    style.cssに記述して時間をおいてから確認してみたところ無事反映されていました。
    style.cssは、編集が反映されるまで時間がかかるんですね。

    くだらない質問をしてしまい申し訳ありませんでした。
    そして親切に答えて頂いた皆様、本当にありがとうございましたり

  • #51255 返信
    わいひら
    わいひら
    キーマスター

    style.cssは、編集が反映されるまで時間がかかるんですね。

    そんなことありません。
    通常、ブラウザキャッシュさえ残っていなければ、すぐに反映されます(※CloudFlareのようなCDNを使用していたり、リソースをキャッシュするようなものを使用していなければ)。
    トピックの最初の書き込みには、「ブラウザキャッシュ削除済み」とは書いてあるのですが、ちゃんと削除されていなかったのではないかと思います。
    次回、もし同様のことがあれば、別のブラウザで表示させるか、ブラウザのシークレット(プライベート)モードなどで表示させてみてください。

返信先: 子テーマのstyle.cssの記述が反映されません。
あなたの情報:




スポンサーリンク
アドセンス(大)
アドセンス(大)