ギャラリーモードとは
写真やイラストを見せることに特化したブログを作るためのモードです。
ギャラリーモードにする事で、画像を前面に出した見せ方が可能となります。
※一覧ページ（トップページ、カテゴリアーカイブ、月別アーカイブ）では、記事に含まれる本文が表示されなくなります。
このモードを使用するための独自タグは以下のとおりです。
- <$UseGalleryMode$>・・・ギャラリーモードの宣言タグ
- <$ArticleFirstImage$>・・・記事の最初の画像
- <$ArticleFirstImageThumbnail$>・・・記事の最初の画像のサムネイル
ギャラリーモードが適用されたデザインは以下のようになります。
ギャラリーモードの設定方法
1. <$UseGalleryMode$> について
ギャラリーモードの使用を宣言する為の独自タグです。
このタグでの宣言がないと、ギャラリーモードにはなりません。
デザインのカスタマイズページにて、HTML内の<$HeadSectionCommon$>よりも前に記述してください。
<head> <$UseGalleryMode$> <$HeadSectionCommon$>
- トップページ、カテゴリアーカイブ、月別アーカイブで使用できます。
- 個別記事ページでは使えません。
2. <$ArticleFirstImage$> について
記事で画像が使用されている場合、その最初の画像を表示します。
<IfArticleFirstImage> <div class="ArticleFirstImage"><a href="<$ArticlePermalink$>"><img src="<$ArticleFirstImage$>" alt="<$ArticleTitle ESCAPE$>" /></a></div> </IfArticleFirstImage>
3. <$ArticleFirstImageThumbnail$> について
<$ArticleFirstImage$>のサムネイル表示バージョンです。
使い方・記述方法はほとんど変わりませんが、こちらはサムネイルサイズを指定できます。
サムネイルサイズを指定したい場合、「ThumbnailWidth」 と「ThumbnailHeight」というカスタム設定があるので、それをSetVarを利用してテンプレート内で指定してください。
記述例
<IfArticleFirstImage> <SetVar ThumbnailWidth>360</SetVar> <SetVar ThumbnailHeight>240</SetVar> <div class="ArticleFirstImageThumbnail"><a href="<$ArticlePermalink$>"><img src="<$ArticleFirstImageThumbnail$>" alt="<$ArticleTitle ESCAPE$>" /></a></div> </IfArticleFirstImage>
<$ArticleFirstImage$>、<$ArticleFirstImageThumbnail$> タグは、トップとアーカイブのHTMLテンプレートの、IndexArticlesLoop、CategorizedArticlesLoop、MonthlyArticlesLoop内で使用できます。
