ワードプレスでhタグを装飾してみる

ブログ

ワードプレスでタイトルタグの装飾

こちらのブログも記事数少しずつ増えてきたのでお客様の来訪に備えてもう少し色味あるブログに装飾してみたいと思った。
候補はたくさんあるがブログタイトル、記事内タイトル、サイドバー辺りは優先したい
現状ではシンプルまでとはほど遠く、殺風景・・・・

取りあえず記事タイトルのh2タグの装飾だけは最優先で実行

今回参考にさせて頂いたのはこちらの記事

Cocoonの見出しデザインをカスタマイズしてみました
カタアヤこんにちは。低気圧が近づくとなんだか頭が重たい カタアヤ(@_kara_po)です。今日は、Cocoonテーマの見た目を大きく左右する 記事内の見出し部分のカスタマイズ についてまとめてみます。↓Cocoonとはわいひら様が作成・公

サイドバーなど他にもh2タグありそうだったので、いくつか参考サイト見たなかで同じテーマ仕様で記事タイトルだけの装飾になりそうな方法を選択してみた

単純にCSSで h1、h2 とデザイン指定しますと、記事内の見出しだけでなく、「コメント」や「関連記事」などの 思いもよらぬ部分の文字までがデザイン変更されて あわあわしてしまう ことに。。。(←繰り返しますがワタクシはWP超初心者)

それでは記事内の見出し部分だけ、デザインを変更するには どうしたらいいのでしょうか?

ワードプレスでh2タグの装飾

カスタマイズする場所は「外観」からテーマの編集「theme Editor」を選択して
「Cocoon Child: スタイルシート (style.css)」へ

後はここに記事で紹介してあるコードをコピぺ
上記紹介記事には変更箇所のナビがなかったが、多分ここかな

一度張り付けてプレビューしてみて後は色を好みで変更
「お、思った通り記事でタイトルだけ装飾されてるwww」

世界の伝統色 洋色大辞典 - Traditional Colors of World
世界の伝統色の名前とカラーコードが一目でわかるWEB色見本

文字間も少し狭く変更して、取りあえずこれでおkかな

 

 

コメント

タイトルとURLをコピーしました