絶対にブログを運営する上で知っておくべき、HTMLとcss

ブログを運営されていて、サイトのデザインを修正したことはありますか？

最近では、SWELLなど最初からデザインされたWordpressのテーマを購入されている方も多いと思います。

わたしは以前、職業訓練でwebデザインを学んだ経験があり、簡単なwebサイトであれば作ることができます。
今回は、ブログ運営をする上で、最低限知っておくと便利なことをご紹介します。

この記事を読むと、以下のことができるようになります。
・ブログを自分で自由にテキストの色を変更

HTMLとは？

HTML：文章、ウェブページの情報を独自のタグではさんで書く言語

このように、文字や画像はHTMLだけで表示することができます。

cssとは？

HTMLでは、文字や画像が表示できるのですが、文字の色などを変えることができません。

そこで、必要となるのがcssです。

ブログ運営する上では、このcssさえわかれば自分好みの色などに変更できます！

検証ツールで、どこを変えればいいか調べる

次に必ず覚えて頂きたいのが、「検証ツール（Macの場合、デベロッパーツール）」です。

次に、選択したまま変えたい場所にカーソルをあてます。

そうすると、右のコードの部分が青く選択されます。
この選択された部分の、<p class=”中のコード”>をコピーします。

class=”中のコード”をコピー

管理画面を開き、カスタマイズに移動します。

カスタマイズの中の一番下の「追加css」を開きます。

先ほどコピーしたコードの前に「.(半角ドット)」をつけて以下のようにコードを書きます。

.コピーしたコード{color: red;}　
※必ずすべて半角で記入。全角スペースだとうまく反映されません。

ちなみに、色は細かく調整できます。
以下のサイトから、#000000のように、「♯＋6桁の数字」を上記のcolor: red;のredの代わりに入れてみてください。

現職大辞典(カラーコード)

色が変わっているのを確認したら、「公開」を押して上書きしてください。

まとめ

今回は、ブログでcssを変更して色の変更方法をお伝えしました。

ぜひ、ご自身のブログで試してみてください。