GoogleGadgetでブログパーツ箱を作ってみた
このガジェットを使えば非対応ブログパーツもはてダで利用できます。
非対応ブログパーツも、GoogleGadgetでwrapしてあげれば(iframe内で)動くというリクツです。
GoogleGadgetを使ってみるでいろいろ試していて、はてダでは、
<script src="http://www.gmodules.com/ig/ifr?url=...
で始まるタグを許可してることが分かりました(パラメータの有無や順序の制約などはあるけど)。
仕組みは簡単。
編集用のガジェットで本来実行したいコードを、GoogleGadget形式のタグを生成するというもの。
生成されたタグから張り付け用のガジェットを呼び出します。
使いかた
このページのBlogPartsBoxEditorに実際に実行したいコードを貼り付ける
<script> String.prototype.camelize = function() { return this.replace(/_([a-z])/g, function(m) { return m.charAt(1).toUpperCase(); }); }; alert("get_element_by_id".camelize()); </script>
すみません。非実用的で;
もともと"JavaScriptEval"的な発想から入ったので、サンプルはモンキーパッチなコード例になっておりますw
実用例はまた...
ブログパーツタグをコピる
<script src="http://www.gmodules.com/ig/ifr?url=http://loj-gg1.appspot.com/blogPartsBox.xml&up_code=%3Cscript%3E%0AString.prototype.camelize%20%3D%20function()%20%7B%0A%09return%20this.replace(%2F_(%5Ba-z%5D)%2Fg%2C%20function(m)%20%7B%0A%09%09return%20m.charAt(1).toUpperCase()%3B%0A%09%7D)%3B%0A%7D%3B%0A%0Aalert(%22get_element_by_id%22.camelize())%3B%0A%3C%2Fscript%3E%0A&up_codeoff=false&synd=open&w=500&h=200&title=BlogPartsBox&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>
コピったタグをブログのエントリなんかに貼り付ける
こんなカンジ
こんなことも...
SVG+jQueryで動く笑い男はコチラから拝借しました。
http://jx-script.blogspot.com/2010/02/html5.html
めちゃクール!
参考
とりあえずGAEにホストしています。
- 編集用のガジェットのコード
http://loj-gg1.appspot.com/blogPartsBoxEditor.xml
- 貼り付け用のガジェットのコード
http://loj-gg1.appspot.com/blogPartsBox.xml
ご自由にどうぞv
ちなみに
外身はGoogleGadgetなのでもちろんiGoogleでも使えます。