ブログのカスタマイズをしたのに反映されない！CSS（スタイルシート）の変更が反映されない！というのはよくある質問の１つです。
今回はカスタマイズをしてCSS（スタイルシート）を正しく変更しても反映されないという場合の対処方法を紹介しておきます。
カスタマイズ（CSSの編集）しても反映されない原因と対策
反映されない原因の多くは次の３つが考えられます。
- 変更前のページをブラウザが残している（読み込み速度向上のため）。
- 親要素の影響を受けている
- 閉じ括弧「}」が抜けてたりセミコロン等の記述ミス。
ほかにも色々細かい原因がある場合がありますが、この３つが非常に多いので一応対処方法を紹介しておきます。
ブラウザで「最新の情報に更新」する
先ほども書いたようにブラウザに変更前のページデータが保存されている場合があります。これを解消する場合は次の手順。
- Windowsの場合⇒[F5]キーを押す。
- Macの場合⇒[Command]キーと[R]を押す。
これでリロード（再読み込み）をする事ができるので試してみて下さい。また、それでも反映されない場合は次の手順も試します。
- Windowsの場合⇒「Ctrl」と一緒に「F5」を押す。
- Macの場合⇒「Command」と「Shift」と「R」を一緒に押す。
こっちは強制再読み込み（スパーリロード）ね。
優先させるコードを追加する
スタイルシート（CSS）で変更しても親要素の影響を受けて変更が反映されない場合があります。その場合には変更した記述に「!important」を付ける事で優先的に反映させる事ができます。
1 2 3 | ●● { margin-right:0px !important; } |
こんな感じで、優先したい部分に「!important」を付けるとそれが優先されます。
これでも反映されない場合は、閉じ括弧「}」が抜けていないかとかコロン「：」やセミコロン「；」等の記述ミスがないかをもう一度確認してみて下さい。
のりこ様
返信ありがとうございます。見出しがテキストっていうのは多分見出しとは別に「h3」とかがテキストとして表示させるか？という事だと思います（違ったらすみません！）。これは表示されませんので大丈夫です。あくまで装飾されていない状態というだけで、見出しとしては認識されます。
しげぞうさま
お返事ありがとうございます。
やはり無料ブログサービスの場合、カスタマイズするのに面倒な面というか、複雑な面があるのですね…。
装飾せずに、見出しをつける場合は、投稿するときにテキストでつくのでしょうか？
なんだか頭がフリーズして、何を質問してるのかも分からなくなっています( ω-、)
すいません…。ありがとうございました。
のりこ様
返信ありがとうございます。のりこ様の言われるようにスマホのデザインは別になってます。デザイン⇒スマートフォンのタブを選択⇒デザイン設定⇒デザイン名と進むとスマホのCSSへ行けます。
CSSなどで装飾する場合にはHTMLで指定された名前が必要になります。たとえばヘッダーとかフッターとか細かい部分までサイトの部分部分に名前を付ける作業がHTMLとイメージしてもらったらOKです。それで名前を付けた部分を装飾するのがCSSで、それぞれHTMLで付けた名前を元に装飾します。「ヘッダーは赤！」「フッターは白」みたいな感じです。
さて、Seesaaブログの場合、スマホ版とPC版ではデザイン（テンプレート）が別になっているため、HTMLで割当られた名前が違います。
今回の例で言うと見出し（h3）がPC版だと「.article.article–entry h3」ってしてましたが、スマホ版だと「h3」だけです。なのでスマホのCSSで「.article.article–entry h3」ではなく、「h3」で装飾の記述をすると反映されるかと思います。ただ、スマホのデザインによってこの部分の名前が違う場合もあるかもしれません。
それから本当はPC版のように「.article.article–entry h3」のように名付けるのが良いのです。なぜなら見出し以外の部分にも「h3」を使っている部分があるからです。
先程スマホの見出しの装飾はh3と書きましたが、スマホの装飾をh3でやってしまうと関連記事のタイトルとかにも影響するかと思います。これはちょっとやりずらいです。
しげぞうさま
以前に、自由形式の設置で質問した者です。
その節は、お世話になりありがとうございました。
今回は、見出しの挿入をしたく質問します。
設置についての流れは理解できましたが、スマホから見ると見出しの装飾が反映されません。
カスタマイズする歳に、PCとスマホは別なのはわかるのですが、スマホ表示で見出しを反映させるには、どのようにすればよいのでしょうか？
こちらのサイト内でさがしてみたのですが、見つけられませんでした。
お時間のございますときにでも、教えていただけると助かります。
よろしくお願いします。
カラス様
返信ありがとうございます。WordPressの場合は特にpタグを使わなくても自動的にpタグが入りますが、無料ブログなどの場合はこれがdivだったりpだったりしますね。確かにbrよりもpタグの方が正しい感じですが、これはそこまで気にする必要はないと思います。すくなくとも私自身はほとんど気にしてません。
無料ブログの時はbrで改行してた感じでしたが、きっちり狙ったキーワードでは上位表示できてましたし、今もそのまま上位で残ってますよ。タグよりもコンテンツ重視でOKと思ってます。