お、おーっと！

AutoPageさんで、CSS（スタイルシート）の変更により「見た目」をカスタマイズするための「文書構造の分析」。第二弾「サイドバー」部分、その２です。

/* サイドバーの各項目 （その２） */

＜div class="rssin01"＞ /* RSS表示エリア - その1 */
＜h3＞(RSSのタイトル[ご自分でつけたもの])＜/h3＞
＜script type="text/javascript"＞……＜/script＞
＜/div＞ /* rssin01 end */
/* RSS表示エリア - その2 も同様で、 */
/* 数字が"01"から"02"に変わるだけと推測されます。 */

＜div class="counter"＞ /* カウンターエリア */
＜h3＞カウンター＜/h3＞
＜div class="counterbody"＞
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* cpunterbody end */
＜/div＞ /* counter end */

＜div class="recentimg"＞
＜h3＞最近の投稿画像＜/h3＞
＜div class="recentimgbody"＞
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* recentimagebody end */
＜/div＞ /* recentimg end */

＜div class="sidetcup"＞ /* teacupサービス表示エリア - 削除できません */
＜h3＞teacupサービス＜/h3＞
＜div class="sidetcupbody"＞
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* sidetcupbody end */
＜/div＞ /* sidetcup end */

＜div class="poweredby"＞ /* AutoPageバナー表示エリア - 削除できません */
＜h3＞Powered by＜/h3＞
＜div class="sidetcupbody" align="center"＞
(Powered by 画像＋リンク)
＜/div＞ /* sidetcupbody end */
＜/div＞ /* poweredby end */

＜div class="rssout"＞ /* RSSリンク画像表示エリア - 削除できません */
(RSSへのリンク画像)
＜/div＞ /* rssout end */

……ようやくサイドバー部分をクリア。
次は一記事だけを表示させたときに登場する部分です。

AutoPageさんで、CSS（スタイルシート）の変更により「見た目」をカスタマイズするための「文書構造の分析」。第二弾は「サイドバー」部分です。
※ここだけで投稿サイズが大きすぎる、と言われてしまいましたので、二分割いたします。

なお、サイドメニューの順序は、あくまでも私が並べている順番であり、メニュー名とクラス名とを一組にして、各ブログで設定された側／順番に並んでいますので、ご注意ください。

/* サイドバーの各項目 */

＜div class="cal"＞ /* カレンダーエリア */
＜h3＞カレンダー＜/h3＞
＜div class="caption"＞
（カレンダー内見出し...年、月）
＜/div＞ /* caption end */
＜table summary="Calendar"＞
（カレンダー本体）
＜/table＞
＜/div＞ /* cal end */

＜div class="sidetcup"＞ /* 広告エリア - 削除できません */
＜h3＞PR＜/h3＞
（Google Adsense）
＜/div＞

＜div class="recentpost"＞ /* 最新の記事エリア */
＜h3＞最近の記事＜/h3＞
＜div class="recentpostbody"＞ /* 最新の記事見出し */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* recentpostbody end */
＜/div＞ /* recentpost end */

＜div class="pastlog"＞ /* 過去ログ（月別）エリア */
＜h3＞過去ログ＜/h3＞
＜div class="pastlogbody"＞ /* 過去ログの見出し */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* pastlogbody end */
＜/div＞ /* pastlog end */

＜div class="cate"＞ /* カテゴリー別ログ・エリア */
＜h3＞記事カテゴリ＜/h3＞
＜div class="catebody"＞ /* カテゴリー別の見出し */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* catebody end */
＜/div＞ /* cate end */

＜div class="recentcomm"＞ /* 最近のコメントエリア */
＜h3＞最近のコメント＜/h3＞
＜div class="recentcommbody"＞ /* 最近のコメントの見出し */
＜div class="catebody"＞ /* カテゴリー別の見出し */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* recentcommbody end */
＜/div＞ /* recentcomm end */

＜div class="recenttb"＞ /* 最近のトラックバックエリア */
＜h3＞最近のトラックバック＜/h3＞
＜div class="recenttbbody"＞ /* 最近のトラックバック見出し */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜/div＞ /* recenttbbody end */
＜/div＞ /* recenttb end */

＜div class="link"＞ /* リンク集エリア */
＜h3＞リンク集＜/h3＞
＜div class="linkbody"＞ /* リンク集表示部分 */
（ ＜ul＞＜li＞ リスト形式で表示 ＜/li＞＜/ul＞ ）
＜p＞→＜a href="/applet/(ユーザーネーム)/link"＞リンク集のページへ＜/a＞＜/p＞
＜/div＞ /* linkbody end */
＜/div＞ /* link end */

