詳細プロフィールへのリンクが欲しい

　はてなブログのプロフィールページには文言を追加する事ができないため、詳細プロフィールページを固定URLのエントリーとして作成し、グローバルメニュー等からリンクさせる手法がよく使われています。このブログにも詳細プロフィールページが存在します。

　しかし、詳細プロフィールページを作ったのであれば、サイドバーにあるプロフィールモジュールから表示できるようにするのが自然です。

　もともと最新記事や注目記事モジュールについてはタイトルに一覧ページへのリンクが付与される仕様となっているため、プロフィールモジュールのタイトルについても、詳細プロフィールへのリンクを追加するプラグインを作りました。

https://vine.co/v/OhIHr9M1uWZ

　またサイドバーモジュールのタイトルから一覧を表示できる仕様についての認知度が低いため、説明文言をタイトルに加えて導線を作るようにします。こちらはスタイルシートで対応します。

固定ページの作成

　固定ページを作成する場合には編集画面の右側にある歯車のアイコンを選択してカスタムURLを設定します。「自分のブログのURL/entry/カスタムURL」という形式で作成されるので、僕のブログで「about」と指定した場合は「http://www.ikedakana.com/entry/about」となります。

プラグイン設置

　デザイン画面のフッターに以下のスクリプトを追加します。

　『はてなブログから簡単にVine動画を埋め込めるプラグインでスマホからのグルメ動画レポートが捗る - 太陽がまぶしかったから』などのために既に「commons.js」をインポートしている場合は「<script type="text/javascript">」以下だけでOK。

<script src="https://www.google.com/jsapi"></script>
<script src="http://bulldra.github.io/commons.js" charset="utf-8"></script>
<script type="text/javascript">
addLinkProfile('詳細プロフィールのURL');
</script>

　デザインCSSに以下の定義を追加し、自分のブログに合わせてカスタマイズします。追加文言については「content」で指定しています。

.hatena-module-profile .hatena-module-title a:after {
    content: ">>詳細を表示";
    font-size: 90%;
    position: absolute;
    right: 10px;
    color: #fff;
}

.hatena-module-entries-access-ranking .hatena-module-title a:after,
  .hatena-module-recent-entries .hatena-module-title a:after {
    content: ">>一覧を表示";
    font-size: 90%;
    position: absolute;
    right: 10px;
    color: #fff;
}

まとめ

　以上の設定を行う事で、はてなブログのプロフィールのタイトルに詳細プロフィールへのリンクを追加する事ができます。色々な考え方があるとは思うのですが、僕自身は詳細プロフィールページへのコンバージョンが重要な指針になると考えています。

　個別のページがバズったり、検索上位にいるだけでは「個人」や「ブログ」が認知されないままなので、詳細プロフィール画面や一覧画面を表示してもらえるような導線作りが必要になります。以下の施策についても同様の観点からです。

　そんなわけで、詳細プロフィールへのリンクや文言変更を行う方法について解説しました。この辺りのデザインについての正解はないのだろうけど、スタイリッシュさとかシンプルさよりも「わかりやすさ」を考えた方がよいのかなーと現在のところは感じてます。