もうちょっと、ここをこう できたらな。
ブログ運営に慣れてきた頃。
誰しもが思うことではないでしょうか？
まだ有料テーマを導入していない方へ！
WordPressに限らずブログでは、
- Cascading Style Sheets（CSS、カスケーディング・スタイルシート）
を編集することで…
自分の好きなように「カスタマイズ」できます。
でも、どうやるか分からない…
ぼくも以前までは そうでした。
しかし今は、いろいろと試しつつ…
独学で身につけ、解説できるくらいに なりました！
そこで今回、
- CSSの編集・追加場所
- Webサイトでの検証方法
- 反映されないときの対処法
など、基礎的な部分を ご紹介いたします！
2022年時点で予期していた円安対策にも！
HTML・CSSとは？
まずブログ記事は、おもに２つの言語。
「HTML」と「CSS」で構成されています。
カンタンに説明すると…
- 前者は、基本的にWordのような「文字」のみを。
- 後者は、それを見栄えよくする「デザイン」を。
扱っている言語です。
ところでブログテーマでは、HTMLを編集することは難しいです。
できるものもありますが…
基本的に作成者がロックをかけているためです。
しかしCSSであれば、編集することが。
正確には、追加することができます。
なんなら行いやすいよう、促してくれています。
とくに有料テーマだと、視覚的に なっていますね！
CSSの編集・追加場所
では、CSSの追加場所は？
- 外観／カスタマイズ／追加CSS
- 外観／テーマエディター／style.css
おもに２ヶ所、存在します。
しかし、前者のほうが「視覚的」に行なえます！
使用ブラウザにも よりますが…
入力した瞬間に反映されるからです。
Webサイトでの検証方法
さらに、Webサイト上で…
いじりながら、遊ぶ（学ぶ）こともできます。
自分のブログや好きなサイトを開いて、
- 右クリック／検証
- Ctrl＋Shift＋I
のどちらかを行うと、編集画面が現れます。
ブログ記事の執筆よりも、こうやって いじっている時間のほうが長いかも？笑
オススメの勉強方法
ところで、
CSSのみならず、HTMLですら分からないんですけど…
という方も いることでしょう。
そこで、オススメの勉強法として、
- 「Progate」の「HTML＆CSS（初級編）」
を挙げておきます。
その理由は、
- イラスト中心のスライドで学べる。
- その場で すぐに実践できる。
- 無料で利用できる。
からです。
何も分からない状態から、今はスムーズに解けるようになってて嬉しかった！
こちらの本もオススメ！
ポチップ反映されないときの対処法
ときどき、
CSSを変更したのに、なかなか反映されない！
なんてことが起こります。
この原因は、おそらく「キャッシュが残っている」から。
キャッシュ：訪問したWebページのデータを保存しておき、再訪した際にサクッと表示される仕組み。
それを消去するだけで反映されること。
よくあります。
ぜひメモしておきましょう！
ちなみに、おすすめプラグインは「WP Fastest Cache」です！
やはりネット検索は最強！
以上、この記事の内容を３行で まとめると、
- ブログ記事を構成する言語は、おもにHTMLとCSS。
- 後者のみ追加でき、その流れや注意点を伝授！
- オススメの勉強法は「Progate」と、いじって遊ぶこと。
でしたが、いかがだったでしょうか？
ぼくも無知から ここまで来ました。
それも独学で、ほぼ無料で。
なぜか？
- すべてネット検索すれば、情報が手に入るから。
ぼくは１度、ブログを挫折しています。
その頃は、こんなに恵まれていなかったから。
でも今は違います。
いろんなサイトやサービスがあります。
自分だけでも解決できるくらいの状況です。
ぜひ調べまくって、お互いに成長し続けましょうね！
また、このブログでも「CSS」について取り上げています。
とくにボクも使用しているテーマ「STORK19」。
こちらに対応・優先しています。
また、Twitterでも情報発信しており…
もちろん質問可能です！
なので、一緒にガンバっていけたらいいな。
最後まで お読みいただき、ありがとうございました！
つぎに繋がる記事はコチラ！
フリーランスの強い味方！
有料テーマを導入して、かなりカッコよくなったけど…