Livedoor blogのトップページに、見出し画像と記事概要を並べたいと思っていました。
やっとその方法がわかったので、記録しておきます。
1.見出し画像を指定する
まずは、各記事で見出し画像に使いたい画像を指定します。

記事を書くページの下の方のオプション設定に
見出し画像というところがあります。
「画像を選択」ボタンを押すと、アップロードした画像から好きな画像を選ぶことができます。
※選択しない場合は、各記事の最初の画像が見出し画像に使われます。
2.見出し画像をトップページに表示する
デザイン設定→カスタマイズ→トップページの
<!– ArticlesLoop Start –>と<!– ArticlesLoop End –>の間の配置したい場所に
<ifarticlecoverimage>
<figure><img src="<$ArticleCoverImage$>" vspace="10" hspace="10" align="left"></figure>
</ifarticlecoverimage>
を入れます。
hspace=”10″ vspace=”10″は画像の上下左右に空白を入れるタグです。
記事概要を画像の横に並べるためにalign=”left”を入れてあります。
width= height= で画像のサイズを規定することもできます。
3.記事概要をトップページに表示する
記事概要のタグは<$ArticleDescription$>です。
<div class="article-title-outer">
<h2 class="article-title entry-title">
<a href="<$ArticlePermalink$>" title="個別記事ページへ" rel="bookmark"><$ArticleTitle ESCAPE$></a></h2>
</div>
<IfArticleCoverImage>
<img src="<$ArticleCoverImage$>" align="left" hspace="10" vspace="10">
</IfArticleCoverImage>
<div class="article-body entry-content">
<div class="article-body-inner" >
<$ArticleDescription$>
<a href="<$ArticlePermalink$>" title="個別記事ページへ" > …記事を読む</a>
</div>
<$ArticleTagsList$>
</div>
コメント