« 暴想:タイトルと概要を表示するJavaScript、のTypepad編 | メイン | Ajaxを使ったサイト内高速全文検索エンジンを導入 »

2007年1 月 7日 (日)

アーカイブの概要の一覧を表示する

ついにTypepadプロの上級者向けテンプレートってやつに手を出してしまいました。

小生のスキルレベルでは到底使いこなせない事は分かっちゃ~いるんですが、どうしても昨日不発に終わってしまった「アーカイブのリンクをクリックするとタイトルのみ一覧が表示できる」を実現したくて昨日一晩かけてネットで探していたら代替案が見つかったのです!

Typepad Hacks なんていうGTD(Getting Things Done)系のタイプパッド・コミュニティがありました。去年の3月に米国で始動したばかりなのでまだそれほどハック的コンテンツは充実していませんが、今の小生にとっては十分過ぎるほどの宝箱でした。

で、今回行ったのが、アーカイブ(カテゴリー別と月別)のプルダウンメニュー化と、アーカイブ(カテゴリー別と月別)の概要一覧づくりです。暴想 様のところのようにAjaxでサクサクって検索して表示、というわけにはいきませんが、まぁ~許容範囲でしょ?ちなみにこのプルダウンメニューにこだわったのにはもう一つ理由が。それは、Typepadがアーカイブを10ヶ月表示しかしない設定になっているからなんですよね。何でやろ?

それでは導入方法について。

まずはプルダウンメニュー化。

こちらはTypepad HacksのDrop Down Menus for Categories + Archives (カテゴリー+アーカイブのドロップダウンメニュー化)を参照しました。

1) 編集するブログ(複数ある場合)のデザインタブの「現在のデザインを編集」画面の中のsitebarをクリック(ちなみにサイドバーが2つある方は任意の方を間違えずに選ぶように)。
sidebar
2) 中のコードはメモか何かにコピー&ペーストで一旦バックアップを取っておきましょう(これ、結構大事)。
3) 4)のコードを任意のタイプリストの間に追加するのですが、タイプリストは
<!--#include virtual="/lists/search/module.inc"-->
とか
<!--#include virtual="/lists/list_26/module.inc"-->
な感じになっています。自分のデザインを念頭に位置を決めてくださいね。
4) 下記が挿入するコードです。

<div class="module-archives module">
        <h2 class="module-header"><$MTTrans phrase="Archives"$></h2>
<div class="module-content">
            <ul class="module-list">
<form>

<select style="width:180px; margin: 0px 0px 10px 5px; font-family: verdana, Arial, sans-serif; font-size: 11px;" onChange="document.location=options[selectedIndex].value;">
<option value="">月別</option>
<MTArchiveList archive_type="Monthly">
<option value="<$MTArchiveLink$>"><$MTArchiveTitle$>(<$MTArchiveCount$>)</option>
</MTArchiveList>
</select>

<select style="width:180px; margin: 0px 0px 10px 5px; font-family: verdana, Arial, sans-serif; font-size: 11px;" onChange="document.location=options[selectedIndex].value;">
<option value="">カテゴリー別</option>
<MTArchiveList archive_type="Category">
<option value="<$MTArchiveLink$>"><$MTArchiveTitle$> (<$MTArchiveCount$>)</option>
</MTArchiveList>
</select>

</form>
            </ul>
        </div>

2段落目がアーカイブ(月別)、3段落目がカテゴリーなのでどちらか一方のみ表示したい場合はその段落を削除してください。

5) 「保存」を押して、「公開」ボタンでブログの再構築をすれば完了です。

次は、アーカイブ(月別、カテゴリー別)の概要一覧づくりです。

こちらはTypepad HacksのHow To: Display Excerpts Rather Than Full Posts on Your  Blog's Archive Pages (ブログのアーカイブのページに記事全部ではなく抜粋を表示する方法)を参照しました。

1) 上の1)~2)と手順は一緒ですが、ここではCategory ArchivesとDatabased Archivesが対象となります。

Archives

2) Category ArchivesとDatabased Archivesのバックアップを取った後、3)にあるそれぞれのコードを<$mtweblogincludemodule module="entry-list"$>というコードと差し替えます。

3) 下記がそれぞれのコードです。

Category Archives用には:

<h3 class="entry-header">カテゴリー別 アーカイブ</h3>
<p>全文をお読みなる場合はタイトルをクリックしてください。</p>
<MTEntries>
<b><$MTEntryDate format="%b/%d/%Y"$>:
<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></b><br />
コメント: <$MTEntryCommentCount$> | <MTEntryIfCategories>カテゴリー: <MTEntryCategories glue=", "><MTBlogIfArchives archive_type="Category"> <a href="<$MTCategoryArchiveLink$>"><$MTCategoryLabel$></a> <MTElse><$MTCategoryLabel$></MTElse> </MTBlogIfArchives></MTEntryCategories></MTEntryIfCategories>
<br />
<div style="padding-left:10px;"><i><$MTEntryExcerpt$></i></div><br />
</MTEntries >

