はてなブログの「Minimalism」のサイドバーをスタマイズしてみました
はてなブログ「Minimalism」のサイドバーカスタマイズ
こちらの記事で、はてなブログのデザインを、はてな人気No.1デザインの「Minimalism」に変更して、カスタマイズしたことを書いたのですが。↓
「Minimalism」というデザインに変更すると、2カラムになるんですね。
なので、PCで見ると、記事本文が表示されるメインカラムの右横に、色んな情報を載せれるサイドバーというカラムがある、というデザインになるんですけど。
(スマホやタブレットでは、このサイドバーはメインカラムの下に表示されます。)
「今度はそのサイドバーをカスタマイズしよう!」ということで、やってみました。
今回行ったサイドバーカスタマイズの概要
今回は、私が今ブログのバイブルにしているこちらの本に書かれている:
アフィリエイトで夢を叶えた元OLブロガーが教える 本気で稼げるアフィリエイトブログ 収益・集客が1.5倍UPするプロの技79【電子書籍】[ 亀山ルカ ]
本気技50の「サイドバーにコンテンツを追加する」という内容を実践してみました。
ここで書かれてあった、サイドバーに必ず追加しておきたいコンテンツは:
✳︎ プロフィールの設置と内容の変更
✳︎ サイト内検索の設置
✳︎ 人気記事の設置
✳︎ フォローボタンの設置
の4つです。
順に一つずつ、具体的に紹介していきます。
プロフィールの設置と内容の変更
はてなブログではすでにプロフィール欄が設置されていると思います。
プロフィール内容を変更したりするには:
編集画面→デザイン→工具マーク→サイドバー と進みます。
すると、プロフィール名が表示されている項目があるので、その「編集」をクリック。
すると、編集画面が表示されます。
タイトル:プロフィール名など
プロフィール画像:表示するにチェックを入れる
はてなID:表示しない方がベターかと思います
自己紹介:入力します
で、適用をクリック。
その後、手前の画面が表示されるので、ここで必ず「変更を保存する」をクリック!
(これ、意外と忘れるやつ(^^; 。これやらないと、変更されません。)
で、実際にプロフィールがどのように表示されているのかを確認します。
こんな感じ。↓
これで、プロフィールの設置と内容の変更ができました。(´ー`)
サイト内検索の設置
次に、サイト内検索バーの設置です。
これは、はてなブログだと元々表示されていると思います。
なので、ここではその確認と、サイト内検索バーをサイドバーのどの位置に表示させたいか?という位置の変更をやってみます。
サイト内検索の設置や位置の変更をするには:
編集画面→デザイン→工具マーク→サイドバー と進みます。
その中に「検索」という項目があるのが、サイト内検索のことです。
「編集」をクリックすると、検索バーの横に表示されるタイトルを編集できます。
デフォルトは「検索」ですが、特に変更する必要もないかと思います。
このサイト内検索の欄をサイドバーの中でどの位置にするのか、位置を変更することができます。
PCからの操作:「編集」「削除」の右横にある横3本線マークを長押ししながら、上か下に動かして、移動。
スマホからの操作:「検索」の項目を長押ししながら、上か下に動かして、移動。
編集が終わったら「変更を保存する」を必ずクリック!
そして、どこにどんな風に表示されているか、確認。
これで、サイト内検索の表示は完了です。(´ー`)
人気記事の設置
次に、人気記事の設置です。
これは、はてなブログで表示されていない場合が多いと思います。
なので、ここではサイドバーに人気記事という項目を追加する方法をご紹介します。
人気記事の設置には:
編集画面→デザイン→工具マーク→サイドバー と進みます。
サイドバーに表示されている項目の下にある「モジュールを追加」をクリック。
表示された追加したいモジュール一覧の中から、「注目記事」をクリックして、編集していきます。
タイトル:「注目記事」でもいいですが、私は「人気記事」にしました。
集計方法:好みのものを選びます。私は「最近のアクセス」にしています。
表示件数:5件がベターかと思います。
サムネイル画像を表示する:チェックを入れます。その下の画像サイズを縦横とも、75pxと入力します。
その下にある表示関係のものは、特にチェックを入れず、「適用」をクリック。
手前の画面に戻るので、もしこの人気記事の表示の位置を変更したければ、先に説明したやり方で、上か下に移動させます。
最後に「変更を保存する」を必ずクリック!!
そして、どこにどんな風に表示されているか、確認。
これで、人気記事の表示は完了です。(´ー`)
フォローボタンの設置
最後に、フォローボタンの設置についてです。
私が参考にした本では、Twitterのフォローや、はてなブログの「読者になる」のボタンを設置する、と書かれてありました。
はてなブログの「読者になる」はすでにプロフィール欄に付いていると思うので。
そこにTwitterのフォローボタンも設置できるので、その方法を紹介したいと思います。
Twitterのフォローボタンも設置には:
編集画面→デザイン→工具マーク→サイドバー と進みます。
プロフィールの「編集」をクリックして、編集画面を開きます。
下の方に、Twitterのフォローボタンを設置する項目があるので、「表示する」にチェックを入れます。
そして、「適用」をクリックし、最後に「変更を保存する」を必ずクリック!!
すると、こんな風に表示されます。↓
これでフォローボタンの設置も完了です!(´ー`)
このサイドバーの4つのカスタマイズは、ブログの回遊率を上げるためのコツらしいので、ぜひともやっておきたいものです。(^ ^)
kayoko@おうちcafe