EC studio EC studio デザインブログ

以前にリクエストをいただいていたWordpressでの
投稿者別顔アイコン表示方法を紹介したいと思います。

顔アイコンを表示させると投稿者別の投稿がわかりやすくなり、
興味がある記事が探しやすくなったりします。ぜひお試しください。

アイコンに名前をつける

まずはアイコンを作成して、名前をつけます。
この名前をつける時ですが、ユーザー名(ログインID)をつけてください。
ユーザー名はWordpressの管理画面内の「ユーザー」から確認してください。

画像をフォルダにいれる

作成したアイコンを画像フォルダの中にいれます。
(このブログではテーマの中のimagesフォルダにいれています)

WordPressのテーマテンプレートにタグを入れる

顔アイコンを表示させたいテンプレートに
Wordpressのテンプレートタグを挿入します。

顔アイコンの切り替えはthe author loginというテンプレートタグを使用しています。
しかし、このタグはWordpress2.8では非推奨なので、
Wordpress2.8をご使用の場合はthe author metaを使うことをおすすめします。

このテンプレートタグは記事の投稿者のユーザー名(ログインID)を表示します。
投稿者ごとにユーザー名が変わるので、ユーザー名で名前をつけた画像アイコンを
投稿者ごとに切り替えることができます。

実際のタグ

HTML:
  1. <img src="http://designblog.ecstudio.jp/wp-content/themes/new_designblog/images/<?php the_author_login(); ?/>.jpg" alt="" />

imgタグのsrc 属性で指定したパスの中に<?php the_author_login(); ?>
というテンプレートタグが挿入されています。

このタグが投稿者ごとに変わるので画像パスが変更され、
投稿者別の顔アイコンを表示させることができます。

WordPressのテンプレートタグを使って、
よりWordpressを使いこなしましょう。


関連した記事:
投稿者
カテゴリー
人気のエントリー
最近のエントリー
アーカイブ
Copyright© ChatWork, All Rights Reserved. secured by ESET.