MovableType.net でカスタマイズしてみた…

【sample】新規作成したテンプレート・モジュール

[top-blogs]サイトに設置

サイトトップページ、ヘッダー下に、配下のブログのイメージ画像+ブログタイトル+ブログ概要 を表示

<mt:PagesHeader> 
  <div class="row mt-row"> 
</mt:PagesHeader> 
   <mt:Blogs include_blogs="ブログ識別子"><!--識別子は任意。複数の場合は半角カンマで区切る--> 
      <a href="<$mt:BlogURL$>"> 
         <div class="col-sm-6 pagemenu__bgwrap" 
          style="background-image: url(<$mt:BlogURL$>/images/top-image.jpg)"> 
             <div class="pagemenu__bg"><!--黒背景--></div> 
             <article class="pagemenu__textwrap">  
                <h3 class="pagemenu__title">
                 <a href="<$mt:BlogURL$>"><$mt:BlogName encode_html="1"$></a>
                 </h3> 
                   <p class="pagemenu__text" data-mh="my-group"><$mt:BlogDescription$></p>  
             </article> 
             </div> 
      </a> 
    </mt:Blogs> 
<mt:PagesFooter> 
</div> 
</mt:PagesFooter>

※メインページに以下のタグでインクルードする

<$mt:Include module="top-blogs"$>

 

[category-list]サイトに設置

サイトトップページに、カテゴリ画像、カテゴリタイトル、概要を表示

<div class="container-fluid mt-container-fluid"> 
   <div class="col-sm-3"> 
      <h3 class="newsarea__title">ブログタイトル</h3> 
   </div> 
   <mt:Blogs include_blogs="ブログ識別子"> 
   <div class="col-sm-9 newsarea__entry"> 
      <ul> 
         <mt:ArchiveList archive_type="Category">  
         <li>
          <mt:CustomFieldAsset identifier="カテゴリ用ヘッダー背景画像カスタムフィールドの識別子"> 
           <a href="<$mt:CategoryArchiveLink$>"> 
             <article class="newsentry__item clearfix"> 
               <dl class="catalist-dl"> 
               <dt class="catalist-dt"> 
                 <img src="<$mt:AssetThumbnailURL>" width="200"> 
               </dt> 
           </mt:CustomFieldAsset> 
               <dd class="catalist-dd"> 
                  <h3 class="newsentry__title"><$mt:CategoryLabel encode_html="1"$></h3> 
                    <p class="newsentry__main"><$MTCategoryDescription$></p> 
               </dd>
               </dl> 
             </article> 
           </a> 
          </li> 
          </mt:ArchiveList> 
        </ul>  
     </div> 
   </mt:Blogs> 
</div>

※メインページに以下のタグでインクルードする

<$mt:Include module="category-list"$>

※ dl dt dd のクラスは新たに作成したので、CSSを追加設定する

 

category-list]ブログに設置

ブログBのトップページに、カテゴリ画像+カテゴリタイトル+カテゴリの最新記事5件を表示

<div class="container-fluid mt-container-fluid">  
 <div class="col-sm-3"> 
    <h3 class="newsarea__title">ブログB</h3> 
 </div> 
 <mt:Blogs include_blogs="ブログ識別子B"> 
 <div class="col-sm-9 newsarea__entry"> 
   <ul> 
       <mt:ArchiveList archive_type="Category">  
       <li>  
       <article class="newsentry__item clearfix"> 
         <dl class="catalist-dl"> 
         <dt class="catalist-dt"> 
         <a href="<$mt:CategoryArchiveLink$>"> 
             <mt:CustomFieldAsset identifier="catimage"> 
              <img src="<$mt:AssetThumbnailURL>" width="100" title="<$MTCategoryLabel$>" 
                   alt="<$MTCategoryLabel$>"> 
         </a> 
         </dt> 
            </mt:CustomFieldAsset> 
         <dd class="catalist-dd"> 
            <h3 class="newsentry__title"><a href="<$mt:CategoryArchiveLink$>"><$mt:CategoryLabel encode_html="1"$></a></h3> 
               <mt:Entries lastn="5"> 
                  <mt:EntriesHeader>
                    <ul class="mori-entry-title">
                    </mt:EntriesHeader> 
                     <li><a href="<$MTEntryPermalink$>"><$mt:EntryTitle$></a></li> 
                   <mt:EntriesFooter>
                     </ul>
                     </mt:EntriesFooter> 
              </mt:Entries> 
         </dd> 
         </dl> 
       </article> 
       </li> 
       </mt:ArchiveList> 
    </ul> 
 </div>
 </mt:Blogs> 
 </div>

※メインページに以下のタグでインクルードする

<$mt:Include module="category-list"$>

※ dl dt dd のCSSを追加設定する

  • トップへ戻る
  • カテゴリアーカイブ
  • HOME

コメント

メールアドレスが公開されることはありません。* は必須項目です。


*