マオのライブオンメモ このページをアンテナに追加 RSSフィード

2009-05-12

プロフィールの表示方法

| プロフィールの表示方法 - マオのライブオンメモ を含むブックマーク はてなブックマーク - プロフィールの表示方法 - マオのライブオンメモ プロフィールの表示方法 - マオのライブオンメモ のブックマークコメント

id:bestdayeverさんが、日記のサイドバーにプロフィールを表示する方法がわからないと書いてましたので、簡単に説明したいと思います。もっと簡単にできる方法があれば、フォローしていただけると幸いです。

日記(ブログ)のサイドバーにプロフィールを表示する方法

【重要なお知らせ】2009年5月12日に掲載した内容に一部誤りがあり、説明の通りに設定するとサイドバー全体のデザインがおかしくなってしまうことが分かりました。以下の記事は既に修正してありますが、5月13日までにプロフィールを表示する設定をされた方は、お手数をおかけしますが「<div class="sidebar">」と「<div class="hatena-moduletitle">」の間に「<div class="hatena-module">」の1行が入っているかどうかをご確認いただき、抜けているようであれば追加していただきますようお願いいたします。

簡単設定の「かんたんデザイン設定」ではサイドバーにプロフィールを表示することができないみたいですので、私は詳細設定の「ページのフッタ(HTMLタグ利用可)」を編集してプロフィールを表示しています。

具体的には、詳細設定の「ページのフッタ(HTMLタグ利用可)」が以下のように設定されていると思いますので、

</div>
<div class="sidebar">
	<hatena name="~

以下のように<div class="sidebar">の次の行からプロフィールを表示するためのタグを追加します(追加するのは赤字の部分)。

</div>
<div class="sidebar">
	<div class="hatena-module">
	<div class="hatena-moduletitle">プロフィール</div>
		<div class="hatena-modulebody">
			<div class="hatena-profile">
				<p class="hatena-profile-image">
					<a href="※1"><img src="※2" alt="※3"></a>
				</p>
				<p class="hatena-profile-id"><a href="※1">※3</a></p>
				<p class="hatena-profile-body">※4</p>
			</div>
		</div>
	</div>
	<hatena name="~

※1はリンク先。私の場合は、はてなのプロフィールページ「http://www.hatena.ne.jp/yakyuweb/」。「/yakyuweb/」の部分を自分のはてなIDに変更すると、自分のプロフィールページになります。

※2は表示する画像。私の場合は、はてなプロフィール画像http://www.hatena.ne.jp/users/ya/yakyuweb/user_p.gif」。プロフィールアイコンを表示する場合は「http://www.hatena.ne.jp/users/ya/yakyuweb/profile.gif」。「/ya/yakyuweb/」の部分は、「/ya/」は自分のはてなIDの先頭2文字、「/yakyuweb/」は自分のはてなIDに変更すると、自分のプロフィール画像またはプロフィールアイコンになります。

※3は自分のはてなID。私の場合は「yakyuweb」。

※4は自己紹介文。ご自由にどうぞ。

追記 (2009-05-13 01:15)

<div class="sidebar">の次の行、<div class="hatena-module">が抜けていました。大変失礼いたしました。

日記(ブログ)のサイドバーfotolifeの画像一覧を表示する方法

また、「かんたんデザイン設定」で「最新の画像」モジュールを選んでも、「編集画面モード」の「今日の一枚」でアップロードした画像しか表示されず、「その場編集モード」や「複数写真のアップロード」でfotolifeアップロードした画像は表示されません。fotolifeアップロードした画像一覧を日記のサイドバーに表示する方法も紹介します。

プロフィールと同様に、詳細設定の「ページのフッタ(HTMLタグ利用可)」で適当なところに以下の1行を追加します(追加するのは赤字の部分)。

	<hatena name="~
	<hatena name="rss" url="※5" template="hatena-photo" listlimit="※6" moduletitle="最新の画像">
	<hatena name="~

※5はfotolifeRSSフィード。私の場合は「http://f.hatena.ne.jp/yakyuweb/rss」。「/yakyuweb/」の部分を自分のはてなIDに変更すると、自分のfotolifeRSSフィードになります。

※6は表示する画像の数。5~6くらいに設定するのが良さげです。

ご注意

なお、あとで「かんたんデザイン設定」でデザインを変更すると、詳細設定の「ページのヘッダ」「ページのフッタ」の内容が上書きされてしまいますので、デザイン変更後に改めて上記の設定が必要です。

bestdayeverbestdayever 2009/05/13 00:43 大変わかりやすい解説ありがとうございました!さっそく使ってみたいと思います。

ゲスト



トラックバック - http://live-on.g.hatena.ne.jp/yakyuweb/20090512