公式プラグイン「カテゴリ」で現在表示されているカテゴリをハイライト

公式プラグイン「カテゴリ」をコピペでカスタムし、現在表示されているカテゴリをハイライトする方法です。当サイト作者が作成したcustomtemplate と customtemplate-3c (ver1.5.0)についてです。

カスタム前後の比較

  1. コピペでOKです。

  2. 仕上がりはこんな感じです。カテゴリのテンプレートの説明を表示している場合です。

    130303plugin-category-1.png

メリット

  1. 現在表示されているカテゴリの背景色がハイライトされ、読者のユーザビリティ向上を期待できます。

プラグインのHTMLを編集

  1. 管理画面でプラグインの設定をクリックします。

    130303plugin-recent-1.png
  2. 切り替わった画面にある【HTMLの編集】をクリックします。

    130303plugin-category-2.png
  3. テキストボックスが展開され、次のコードが表示されます。

    <div>
      <!--category-->
      <div &align>
        <!--category_sub_hasnext-->┣<!--/category_sub_hasnext-->
        <!--category_sub_end-->┗<!--/category_sub_end-->
        <a href="<%category_link>" title="<%category_name>"><%category_name> (<%category_count>)</a>
      </div>
      <!--/category-->
    </div>
    130303plugin-category-3.png
  4. 次のコードに変更します。下図で反転している部分が変更後です。

    <div class="tell-this-page">
    <!--category-->
    <div &align>
    <!--category_sub_hasnext-->┣<!--/category_sub_hasnext-->
    <!--category_sub_end-->┗<!--/category_sub_end-->
    <a href="<%category_link>" title="<%category_name>"><%category_name> (<%category_count>)</a>
    </div>
    <!--/category-->
    <!--カスタム参考ページ:http://customtemplate.blog112.fc2.com/blog-entry-97.html-->
    </div>
    130303plugin-category-4.png
  5.  設定 をクリックで完了です。

以上です。

関連記事
(この一行は、各記事の最後に固定表示するサンプルです。テンプレートを編集して削除もしくは非表示にしてください。)
スポンサードリンク
(この一行は、各ページ下部に固定表示するサンプルです。テンプレートを編集して削除もしくは非表示にしてください。)