読者です 読者をやめる 読者になる 読者になる

MediaLab Love Chapter 2

Assistance of MediaLab Love about Javascript test and more...

はてなダイアリーを3ペイン(3分割)にする

 はてなダイアリーで選べるデザインは、日記+サイドバーの2分割しかありません。ここでは他のブログのように、3分割(日記+両サイドバー)にしてみようと思います。

 まず詳細デザイン設定のページを開き、「ページのフッタ」の最後に、追加したいサイドバーの中身を入力します。ここでは例として、キーワード群の表示をします。

<div class="sidebar2">
	<hatena name="keywordcloud" template="hatena-module">
</div>

 そしてその下の「スタイルシート」の最後に、次の文を入力します。

.hatena-body{
	width:95%;
}
.main{
	width:55%;
	margin:0 auto;
}
.sidebar{
	left:0;
	width:20%;
}
.sidebar2{
	position:absolute;
	top:19px;
	right:0;
	width: 20%;
	padding: 0;
	margin: 0 ;
	font-size: 90%;
	text-align: left;
	border: none;
}

 .sidebar2では、テーマ固有のCSSファイルから.sidebar*1の部分をコピーして、leftの部分をright:0;に書き換えてください。
 ※注意

  • この方法はデフォルトのサイドバーが左という条件でやりました。サイドバーが右でもrightとleftを入れ替えればいいだけだと思うのですが、未確認です。
  • 最低でもFirefoxInternet Explorerの2つを使って確認を行ってください。
  • 自己責任でお願いします。

 スクリーンショットを載せておきます。

*1:テーマによってdiv.sidebarの場合もあります