livedoor ブログスタッフによるギャラリーテンプレートサンプル : [info] “上級者向け”ギャラリーテンプレート作成方法

<$UseGalleryMode$>
<$ArticleFirstImage$>
<$ArticleFirstImageThumbnail$>

この3つの独自タグが新しく定義されました。

1. <$UseGalleryMode$> について

ギャラリーモードに設定するための宣言です。

■

デザインのカスタマイズページにて、タグ内の「<$HeadSectionCommon$>」よりも前に記述してください。

<head>
<$UseGalleryMode$>
<$HeadSectionCommon$>

■

トップページ
カテゴリアーカイブ
月別アーカイブでお使いいただけます。
個別記事ページでは使えません。

2. <$ArticleFirstImage$> について

とりあえず記事Loop内に、この記述を追加してみてください。

<IfArticleFirstImage>
<div class="ArticleFirstImage"><p><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>
<$ArticleFirstImageThumbnail$>
</IfArticleFirstImage>

※<$ArticleFirstImage$>、<$ArticleFirstImageThumbnail$> どちらもギャラリーモードでのみお使いいただける独自タグです。

Comments

- 玉の輿度チェッカー's comment
- March 22, 2011 10:47
- 今話題の玉の輿度チェッカーで簡単にお金持ちの相手をGETしませんか！？その理由は登録者を厳選して最低年収を1000万以上の稼ぎが無い方には、ご遠慮願うようにしているからなのです。あなたは玉の輿に乗ることができるか！？

- aaa's comment
- March 06, 2013 21:58
- 引用される本文側の画像については通常のimgタグで記述されたもので構わないのでしょうか?
  何か設定しないと最初の画像として認識されないということはないでしょうか?
  テンプレートを本記事を参考に触っていますが$ArticleFirstImage$が認識されません。

livedoor ブログスタッフによるギャラリーテンプレートサンプル

[info] “上級者向け”ギャラリーテンプレート作成方法

1. <$UseGalleryMode$> について

2. <$ArticleFirstImage$> について

3. <$ArticleFirstImageThumbnail$> について

Comments

Add Comments

ライブドアスタッ...

名前
	情報を記憶評価顔星

livedoor ブログスタッフによるギャラリーテンプレートサンプル

[info] “上級者向け”ギャラリーテンプレート作成方法

1. <$UseGalleryMode$> について

2. <$ArticleFirstImage$> について

3. <$ArticleFirstImageThumbnail$> について

Comments

Add Comments

ライブドア スタッ...

ライブドアスタッ...