応用
記事の投稿者の名前とプロフィール画像を表示したエリアを作成する
記事の投稿者情報は、下記MTタグで取得できます。
使用するMTタグ
- mt:AuthorName … プロフィール設定の「ユーザー名」を表示する
- mt:AuthorDisplayName … プロフィール設定の「表示する名前」を表示する
- mt:AuthorURL … ユーザーのプロフィール設定で入力した「ウェブサイト URL」を取得
- mt:AuthorUserpic … 登録ユーザーのプロフィール画像を表示する為のimg要素を取得
- mt:AuthorUserpicURL … 登録ユーザーのプロフィール画像 URLを取得
- mt:AuthorEmail … ユーザーのプロフィール設定で入力した「メールアドレス」を取得
これらを組み合わせて、投稿者情報の表示エリアを作っていきます。
「アーカイブ・テンプレート」の「アーカイブタイプ」「記事」の中で下記記述を追加できます。
記述・出力サンプル
「ユーザー名」、「img要素」を表示
<div>
<h1><$mt:AuthorName$></h1>
<$mt:AuthorUserpic$>
</div>
ユーザー名
プロフィール画像の img タグに id や class などを記述したい場合は<$mt:AuthorUserpicURL$>を使用します。
「img要素」をmt:AuthorUserpicURLで表示
実際にブログ運用する際は、プロフィール画像の設定が無い場合も想定できます。
そんなときはmt:ifでデフォルト画像を表示するよう振り分けをしておくことで、空欄になってしまうことを防げます。
また、ユーザー名をクリックすると同ユーザーの記事一覧ページにリンクされると理想的です。
下記に実用的な例をご紹介します。
実用例
<div>
<p>この記事の筆者</p>
<div>
<figure>
<img src="<mt:If tag='AuthorUserpicURL' square="1"><$mt:AuthorUserpicURL$><mt:Else>https://movabletype.net/dict/images/hanaicon.png</mt:If>" width="90" height="90">
</figure>
<div>
<h1><a href="<$mt:ArchiveLink archive_type='Author'$>"><$mt:EntryAuthorDisplayName$></a></h1>
<p>メールアドレス:<a href="mailto:<$mt:AuthorEmail$>"><$mt:AuthorEmail$></a></p>
</div>
</div>
</div>
出力
この記事の筆者
ユーザー名
メールアドレス:●●●@sample.com
※スタイルシートは別途用意してください。