はてなダイアリーでのサイドバー構築

CSS確認

まず下準備としてCSS上でサイドバーがどの程度の幅に設定されているか確認。

適当なページでソースを開き、10行過ぎ辺りの

<link rel="stylesheet" href="/theme/○/○.css" type="text/css" media="all">

の 「/theme/○/○.css」部分をコピー、「http://d.hatena.ne.jp」の後につけ

http://d.hatena.ne.jp/theme/○/○.css

というアドレスにアクセスすれば、選択しているテーマのCSSが表示される。

そのCSSの中からサイドバーに関する記述（おそらく.sidebar以下）を確認。
「width」が何pxかをメモ。

この「width」の値より大きい画像などを設置すると横に表示されず、全体の下に表示されるなど崩れたレイアウトになる。
（多くのテーマではマージンを取ったりしているため、「width」の値より崩れず表示できる値は小さいことが多い）

アドレス画像

GmailとHotmailは E-Mail Icon Generator で画像作成。
アドレスが長く画像の幅が大きかったため、ちまちまとペイントで修正。

Skypeはアイコンを Skype - Skype 日本語ブログ - 名刺に使えるSkypeアイコン から入手。
E-Mail Icon Generator でProvider not availableの方に切り替え、Foregroundのカラーコードに「0099ff」を指定。
後はこの二つをちまちまペイントで合成、修正。

画像をフォトライフの公開範囲を自分のみにしたフォルダにアップ。
画像のURLを取得。（画像のURLを直接指定すると公開範囲を自分のみにしても表示される様子）

CSS上の記述に合うようページのフッタ内に記述。これはリンクリストでも同様。（以下例）

<div class="hatena-module">
	<div class="hatena-moduletitle">○</div>
		<div class="hatena-modulebody">
			<ul class="hatena-urllist">
				<li><img src="○"></li>
			</ul>
		</div>
</div>

メールフォーム

対応ブログパーツ一覧 - はてなダイアリーのヘルプ から忍者メールフォームを発見。　登録を済ませて設置。　幅が選択式なので合うかどうかチェック。
ブラウザによってスクリプト部分を反映するものと、反映しないものがあり、下のモジュール終わり線がずれる場合があるみたい。
とりあえずサイドバーの一番下に配置し、改行タグでごまかし。

いろいろ設置した後に気付いたヘルプ

はてなダイアリーガイド「サイドバーに何かを入れる」とは - はてなキーワード