月別・カテゴリー別アーカイブのドロップダウンリスト化

FC2ブログマニュアル

現在パソコン版のマニュアルを表示中

月別・カテゴリー別アーカイブなどが増えてくるとどうしてもサイトが縦長になってしまいます。
コンパクトにまとめたいという方はドロップダウンリスト化してみましょう。
ドロップリスト化には使用しているテンプレートのJavaScript追加とHTML部分の修正が必要です。
（プラグイン無効テンプレートの場合）

このマニュアルは公式テンプレートの「sample」をベースにしております。

1. JavaScriptを挿入しましょう。

テンプレートの設定ページ内HTML編集にて、
<head>から</head>の間に下記JavaScriptを挿入してください。

2. アーカイブを展開している部分を書き換えましょう。

月別アーカイブの場合

月別アーカイブを展開している部分はHTML編集の以下の赤枠線部分です。

月別アーカイブを設定するために、下記のスタイルを該当の箇所に入力してみましょう。

<h2 class="monthly-archives">MONTHLY</h2>
<form id="monthly_archives" name="monthly_archives" action="">
<select name="menu" onchange="jumpmenu('parent',this,0)">
<option value="<%url>" selected="selected">■月別</option>

<option value="<%archive_link>">■<%archive_year>-<%archive_month> : <%archive_count></option>

</select>
</form>

カテゴリー別アーカイブの場合

カテゴリー別アーカイブを展開している部分はHTML編集の以下の赤枠線部分部分です。

カテゴリー別アーカイブを設定するために、下記のスタイルを該当の箇所に入力してみましょう。

<h2 class="categories-archives">CATEGORIES</h2>
<form id="categories_archives" name="categories_archives" action="">
<select name="menu" onchange="jumpmenu('parent',this,0)">
<option value="<%url>" selected="selected">■カテゴリ別</option>

<option value="<%category_link>">■<%category_name> : <%category_count></option>

</select>
</form>

正しくスクリプトの挿入と該当の部分の修正ができていればドロップリスト化されます。
最新のエントリー部分も同様に修正すればドロップリスト化ができますので、
お好みで編集を行ってください。

プラグイン有効テンプレートをご利用の場合は
共有プラグインでドロップダウンリストになっているプラグインを使用するか
手順1にてテンプレートにJavaScriptを挿入した後、該当のプラグインのHTML編集にて
カスタマイズを行ってみてください。

マニュアル一覧を見る »