＜div class="search"＞ /* 検索フォームエリア */
＜h3＞検索＜/h3＞
＜div class="searchbody"＞ /* 検索フォーム */
＜form method="post" action="/applet/takayan/msgsearch"＞
＜input type="hidden" name="msgsearch" value="1" /＞
＜input type="text" name="skey" value="" size="20" maxlength="50" accesskey="k" tabindex="1" /＞＜br /＞
＜input type="image" name="search" src="/common/img/ja/search_btn.gif" style="width:94px; height:20px" alt="検索" accesskey="x" tabindex="2" /＞
＜/form＞
＜/div＞ /* searchbody end */
＜/div＞ /* search end */

＜div class="sidefree"＞ /* 「自由表示」エリア */
＜h3＞(自由表示部のタイトル[ご自分でつけたもの])＜/h3＞
＜div class="sidefreebody"＞ /* 「自由表示」内容部分 */
＜/div＞ /* sidefreebody end */
＜/div＞ /* sidefree end */

……以下、その２−２に続く。

AutoPageさんでは、CSS（スタイルシート）を変更することで、「見た目」のカスタマイズが可能なのですが、そのためには文書構造がどうなっているか、という情報が必要です。
そこで、AutoPageさんの文書構造を分析してみます。

まずは、トップページの内容（サイドバーは除く）から。

※ちなみに、「お、おーっと！」のおおもとのデザインパターンは「スタンダードBlue（右メニュー）」です。

====================

/* トップ・ページ（記事複数表示） */

＜div id="tcadlay"＞
（将来テキスト広告が挿入される予定？）
＜/div＞ /* tcadlay end */

＜div id="tcpbody"＞ /* ここから本体 */

＜div id="tcsmenulay"＞
（何をしようとしているのか不明...）
＜/div＞ /* tcsmenulay end */

＜div id="tctoptitlelay"＞
＜h1＞(ページのタイトル)＜/h1＞
＜p＞(サブタイトル)＜/p＞
(目的不明行あり、1行省略）
＜/div＞ /* tctoptitlelay end */

＜div id="tctopfreelay"＞
（「トップページの編集」で付加できるエリア）
＜/div＞ /* tctopfreelay end */

＜div id="tcsidelay"＞ /* 左サイド */
＜div id="sidemenu"＞ /* 左サイドメニュー */
（左サイドバー用のエリア）
＜/div＞ /* sidemenu end */
＜/div＞ /* tcsidelay end */

＜div id="tcmainlay"＞ /* 記事エリア */
/* 以下の(A)〜(B)間を繰り返し */

(A)
＜div class="postdate"＞ /* ひとつの記事 */
＜h2＞（投稿年月日）＜/h2＞

＜div class="postone"＞ /* 記事内容 */

＜div class="posttitle"＞
（＜a＞タグに囲まれている記事タイトル）
＜span class="postcate"＞
（記事のカテゴリ）
＜/span＞ /* postcate end */
＜/div＞ /* posttitle end */

＜div class="postbody"＞
（記事本文）
＜/div＞ /* postbody end */

＜div class="postcommtb"＞ /* コメント・トラックバック */
＜div class="postname"＞
（投稿者）
＜/div＞ /* postname end */
（詳細ページ／コメント（数）／トラックバック（数））
＜/div＞ /* postcommtb end */

＜/div＞ /* postone end */
＜/div＞ /* postdate end */
(B)

＜/div＞ /* tcmainlay end */

＜div id="tcside2lay"＞ /* 右サイド */
＜div id="sidemenu2"＞ /* 右サイドメニュー */
（右サイドバー用のエリア）
＜/div＞ /* sidemenu2 end */
＜/div＞ /* tcside2lay end */

＜div id="tcad2lay"＞ /* 広告エリアその2 */
＜ul id="catenavi"＞ /* teacup.コミュニティカテゴリ */
＜li class="catetitle"＞ ◇teacup.コミュニティカテゴリ＜/li＞
＜li class="catelist"＞（各カテゴリへのリンク）＜/li＞
＜/ul＞
＜/div＞ /* tcad2lay end */

＜div id="tcfootlay"＞ /* footerフッター */
（著作権表示）
＜/div＞ /* tcfootlay end */
＜/div＞ /* tcpbody=本体= end */

＜div id="tcloginlay"＞ /* 「投稿・管理画面」ボタン・エリア */
＜div class="loginfrm"＞ /* ログイン・フォーム */
（ボタン等）
＜/div＞ /* loginfrm end */
＜/div＞ /* tcloginlay end */

====================

……個人的に「？」なところおよび邪推。

(1) "postdate" は、本当は記事の日付別に一回だけ表示させようとしたものの、ヤプログ！でのユーザーさんの反応を見て、あわてて全記事に表示させるようにした？（邪推）
※ "postone" が本来「個々の投稿記事」を示す名前のような気が……。

(2) 記事タイトルが ＜hx＞ 〜 ＜hx＞ で囲まれていないのは、ちょっと悲しい。

(3) 「トップページの編集」をされた方は、id="tctopfreelay"のCSS指定によるカスタマイズがほぼ必須かと。

……次回は、サイドバーの各項目のクラス名です。