今回の記事はPSO2ブログをやっている方向けへの謎技術普及委員会()の記事になっています。
普通の記事を見に来られた方、ゴメンナサイ><;
PSO2

使用するにあたって
  • wScratchPadはMIT and GPL licensesで配布されていますので、敬意と感謝を込めてブログのお知らせページなどに、

    のWebsanova(http://www.websanova.com/blog/様へのリンクを貼りましょう。
  • 基本的な画像アップロードやアップロードした画像のURLの取得方法などを理解している方向けになっています。
    スクリプトや画像のブログへの設置方法はご自身のレンタルブログシステムにあった方法を利用してください。


はじめに
ここで再配布しているwScratchPad.mini.jsは、レンタルブログに設置するにはいくつかのコード変更が必要なために、ブログ記事内に設置する用に少し本体を改変しています。
ですので最新版を欲しい方は、
■ Websanova(http://www.websanova.com/blog/
さんよりダウンロードしてください。

この記事で使っているLivedoor BlogとFC2ブログなどのレンタルブログ用修正版は、
■ ブログ設置用変更済みwScratchPad.mini.js ダウンロード
を右クリックして保存後、解凍して中のwScratchPad.mini.jsをご自身のブログサーバーに設置して使用してください。

FC2ブログではコード内に改行を入れると動作しなかったり、Livedoor Blogでもブログ内記事からJavaScriptへ設定値を渡すのには少し癖があるので、動作させることを目的に変更して再圧縮しています。

◎解説 (コピペ用コードは次です)

最初の1行・・・JQueryをGoogle配布から借ります。
◆①◆・・・wScratchPad.mini.jsを置いたURL
◆②◆・・・ブログ内で複数のスクラッチを設置するときはIDを変更します。
◆③◆・・・画像の横幅(ピクセル値)
◆④◆・・・画像の縦幅(ピクセル値)
◆⑤◆・・・削った後の画像のURL
◆⑥◆・・・削る前の画像のURL




◎設置コピペ用コード (このページで実際に動かしているコードは次です)
ここのコードをコピペして◆ ◆で囲った部分を自分のブログに合ったモノに変更してください。
FC2ブログの方は編集する際に改行が入らないように注意して下さい。
追記:FC2ブログでの動作サンプルを置いています。
FC2ブログの設定で、簡易モードをOFF自動改行をHTMLコードのみに変更で動作しました。
※FC2ブログではテンプレートによってJavaScriptに関する扱いの記述が異なり動作しない場合があります。
http://kokoromochipso.blog.fc2.com/blog-entry-1.html


◎動作サンプル こんな使い方をしてはいけない
wScratchPad by Websanova(http://www.websanova.com/

◎動作サンプルの実際のコード (このページで実際に動かしているコードです)


その他、レンタルブログにも設置できるJavaScriptサンプルはこちらに設置しています。

コメント

 コメント一覧 (4)

    • 1. かれん
    • 2015年09月17日 12:34
    • こんにちわーですー!!
      こ、こんなに細かく丁寧にご説明を・・・すごい助かります(´;ω:`)
      帰ったら早速試してみようかなぁ~♪上手くいけばいいけど・・・
    • 2. ぎゅうにゅうたん
    • 2015年09月17日 13:35
    • >かれんさんコンニチワ~
      分散して書いたりパラメーターだったりを省略して本体で吸収するように変更してるので、多分、どんなブログでも記事本体へ設置できると思いますヽ(o゜ω゜o)ノ
    • 3. 黒羊
    • 2015年09月17日 18:56
    • ・・・知りたかったはずなのに、いざ説明を受けると思考が停止してるのが分かる(泣)
      自分の頭の悪さが憎い!
      とりあえず、時間が取れる時にゆっくり見て・・・。
      い、いつか・・・。
    • 4. ぎゅうにゅうたん
    • 2015年09月17日 21:59
    • >黒羊さんコンニチワ~
      まずは一番下の動作しているコードを試しに貼り付けてみてはいかがでしょうか?
      それで動けばあとは画像とかを変更するだけですよ~
      分散してコードを設置したりの煩わしいのを変更してるんで、あとは情熱と熱意で()
コメントフォーム
評価する
  • 1
  • 2
  • 3
  • 4
  • 5
  • リセット
  • 1
  • 2
  • 3
  • 4
  • 5
  • リセット