WEBデザイン　BLOG

WEBデザインをはじめMT・Firefox・WEB2.0関連情報等の備忘録

8月 16日 2006

エントリーアーカイブページブロックのモジュール化2

スカイパー 13:47 MT , カスタマイズ
Tags: Movable Type , MT , カスタマイズ , モジュール , レイアウト

エントリーアーカイブページの各ブロック毎でのモジュール化のためのコードデータを残しておきます。前回のエントリーの続きとなります。前回のコードをご覧になっていない方は、エントリーアーカイブページブロックのモジュール化1をご覧下さい。

コメントブロックのモジュール化（エントリーアーカイブページ）

エントリー下の「コメント」部分のモジュール化です。モジュール名は好きな名前でかまいません。大文字・小文字の組み合わせでもOKです。とりあえず、モジュール名を”comment”にて登録しておきます。以下のテキストエリアの部分のコードがデフォルト（初期設定）でのコードとなります。下記のコードをすべて選択してモジュール登録すればOKです。

実際にメインページでのコードは<$MTInclude module="comment"$>となります。

<MTIfCommentsActive>
                     <div id="comments" class="comments">
                        <MTComments>
                           <MTCommentsHeader>
                              <div class="comments-content">
                                 <h3 class="comments-header">コメント (<$MTEntryCommentCount$>)</h3>
                           </MTCommentsHeader>
                                 <a id="c<$MTCommentID pad="1"$>"></a>
                                 <div class="comment" id="comment-<$MTCommentID$>">
                                    <div class="comment-inner">
                                       <div class="comment-header">
                                          <$MTCommentAuthorLink default_name="Anonymous" show_email="0"$><MTIfNonEmpty tag="CommentAuthorIdentity"> <$MTCommentAuthorIdentity$></MTIfNonEmpty>:
                                       </div>
                                       <div class="comment-content">
                                          <$MTCommentBody$>
                                       </div>
                                       <p class="comment-footer">
                                          投稿者:
                                          <$MTCommentAuthorLink default_name="匿名"$> <$MTCommentAuthorIdentity$> |
                                          <a href="#comment-<$MTCommentID$>"><$MTCommentDate$></a>
                                       </p>
                                       <p class="comment-footer-experimental">
                                          日時:
                                          <a href="#comment-<$MTCommentID$>" title="このコメントへのパーマリンク"><$MTCommentDate format="%x %H:%M"$></a>
                                       </p>
                                    </div>
                                 </div>
                           <MTCommentsFooter>
                              </div>
                           </MTCommentsFooter>
                        </MTComments>

<MTEntryIfCommentsOpen> 
                        <form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">
                           <input type="hidden" name="static" value="1" />
                           <input type="hidden" name="entry_id" value="<$MTEntryID$>" />
                           
                           <div class="comments-open" id="comments-open">
                              <h2 class="comments-open-header">コメントを投稿</h2>
                              
                              <div class="comments-open-content">
                                 <script type="text/javascript">
                                 
                                 </script>
                              
                                 <MTIfCommentsModerated>
                                 <p class="comments-open-moderated">
                                    (いままで、ここでコメントしたことがないときは、コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)
                                 </p>
                                 </MTIfCommentsModerated>

<div id="comments-open-data">
                                    <div id="name-email">
                                       <p>
                                          <label for="comment-author">名前:</label>
                                          <input id="comment-author" name="author" size="30" />
                                       </p>
                                       <p>
                                          <label for="comment-email">メールアドレス:</label>
                                          <input id="comment-email" name="email" size="30" />
                                       </p>
                                    </div>

<input id="comment-url" name="url" size="30" />
                                    </p>
                                    <p>
                                       <label for="comment-bake-cookie"><input type="checkbox"
                                          id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
                                          この情報を登録しますか?</label>
                                    </p>
                                 </div>

<p id="comments-open-text">
                                    <label for="comment-text">コメント: <MTIfAllowCommentHTML>(スタイル用のHTMLタグが使えます)</MTIfAllowCommentHTML></label>
                                    <textarea id="comment-text" name="text" rows="15" cols="50"></textarea>
                                 </p>
                                 <div id="comments-open-footer" class="comments-open-footer">
                                    <input type="submit" accesskey="v" name="preview" id="comment-preview" value="確認" />
                                    <input type="submit" accesskey="s" name="post" id="comment-post" value="投稿" />
                                 </div>
                              </div>
                           </div>
                        </form>
                        </MTEntryIfCommentsOpen>
                     </div>
                     </MTIfCommentsActive>

サイドブロック：Aboutブロックのモジュール化（インデックスページ）

サイドコンテンツ中の「About」部分のモジュール化です。モジュール名は好きな名前でかまいません。大文字・小文字の組み合わせでもOKです。とりあえず、モジュール名を”about”にて登録しておきます。以下のテキストエリアの部分のコードがデフォルト（初期設定）でのコードとなります。下記のコードをすべて選択してモジュール登録すればOKです。

実際にメインページでのコードは<$MTInclude module="about"$>となります。

サイドブロック：フィードブロックのモジュール化（インデックスページ）

サイドコンテンツ中の「フィード」部分のモジュール化です。モジュール名は好きな名前でかまいません。大文字・小文字の組み合わせでもOKです。とりあえず、モジュール名を”feed”にて登録しておきます。以下のテキストエリアの部分のコードがデフォルト（初期設定）でのコードとなります。下記のコードをすべて選択してモジュール登録すればOKです。

実際にメインページでのコードは<$MTInclude module="feed"$>となります。

以上までがエントリーアーカイブでのすべてのブロックのモジュール化の為のデフォルトコードとなります。

メインページのコードの書き換え

上記の各ブロックをモジュール化ができましたら、【テンプレート】＞【アーカイブ】の中から【エントリーアーカイブ】をクリックして、以下のようにコードを書き換えます。デフォルトのコードよりもかなり簡素化できています。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<$MTEntryTrackbackData$>

<$MTInclude module="HEADER"$>

<$MTInclude module="entrynavigation"$>

<$MTInclude module="entry"$>

<$MTInclude module="trackback"$>
					
					<$MTInclude module="comment"$>
                  </div>
               </div>
               <div id="beta">
                  <div id="beta-inner" class="pkg">

<$MTInclude module="search"$>

<$MTInclude module="about"$>

<$MTInclude module="feed"$>

<$MTInclude module="CClicense"$>
                     
					<$MTInclude module="MovableTypeLink"$>

</div>
               </div>

</div>
         </div>
      </div>
   </div>

以上がエントリーアーカイブのコードとなります。このように書き直すことでコードがかなり簡素化できます。まだ、カテゴリーページ・アーカイブページ・検索結果表示ページなど各ページ毎にモジュール化を行い、コードの書き換えをする必要があります。

Technorati Tags: Movable Type , MT , カスタマイズ , モジュール , レイアウト

<<; エントリーアーカイブページブロックのモジュール化１ | Top | MTテンプレートタグを使ってmetaタグ生成方法 »

トラックバック

このエントリーのトラックバックURL:
http://weblibrary.s224.xrea.com/x/mt/mt-tb.cgi/21

WEBデザイン BLOG