WordPressの見出しの話


パソコンが苦手な起業家のための
集まる集客®テクニカルコーチ
田尻佐和子です。

 

今日もご質問いただいた中から、
回答した内容をシェアいたしますね。

 

質問

WordPressでこのような見出しをつけたいのですが。

スクリーンショット 2016-10-05 22.51.23.png

回答の前に、少し解説です。

 

WordPressで、
記事のタイトルには、

スクリーンショット 2016-10-05 22.37.01.png

このように、
ワンポイントが入っていたり、
装飾が入っていることが多いですが、

この記事のタイトルも見出しの1つです。

 

HTMLの構造で、
見出しはH1〜H6で表すことが決まっています。

 

WordPressではこのように見出しが定義されていて、

スクリーンショット 2016-10-05 22.43.09.png

H1が一番大きな文字でだんだん小さくなるように設定されています。

アイコンや装飾は、
お使いになっているテーマによって、
変わってきます。

 

見出しは、
読む人が読みやすいように、
要点をまとめてあげる役割もありますが、

 

見た目だけではなく、
Googleにどんな記事なのか、
伝えるための構造なので、

H1が一番重要で、
一つしか使ってはいけないとか、
H2,H3と順番に使わなければいけないとか、

決まりがあります。

 

よく、見た目だけの問題で、
Hタグを利用して、
装飾をつけてしまったりしてしまうこともありますが、

本来の意味は押さえておいてくださいね。

 

実際に見出しに装飾を付ける場合は、
WordPressではstyle.cssに定義します。

 

今日は、私がよく使う、
見出しを生成してくれるツールをご紹介しますね。

 

見出しメーカー

http://midashi-maker.v-colors.com/

 

色を指定して、実行すると、
HTMLとCSSを吐き出してくれます。
このツールではclassとして名前が付いていますが、

これをH3とかに変えて
style.cssに追記します。

 

WordPressでは、
外観のテーマ編集で、
style.cssが編集できるようになっています。

 

ここまで読んで、
HTML?class?H3???

よくわからない!!!

 

となっても大丈夫!

 

コピペだけで、
設置するには、こちらをお読みください。

http://web-yougo.com/tool/1920/