Windows Live Writer プラグイン WLOdekoの仕様


Re:[TB] WP2.5に入れるプラグイン10選 でちょこっと書いたWindows Live Writer用プラグイン。

Flickrのコードをコピペすると、Highslide用コードに変換してWindows Live Writerに挿入してくれる…なんて需要まったく無視の自分用プラグインが誕生するかもしれません。

なんとhiromasaさんが作ってくれちゃいました!その名もWLOdeko!(アイコンだけおで製です:)

Windows Live Writer プラグイン WlOdeko リリース(?)

プラグインリクエスターは、おなじみおでげのおでこさん。 Flickr の HTML ソースを入力すると、いい感じに highslide が動くように HTML を変換して挿入します。

上記のエントリでも若干触れられていますが、hiromasaさんとやり取りをして詰めたプラグインの仕様(と使い方?)についてふれてみます。

挿入から「おでこの挿入」を選ぶと、ウィンドウがポップアップします。この「おでこの挿入」を選ぶ表示モードは、WEBレイアウトモードでも、HTMLコードモードでもどちらでも大丈夫です(どちらのモードにしていてもうまい感じに処理してくれます)。

ウィンドウにペーストするコードはFlickrのYour Photostreamから個別の写真を開いて、ALL SIZESを選んだ先に表示されるコードです。

Flickr Code

たとえば、

<a href=”http://www.flickr.com/photos/odysseygate/2604691606/” title=”チッピングカムデンを眺めて 6 by ulysses_powers, on Flickr”><img src=”http://farm4.static.flickr.com/3171/2604691606_98cd7949b6_b.jpg” width=”1024″ height=”685″ alt=”チッピングカムデンを眺めて 6″ /></a>

こんな感じ。

これをウィンドウに貼り付けてOKを押すと、コードがhighslide用に整形されます(下記参照)。

<p><a class=”highslide” onclick=”return hs.expand(this)” href=”http://farm4.static.flickr.com/3171/2604691606_98cd7949b6_b.jpg”><img id=”thumb9e64bd7b93fb59f850e0a0f9a85c3342″ title=”Click to enlarge” height=”334″ alt=”チッピングカムデンを眺めて 6″ src=”http://farm4.static.flickr.com/3171/2604691606_98cd7949b6.jpg” width=”500″></a></p>
<div class=”highslide-caption” id=”caption-for-thumb9e64bd7b93fb59f850e0a0f9a85c3342″><a title=”go 2 flickr” href=”http://www.flickr.com/photos/odysseygate/2604691606/” target=”_blank”>チッピングカムデンを眺めて 6</a></div>
<p></p>

上記のソースを見ると分かるように、エントリーにはMiddleサイズの画像を表示し、クリックするとLargeサイズの画像がhighslideエフェクトで表示されます。

Middleサイズの画像サイズは500 * 344に固定されており、このサイズと違う場合や、縦撮りした写真の場合は適宜修正する必要があります。

highslideエフェクトが機能するためには、imgタグのid:thumb***とdivのid:caption-for-thumb***の***が合致している必要があります。この***はFlickrのURLからユニークなハッシュが自動生成的に挿入されます。すてき。

imgタグのaltとキャプションとして表示される文字列は「by アカウント名, on Flickr」を除去した画像タイトルが挿入されます。

最後の<p></p>は次の文字入力がしやすいように入れてあります。このまま「おでこの挿入」を連続して続けてもよし、文字を入力してもよしです。

激しくおで仕様のプラグインですが、このサイトと同じような形でhighslideを活用されている場合には便利なのではないでしょうか。

hiromasaさん、ありがとう!


フォームは コメントしてほしそうに こちらを見ている……!

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください