(【シンママ奮闘記】今日もてんやわんや

【シンママ奮闘記】今日もてんやわんや

~経験をスキルに変えて自分らしく生きる~

MENU

【はてなブログ初心者カテゴリー断層化】コピペで完了!

SEO対策

アラフィフシンママ介護士のかなやんです。

ご訪問ありがとうございます。

はてなブログ2ヶ月に満たない初心者ですが、SEO対策を勉強して、少しずつサイトを見やすくする為に、今回はカテゴリーの断層化にチャレンジしてみました。

 

 

 

はてなブログカテゴリー階層化参考記事紹介

 

下記、参考記事掲載させていただいています。

モカリーナさん♪
分かりやすい記事をありがとうございました!

mocharina.com


ソースコードを作って下さったid:WorldWorldWorld さん♪
感謝申し上げます!

blog.wackwack.net

 ※念のため、必ずバックアップを行ってからお試しくださいね!

 

カテゴリーの断層化手順

 

1.パンくずリストにチェックを入れる。

 

【管理画面「デザイン」→「カスタマイズ」→「記事」と進み、下の方にある「記事ページにパンくずリストを表示する」にチェックを入れる】

 

こちらの記事で紹介しています。

手順は簡単、チェックを入れるだけです。

kanayanmama-blog.hatenablog.com

 ※パンくずリストの設定は完了しておいて下さい。

 

 

 

2.カテゴリーを親・子・(孫)に分けて設定・登録

 

◇カテゴリー階層化の設定方法(階層化は3段階まで可能)

記事の管理欄から編集

①親カテゴリー登録

  (例:ブログ)

②親カテゴリー-(半角ハイフン)子カテゴリー登録

  (例:ブログ-SEO対策)

③親カテゴリー-(半角ハイフン)子カテゴリー-(半角ハイフン)孫カテゴリー登録

(例:ブログ-ブログ-SEO対策-【はてなブログ初心者カテゴリー断層化】コピペで完了!)

※この記事のカテゴリーを例に、かなやんは孫カテゴリーに記事のタイトルを入れてみました。

   

+新しいカテゴリーで親・子・孫の順に登録!

     ↓↓↓↓↓

f:id:kanayanmama1:20210208234138p:plain

 

カテゴリーは、あらかじめシンプルにまとめたほうが、より見やすくスッキリします。

 

 

3.サイドバーのカテゴリー設定

◇サイドバーにカテゴリー欄を設置

「デザイン」→「カスタマイズ」→「サイドバー」をクリック!

f:id:mocharina09:20190407104209p:plain

「+モジュールを追加」をクリックして、左端の「カテゴリー」を選択。

 

テカゴリーの表示設定

 

【デザイン→カスタマイズ→サイドバー→カテゴリー→カテゴリーの編集】

 

カテゴリーの並び替え設定は必ずアルファベット順に変更してください。

 

f:id:kanayanmama1:20210209000038p:plain

※最後に適用をクリックし設定を保存。

4.記事の表示画面確認

◇テカゴリー▲をクリックして確認

 

カテゴリーの▲をクリックすると下の段に子カテゴリーと、更に下の段に孫カテゴリーが少し右にずれて出てきます。

 

f:id:kanayanmama1:20210209020427p:plain

 

パンくずリスト確認


f:id:kanayanmama1:20210209010032p:plain

   ↑↑↑↑

パンくずリストも三段階になっていますね♪

 

 

 

5.スクリプトの設定

 

【管理画面「デザイン」→「カスタマイズ」→「フッタ」にコピペ】

 

◇下記のスクリプトをコピペして貼り付け

 <script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js“></script>
<script src=”https://hatena.wackwack.net/v1.1/js/breadcrumb.min.js“></script>
<script src=”https://hatena.wackwack.net/v1.1/js/category_archive.min.js“></script>

 

f:id:mocharina09:20190407095608p:plain

 

※必ず「変更を保存する」をクリック!

 

6.スタイルシートの設定

【管理ページ「デザイン」→「カスタマイズ」→「ヘッダ」→「タイトル下」に、下記スクリプトをコピペ】

◇下記のスクリプトをコピペして貼り付け

 

<link type=”text/css” rel=”stylesheet” href=”https://hatena.wackwack.net/v1.1/css/fulldisplay.min.css“/>

 

f:id:mocharina09:20190407100208p:plain

※必ず「変更を保存する」をクリック!

 


カテゴリー断層化完了

以上で終了です。お疲れさまでした!

かなやんも疲れました( *´艸`)

 

少しはスッキリしたカテゴリーになりましたね♪

 

最後まで読んで下さり、感謝申し上げます!

 

ありがとうございました。