久保清隆のブログ

ライフハック、健康、旅行など、役立つ情報を書きます。

Yahoo!ログールのデザインをはてなダイアリーでカスタマイズする方法

前回Yahoo!ログールの使い方などについて書いた。
今回ははてなダイアリーでカスタマイズする方法。

普通にブログパーツのコード

<script type="text/javascript" charset="utf-8" src="http://parts.logoole.yahoo.co.jp/parts/script/87cjhim80hppm6qwauoxyok691otppnx"></script>
<div class="yahoo-tracks-widget"></div>

を書くと、サイドバーに裸の状態で表示されてしまう。しかも左に偏ってる。
そこで、まず枠を作る。

<div class="hatena-module">
<div class="hatena-moduletitle">あしあと</div>
<div class="hatena-modulebody">

<script type="text/javascript" charset="utf-8" src="http://parts.logoole.yahoo.co.jp/parts/script/87cjhim80hppm6qwauoxyok691otppnx"></script>
<div class="yahoo-tracks-widget"></div>

</div>
</div>

これで枠が完成。
しかし、この状態だと枠の中で左側に偏りバランスが悪い。
そこで、divで調整しようとしたんだけど、全然うまくいかない。
仕方ないからテーブルを使う。

<div class="hatena-module">
<div class="hatena-moduletitle">あしあと</div>
<div class="hatena-modulebody">
<table border="0" width="205px">
  <tr>
    <td style="width:20px;"></td>
    <td>

<script type="text/javascript" charset="utf-8" src="http://parts.logoole.yahoo.co.jp/parts/script/87cjhim80hppm6qwauoxyok691otppnx"></script>
<div class="yahoo-tracks-widget"></div>

    </td>
  </tr>
</table>
</div>
</div>

alignでcenterに指定しても真ん中に来てくれないので、tdを使って無理やり真ん中に持ってくる。
これで完成。
ただ、テーブルを使うと両サイドに少し線が入ってしまう。
まぁこのくらいなら気にならないけど。



お読み頂きありがとうございます。
少しでもお役に立てたらクリックお願いします↓。
ブログランキング・にほんブログ村へにほんブログ村 IT技術ブログへにほんブログ村 IT技術ブログ プログラム・プログラマへ