サイドバー編集機能の安定した使い方

サイドバーの基本的な作り

 
 <div class="hatena-module-title">
  "タイトル"
 </div>

 <div class="hatena-module-body">
 <ul class="hatena-urllist">
 <li><a href="#">リンク1</a></li>
 <li><a href="#">リンク2</a></li>
 <li><a href="#">リンク3</a></li>
 </ul>
 </div>

モジュールの編集は自由にできるようですが、適当にタイトルを入力していくと

各文字の大きさやインデントがずれてしまうようです。

スタイルシートをまとめて編集するのも含めてこの形が妥当かと

既存のモジュールを消す

上記の書き方でなくとも、すでにあるモジュールを消したり、デザイン自体を変えてしまえば

インデントのずれや文字の大きさのずれを解消できます

 .hatena-module-title{
    display: none;
 }
 .hatena-urllist{
    display: none;
 }

これで不要なデフォルトのリンクは消えます

この場合一番初めのモジュールも変わってしまうので

各idを変えておきましょう

またサイドバー自体削除したいのであれば

 #box2-inner{
   display: none;   
 }

こうすると綺麗にサイドバーは消えます

TOPに戻るボタン設置

 
<script type="text/JavaScript">
function Scroll_to_the_top(){
window.scrollTo(0, 0)
}
</script>
<br>
<div onClick="Scroll_to_the_top()" style="background: #777; border: solid 3px #000; width: 100px; height: 30px;">
Scroll to the top
</div>

サイドバーのモジュールにもJavaScriptやstyle指定でのCSS編集が可能のようです

これからの編集機能のバリエーションに期待したいですね