ブログパーツの作り方まとめ

Flashで覚えたことをアウトプットしていきたいなーと思いまして、
とりあえずこのブログに貼り付けるために、
ブログパーツの作り方を調べてみました。

うまくいくと、こんな感じで出ます。

１．ブログパーツ画像ファイルを用意する

横幅は150-160ピクセルが主流らしい
縦はまちまち。（今回は150にしてみました）
このファイルを、ブログとは別のサーバーにアップする
この画像ファイルの形式は jpg でも何でもいいらしい
ちなみに今回のサンプルのファイル名は ball.swf

２．ブログパーツ表示用のJavaScriptファイルを用意する

以下の内容のファイル test.js を作成する

function samplePartsShow(){
    document.write(
        "<img src="http://〜/ball.swf"/>"
    );
}
samplePartsShow();

このファイルを、ブログパーツ画像ファイルと同じサーバーにアップする
document.write() ・・・引数に渡した文字列をドキュメントに書き出す
img src="" ・・・""にある画像を表示するタグ
この表示用ファイルは php でもいいらしい

３．HTMLファイルに貼り付ける

以下のタグをブログの貼り付け先htmlに挿入する。

<script type="text/javascript" src="http://〜/test.js"></script>

これでうまくいくか、試せてません・・・
参考サイト：ブログパーツの基礎知識

貼り付け先がはてなの場合

Googleガジェット化が必要らしいです。

１．ブログパーツ画像ファイルを用意する

２．iGoogleガジェット用のXMLファイルを用意する

以下の内容のファイル ball_embed.xml を作成する

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="ball" />
  <Content type="html">
    <![CDATA[ 
      <embed src="http://〜/ball.swf"
       type="application/x-shockwave-flash"
       width="150" height="150" bgcolor="#ffffff"
       pluginspage="FlashプラグインのURL" />
    ]]>
  </Content>
</Module>

このファイルを、ブログパーツ画像ファイルと同じサーバーにアップする
参考サイト
- スタートガイド: gadgets.* API
- Flashファイルの貼付け方

３．はてなダイアリーに貼り付ける

管理ツールトップ > 詳細デザイン設定「ページのフッタ」欄のサイドバー部分に以下のタグを貼り付ける

<div class="hatena-widget">
<script src="http://gmodules.com/ig/ifr?url=http://223.sitemix.jp/wp-content/uploads/2009/08/ball_embed.xml
&synd=open&w=150&h=150&title=&border=%23ffffff%7C0px%2C0px+solid+%23ffffff&output=js">
</script>
</div>

たぶんはてなダイアリー以外でも<script 〜></script>を貼ればOK
参考サイト