Dear Days

step1
MOON PHASESのサイトで好きなデザインを選び、専用のHTMLを生成します。（全部英語だけど大丈夫ヨ）

step2
それをテンプレ編集のHTMLの好きな場所に貼り付け、前後に必要なタグを書き加えます。私の場合はベースがshowerですが、下記のように挿入しました。太字が挿入、斜体がさっき生成したHTMLです。

<!-- BEGIN Moon_Phases -->
<div class="links">
<div class="linktitle">
MOON PHASES
</div>
<div class="linktext">

<!-- // Begin Current Moon Phase HTML (c) CalculatorCat.com // --><table width="70%" bgcolor="#000000" style="background-color:#000000" cellpadding="0" cellspacing="3" border="0"><tr><td align="center" style="border: 1px solid #AFB2D8;background-color:#000000; color:#ffffff"><script language="JavaScript" type="text/javascript" src="http://www.calculatorcat.com
/codesrc/moon/phasenow_b.js"></script><script language="JavaScript" type="text/javascript" src="http://www.calculatorcat.com
/codesrc/moon/phasenow_2s2.js"></script><font style="font-size:10px;font-family:verdana,arial,sans-serif;color:ffffff" face="verdana,arial,sans-serif" size="1"><br /><a href="http://www.calculatorcat.com
/moon_phases/moon_phases.phtml" target="moon_ph" style="color:878787;">moon phases</a><br />&nbsp;</font></td></tr></table><!-- // end moon phase HTML // -->

</div>
</div>
<!-- END Moon Phases -->

以上で貼り付けは完了ですが・・

step3
このままだとテーブル幅が大きすぎてサイドメニューが全部下にずれちゃいます。なので、先ほどハリハリしたHTMLの100%を任意の幅に変えます。因みに私は70％にしました。

これで完成。お疲れ様でした。

折角かっこいーのでコレに合わせてサイトデザインも変えなくっちゃ