サイドバーへの記事一覧表示

観測気球

収集物の記録書庫 a data archive of collection -- collectible toys

[要旨] facet さんの「本文の見出しを抽出するスクリプト」と、その改造例「カテゴリー...
[キーワード]

« コメントの投稿時間が変? | トップページ | サイドバー折りたたみ -- 実装してみる »

2004.01.27

サイドバーへの記事一覧表示

facet さんの「本文の見出しを抽出するスクリプト」と、その改造例「カテゴリーの閲覧性がかなり高まった(全見出しの抽出)」を参考に、サイドバーに投稿日別に記事一覧(見出し)を表示するようにしようとしています。

本文の見出しを抽出するスクリプト

Firebirdではきちんとインデントされるんですが、IE6では駄目でした。このあたりも修正したいんですが、まだ解決できていません。(T_T) (これもIE6だとclassNameにしないといけないのかもしれないですね…)

まさに className で OK でした。naoya氏の FeedBack で使っている JavaScript を参考に、ブラウザの判別処理を組み込んでみました。いろんな人の技をパクりまくりですね。 (^^;

とりあえず、ローカルではうまくいきました。これからマイリストに実際に組み込むことになるわけですが、その前に想定される手順をあらかじめメモって置きます。

  • まず、extractContentHeadings01b_t.js をアップロード。
  • 次に、独自スタイルシート (styles-tsupo.css) に以下の内容を追記して、アップロード。
    .sub {
        position: relative;
        top: 5px;
        font-weight:bold;
    }
     
    #content-headings {
        position: relative;
        top: -30px;
        background: #EEE;
        margin: 0px 2px 0px 10px;
    }
    
    #content-headings a {
        color: #222;
    }
    
    #content-headings .level-2 {
        margin-left: 5px;
        font-size: x-small;
        font-weight: bold;
    }
    
    #content-headings .level-3 {
        margin-left: 20px;
        font-size: x-small;
    }
  • 最後に、マイリスト(リンクタイプ、メモ表示なし)のタイトルに以下の内容を追加。URLは空欄のまま。
    </a><span class="sub">このページの記事一覧</span></li></ul></div> <div id="listHeaders"></div> <script type="text/javascript" src="/memo/extractContentHeadings01b_t.js"></script> <div class="sidebar"><ul style="display: none;"><li><a name="headLine">

こんな感じかな?

では、作業開始!! うまくいくといいのですが。

*** 追記 ***

トップページは問題ありませんが、カテゴリ別のページや月別のページ、個別のページでは、JavaScript のエラーが出ますねぇ...。何が悪いんでしょう? → マイリストに登録する文字列の間違いでした。(JavaScript の相対パス指定の問題)

*** 追記 その2 ***

JavaScript未対応のブラウザや、対応しててもJavaScript機能をoffにしている人のために、「最近の記事」はそのまま残しました。

投稿者: tsupo 2004.01.27 午前 12:55 | 固定リンク | このエントリーをはてなブックマークに追加 | このエントリを del.icio.us に登録 このエントリの del.icio.us での登録状況 | このエントリを Buzzurl に追加このエントリの Buzzurl での登録状況 | このエントリをlivedoorクリップに登録 このエントリのlivedoorクリップでの登録状況 このエントリをlivedoorクリップに登録している人の数 | 酢鶏巡回中

楽天市場


ウェブログ・ココログ関連」カテゴリ内の最近の記事

プログラミング」カテゴリ内の最近の記事

品揃え豊富で安い!NTT-X Store


アマゾンわくわく探検隊

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/6737/139582

この記事へのトラックバック一覧です: サイドバーへの記事一覧表示:

» 見出し一覧テクニック・改2 from あそびをせんとやうまれけむ
改造例2です。かなり見やすいですね (^^) facet さんの「本文の見出しを抽出するスクリプト」と、その改造例「カテゴリーの閲覧性がかなり高まった(全見出し... 続きを読む

受信: 2004.01.27 午前 02:31

» ■サイドバーへの記事一覧表示 from ごまめのつぶやき
ここ数日記事「タイトル抽出技」に凝っているごまめです。 いつも参考にさせてもらってる観測気球さんのこの記事で、ほぼ希望通りの形が実現されてました。 続きを読む

受信: 2004.01.27 午前 08:05

» 見出し一覧をサイドバーに入れてみました from KOROPPYの本棚
かなり役立っているページ内の見出し一覧機能。 カテゴリページのようにコンテンツの多いページだと、見出しが増え、結局コンテンツ部分が縦長になってしまうのが難点でし... 続きを読む

受信: 2004.01.28 午後 04:46

» 無念・・、カスタマイズ失敗 from 無意味なブログを検出しました!
 記事の一覧表示がさせたくて色々探してましたが、観測気球さんの 続きを読む

受信: 2004.04.19 午前 12:54

» カスタマイズ成功じゃ! from 無意味なブログを検出しました!
ページ内の記事一覧を表示すべく、ココログをいじくり回し、装備しようとしているのがJavaScriptだという事にも気づかないまま、素人がたどり着いた結果は、見事... 続きを読む

受信: 2004.04.20 午後 06:00

» かつしこ日記 機能強化作戦(その4) from かつしこのトレーニング日記
今回は、サイドバーに記事一覧を表示させました。 「最近の記事」も標準コンテンツとしてサイドバーに配置できますが、Max10件まで・あまり見やすくない…という欠点... 続きを読む

受信: 2004.11.01 午後 12:16

» ページ内記事タイトル抽出ができないよ from BLOG 爺の裏長屋
どうも先日のココログ大メンテナンス以降ページデザインを変えた途端に「ページ内記事 続きを読む

受信: 2005.02.03 午後 08:39

» 見出し一覧を入れてみた!その2 from Born to Skip
なかなか理解出来ない私の為に簡単にマイリストに貼り付けるだけで 続きを読む

受信: 2005.09.30 午後 08:43

コメント


tsupoさん、こんばんわ。
「extractContentHeadings02a.js」の件で情報のコメントをしていただきありがとうございました。
本当に難しい・・・と何度も頭を抱えてしまったけれど、KOROPPYさんやfacetさんのおかげで、無事に記事一覧を表示させることが出来ました!

投稿者: さゆみ (2005.09.30 午後 08:50)

コメントを書く




※イタズラ防止のため、メールアドレスを入力しないと投稿できません。

次からのコメント入力の手間を省くために、名前やメールアドレスをcookieに記憶しますか?


URL を入力すると、その URL にリンクがはられます。
なお、メールアドレスは公開されません。ご安心ください。


ワード

ニッセン

fujisan.co.jp

楽天市場