主婦memo.chiiの結婚に関する体験&日々のblog

人生の節目である、結婚・2人暮らし・ハネムーン・日々の節約、時短レシピを主に紹介するブログです。

見出しのデザインをオシャレにする操作方法

 

f:id:memochii:20190328080805j:plain


見出しを変えたい!初心者の私でもできる方法!

オシャレに見やすく♡

 

 目次

 

はじめに

こんにちは。memo.chiiです。

見出しを変えたいけどやり方がわからず、ずっとはてな固定にあるタブのアンダーバー1つで今日までやってきました。(;´∀`)

 

 でもとうとう、「よっしゃ、見出しを変更してみるか!」と思い立ち、調べてみると、案外あっさりできました。

ネットでググりながら自分で設定してみると、「こんなに簡単だったのね。」って拍子抜けしてしまいました。

 

もちろん私はCSSもHTMLも知識が全くないド素人です。でも、そんな初心者でも簡単に設定できました。

 

今回、自分自身の為に忘れないようにメモメモ・・・忘備録としてブログに操作方法を載せておきます。

私のようにはてなブログ始めたばかりで、まだ変更の仕方がどうもわからない、できない方は参考にされてください。(*^-^*)

なぜ見出しが必要なのか?

  • そこに書いてある内容が一目でわかる
  • 読者が見たいところだけ読める
  • SEOにもいいらしい 検索エンジンがクロールしやすい などのことが挙げられます。

 

見出しのデザイン 操作方法

私のパソコン画面を使って操作方法をご説明します。

 

まず、ダッシュボードのある管理画面を開き、デザインをクリック→

するとこのような下の画面が出ます。(私のパソコン画面で説明します。)

f:id:memochii:20190415152609p:plain

 

①の工具のようなマークを押して(カスタマイズ)の

デザインCSSをクリックします。

 

②のCSSシートが出てきますので、そこに入力または

コピペして貼ります。注意です!!

 この時に絶対にもともとあるcssを消さないでください!!もし誤って消してしまったあとすぐであれば、Ctrl+Zキーで元に戻れるので戻してください。

 

←不安な方はメモしておいたほうがいいかもしれません。私の場合はてなProでデザインを選んでいるのでそのもともとのCSSが入っており、2~3行下に新たに入力しました。私のようにタイトルのデザインとかも変えていてCSSが入っている方も、そのまま消さないでおきましょう。

デザインは、コピペして使ってくださいという先輩方が多数おられるので、そちらをネットで調べ貼るのがとっても簡単だと思います。(*^-^*)

 

わたしが参考にさせてもらった方の記事のリンクを貼っておきます。CSSを公開しておられ、仕上がりの図が出ているのでわかりやすく大変参考になります。

簡単にできました。感謝です。ありがとうございます!!

saruwakakun.com

参考リンク(最終閲覧2019/04/15)

 

 

見出しごとに貼り付けます。

 

(例)

 ブログのタイトル・・・【五十音についてのブログ】

ブログのタイトルの説明・・・【五十音について書いています。】

 

◎五十音順(大見出し)

  ・◇あいうえお(中見出し)

  ・◇かきくけこ(中見出し)

     ・◆あああああ(小見出し)     

 

 

このようなブログの構成になると思うのですが、はてなブログで読みかえると

  • h1》一番大きい見出し (ブログのタイトル)
  • h2》二番目に大きい見出し (タイトルの説明)
  • h3》大見出し
  • h4》中見出し
  • h5》小見出し
  • h6》一番小さい見出し

となるかと推測します。間違っていたらすみません(>_<)

 

それぞれに設定するので、CSSシートに貼り付けます。コピペして使用される場合、先頭のh1となっているものは、それぞれ書き換えましょう。

 

『更新する』を押して、自分のどれか記事を開いてみます。

既に見出しのデザインが変わって見れたら成功です。(自分が設定した、大見出し、中見出し、小見出しがすべて変わっていることを確認してください。カラーなどを消して自分で入力すれば、自分の好きなようにカスタマイズ・アレンジできます。そのデザインが気に入らなければそのコードのみCSSシートから消します。)

 

最後に

おつかれさまでした。(*^-^*)少しでも参考になりますように。

それではまた。

 

 2019.06.01追記☆

わたしがブログを始めたばかりの頃、見よう見まねで操作しました。でも、初心者向けの記事ですすが、何かしらこご参考になれれば幸いです。

 

読者募集中♪気になる記事はブックマークが便利です。

レシピ記事、結婚に関する記事なども書いているのでよろしければご覧ください。

 

 

 ▼他の過去記事も見てみる。

▼レシピ▼ 他のレシピはメニューバーの”レシピ”から移動できます。

 

www.memochii-blog.com

 

 

www.memochii-blog.com

 

 

 

 ▼結婚式準備▼ 他の結婚記事は、メニューバーの”ケッコン”から移動できます。

www.memochii-blog.com

 

 

www.memochii-blog.com

 

 

▼はてな操作方法▼

 

www.memochii-blog.com

 はじめは、スターを付けることもドキドキしますよね。もし私を見つけて、読んでいただいてスターをいただけたら、私もブログにお邪魔させていただきます♪

 

他のはてなブログ初心者向け操作方法の過去記事はメニューバーの”ソウサ”から移動できます。

それでは、また♡

 

アフィリエイトで夢を叶えた元OLブロガーが教える本気で稼げるアフィリエイトブログ 収益・集客が1.5倍UPするプロの技79[本/雑誌] / 亀山ルカ/著 染谷昌利/著