2枚の画像をスライドで比較表示できるプラグイン「Twenty20 Image Before-After」

2枚の画像をスライドで比較表示できるプラグイン「Twenty20 Image Before-After」

 

今回は、最近いろんなメディアでよく見るようになった、ビフォアアフターなど2枚の画像をスライドで比較表示できるプラグイン「Twenty20 Image Before-After」です。

暗い写真を明るくしました。みたいなときに使えるやつです。

「Twenty20 Image Before-After」のインストール

プラグイン新規追加で「Twenty20 Image Before-After」を検索して、今すぐインストールをクリックしてインストール出来たら有効化しましょう。

 

すると、下図のように記事編集画面に[Add Twenty20]と[Help T20]が追加されます。

([Help T20]は[Add Twenty20]のヘルプ画面が表示されます。)

あとは、[Add Twenty20]をクリックして画像を2枚選択します。

なお、最初に選んだほうがビフォア(左側)になります。

あとはショートコードで、縦スライド・横スライド・スライダーの位置などをせってして下さい。

 

 

中央のスライドを移動してみて下さい。

[twenty20 img2="2676″ img1="2675″ offset="0.5″]

 

これを上手く使うことで、2コマ漫画みたいなことも可能なので、表現の幅が広がりますよね。

また、横スライドか縦スライドかを選択できます。

「Horizontal」が横スライドです。

[twenty20 img1="2681″ img2="2682″ offset="0.5″]

 

「Vertical」が縦スライドです。

[twenty20 img1="2681″ img2="2682″ direction="vertical" offset="0.5″]

 

さらに、最初のスライダーの位置も調整できます。「0.5」が中央です。これは適宜調整してください。