Databased Archives用には:

<h3 class="entry-header">月別 アーカイブ</h3>
<p>全文をお読みなる場合はタイトルをクリックしてください。</p>
                            <MTEntries>
<b><$MTEntryDate format="%b/%d/%Y"$>:
<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></b><br />
コメント: <$MTEntryCommentCount$> | <MTEntryIfCategories>カテゴリー: <MTEntryCategories glue=", "><MTBlogIfArchives archive_type="Category"> <a href="<$MTCategoryArchiveLink$>"><$MTCategoryLabel$></a> <MTElse><$MTCategoryLabel$></MTElse> </MTBlogIfArchives></MTEntryCategories></MTEntryIfCategories>
<br />
<div style="padding-left:10px;"><i><$MTEntryExcerpt$></i></div><br />
</MTEntries >

ちなみに、<h3 class="entry-header">~</p>を入れるかどうかは自由です。自分のテンプレートのヘッダーを同じにしたい場合に有効です。まぁ~、やってみてくださいな。また日本語表記も自由に変えられます。

4) 「保存」を押して、「公開」ボタンでブログの再構築をすれば完了です。

あぁ~、なんかスーッとしたぁ~。

↑ 上のスライドバーでこのエントリーの評価をお願いします!評価ランキングはこちら。

TOPへこのページの先頭へ

トラックバック

トラックバックURL

この記事へのリンク

この記事へのリンク(直リンク生成用)

Listed below are links to weblogs that reference アーカイブの概要の一覧を表示する:

コメント

→ 過去のコメント集はこちら

ティファニー キー リング

ティファニー:http://www.jewelry-street.com
ティファニー 通販:http://www.jewelry-street.com
ティファニー ネックレス:http://www.jewelry-street.com/tiffany-necklace.html
ティファニー ブレスレット:http://www.jewelry-street.com/tiffany-Bracelets.html
ティファニー カーフ リンクス:http://www.jewelry-street.com/tiffany-Cufflink.html
ティファニー キー リング:http://www.jewelry-street.com/tiffany-KeyChain.html
ティファニー イヤリング:http://www.jewelry-street.com/tiffany-Earring.html

絶對高潮

女性用媚薬: http://www.feelkanpou.com/Charming/Charming-medicine.html
三便宝:http://www.feelkanpou.com/product/三便宝.html
威可王 販売: www.feelkanpou.com/product/威哥王三鞭粒.html
ru486: http://www.feelkanpou.com/product/RU486.html
ED助勃: http://www.feelkanpou.com/Energy/12.html

絶對高潮

五便宝: http://www.okkanpo.com/Product/222.html
三體牛鞭: http://www.okkanpo.com/Product/437.html
威哥王 販売: http://www.okkanpo.com/product/435.html
巨人倍増 販売: http://www.okkanpo.com/product/133.html
D10媚薬: http://www.okkanpo.com/product/89.html
三体牛鞭: http://www.okkanpo.com/product/112.html

コピーブランド

ジョン ? ハーウッドは、1923 年に、古い自動巻きのシステムを考案、時計の時間の成長ステータス シンボルの時刻を確認するには便利な方法の代わりに。グッチバッグ: http://www.brandkopi.net/gucci/
グッチベルト: http://www.brandkopi.net/gucci/belt/
エルメスバッグ: http://www.brandkopi.net/hermes/
エルメスベルト: http://www.brandkopi.net/hermes/belt/
エルメス時計: http://www.brandkopi.net/hermes/watch/
バレンシアガバッグ: http://www.brandkopi.net/balenciaga/
ボッテガヴェネタバッグ: http://www.brandkopi.net/bottegaveneta/
ミュウミュウバッグ: http://www.brandkopi.net/miumiu/
クロエバッグ: http://www.brandkopi.net/chloe/
プラダバッグ: http://www.brandkopi.net/prada/

ブランドコピー

手首の時計を使用して同様に、長年にわたって変えたが、特性は、もはや時間を指示する simplyemployed toutilized されます。グッチコピー: http://www.marui-brand.com/gucci/
グッチベルト: http://www.marui-brand.com/gucci/belt/
プラダコピー: http://www.marui-brand.com/prada/
マークジェイコブスコピー: http://www.marui-brand.com/marcjacobs/
バレンシアガコピー: http://www.marui-brand.com/balenciaga/
クロエコピー: http://www.marui-brand.com/chloe/
ミュウミュウコピー: http://www.marui-brand.com/miumiu/
ジミーチューコピー: http://www.marui-brand.com/jimmychoo/
ティファニーアクセサリー: http://www.marui-brand.com/tiffany/
バーバリーコピー: http://www.marui-brand.com/burberry/

この記事へのコメントは終了しました。

TOPへこのページの先頭へ

このサイトについて

アーカイブ

検索