通常の画像
「アップロード」ボタンをクリックし、画像をアップロードすると、「埋め込みコード」が表示されるので、そのコードを使用する。
そのコードを入れたところに、画像が表示される。
いろいろなサイズの画像
画像をアップロードすると、「オリジナル」「スモール」「ミニ(スクエア)」の3種類のサイズの画像が自動作成されます。
オリジナル
アップロードしたままのサイズ。
ミディアム
480px×480pxの枠内に収まるサイズ。
オリジナルのファイル名の後ろに「_l」が付きます。
スモール
240px×240pxの枠内に収まるサイズ。
オリジナルのファイル名の後ろに「_m」が付きます。
ミニ(スクエア)
75px×75pxの正方形サイズ。
元画像が長方形の場合は、上下または左右のどちらかが切り取られます。
オリジナルのファイル名の後ろに「_s」が付きます。
さまざまな写真やイラストを見せたい場合に、目次的に使用することができます。
回り込み指定
埋め込みコードに「:right」「:left」のオプションを指定すると、以下のように文字が回りこみます。
[file:_images/3632230393_a41b8c7ca8_m.jpg:right] 私がウスウスと眼を覚ました時、こうした蜜蜂の唸るような音は、まだ、その弾力の深い余韻を、私の耳の穴の中にハッキリと引き残していた。
それをジッと聞いているうちに……今は真夜中だな……と直覚した。そうしてどこか近くでボンボン時計が鳴っているんだな……と思い思い、又もウトウトしているうちに、その蜜蜂のうなりのような余韻は、いつとなく次々に消え薄れて行って、そこいら中がヒッソリと静まり返ってしまった。
私はフッと眼を開いた。
かなり高い、白ペンキ塗の天井裏から、薄白い塵埃に蔽われた裸の電球がタッタ一つブラ下がっている。その赤黄色く光る硝子球の横腹に、大きな蠅が一匹とまっていて、死んだように凝然としている。その真下の固い、冷めたい人造石の床の上に、私は大の字｜型に長くなって寝ているようである。
私がウスウスと眼を覚ました時、こうした蜜蜂の唸るような音は、まだ、その弾力の深い余韻を、私の耳の穴の中にハッキリと引き残していた。
それをジッと聞いているうちに……今は真夜中だな……と直覚した。そうしてどこか近くでボンボン時計が鳴っているんだな……と思い思い、又もウトウトしているうちに、その蜜蜂のうなりのような余韻は、いつとなく次々に消え薄れて行って、そこいら中がヒッソリと静まり返ってしまった。
私はフッと眼を開いた。
かなり高い、白ペンキ塗の天井裏から、薄白い塵埃に蔽われた裸の電球がタッタ一つブラ下がっている。その赤黄色く光る硝子球の横腹に、大きな蠅が一匹とまっていて、死んだように凝然としている。その真下の固い、冷めたい人造石の床の上に、私は大の字｜型に長くなって寝ているようである。
縮小表示
埋め込みコードに「:50%」といったオプションを指定すると、画像を縮小表示することができます。
注意: 表示時に小さく見えるだけで、画像データ自体は縮小されていません。画像を小さく表示させたい場合は、まず表示させたい大きさに画像を縮小してから、アップロードしてください。
[file:_images/3632230393_a41b8c7ca8_m.jpg]
[file:_images/3632230393_a41b8c7ca8_m.jpg:80%]
[file:_images/3632230393_a41b8c7ca8_m.jpg:50%]
サイズ指定
「:w200」とすると幅200px、「:h100」とすると高さ100pxのサイズで表示することができます。
注意: 表示時に小さく見えるだけで、画像データ自体は縮小されていません。画像を小さく表示させたい場合は、まず表示させたい大きさに画像を縮小してから、アップロードしてください。
[file:_images/3632230393_a41b8c7ca8_m.jpg]
[file:_images/3632230393_a41b8c7ca8_m.jpg:w150]
[file:_images/3632230393_a41b8c7ca8_m.jpg:h100]
class指定
「class=xxxx」の記述を追加することで、imgタグにclass属性を追加可能。
[file:_images/3632230393_a41b8c7ca8.jpg:class=img-responsive]
Flickr画像
画像共有サービスのFlickr上にある画像を貼り込むことができます(非公開のものは貼り込みできません)。
貼り込みたい画像のページのアドレスが「http://www.flickr.com/photos/officek/1632182789/」だった場合、
[flickr:1632182789]
とします。
上記のように何もオプション指定をしない場合は、長辺500pxで画像が表示されます。
また、該当するFlickrページへのリンクも設定されます。
※[flickr:1632182789]という埋め込みコードを入力して更新すると、埋め込みコード自体が
[http://www.flickr.com/photos/officek/1632182789/\:[file:http://farm3.static.flickr.com/2118/1632182789_9605013c88.jpg:flickr=1632182789:w500:h375]] という記述に変更されます。
オプション指定
画像サイズを変更する、以下の指定が可能です。
//ミニ(スクエア)75px
[flickr:1632182789:sq]
//サムネイル100px
[flickr:1632182789:t]
//スモール240px
[flickr:1632182789:s]
//通常500px
[flickr:1632182789]
//ミディアム640px
[flickr:1632182789:m]
//ラージ800px
[flickr:1632182789:l]
Flickrにラージサイズ(800px)が用意されていない場合は、自動的に通常(500px)となります。
また、通常の画像と同様に、「:right」「:left」「:80%」「:w320」といったオプション指定が可能です。
スライドショー
[s:slideshow]と[e:slideshow]の中に、スライドショーで表示させたい画像を、1行ずつ空けながら記載します。
スライドショー全体の縦横サイズは、1枚目の縦横サイズとなります。
※IE7以上、Safari、Firefox等のモダンブラウザの場合は、フェード効果(うっすら現れ消える)がかかりますが、IE6の場合はこの効果が効きません(ブラウザ側の問題)。
入力例
[s:slideshow]
[flickr:1616177171]
[flickr:1617709592]
[flickr:1617792246]
[flickr:1616968063]
[flickr:1620172166]
[flickr:1620817456]
[flickr:1620182279]
[e:slideshow]
このページでの表示
表示順をランダムにしたい場合は、title属性に「shuffle」と記載します。
入力例
[s:slideshow][title:shuffle]
[flickr:1616177171]
[flickr:1617709592]
[flickr:1617792246]
[flickr:1616968063]
[flickr:1620172166]
[flickr:1620817456]
[flickr:1620182279]
[e:slideshow]
このページでの表示
1枚毎の表示時間を変えたい場合は、title属性に「5sec」「20sec」といった形式で秒数を指定します。
ランダム表示、かつ5秒で表示させたい時は、半角スペースで空けてつなげて指定します。
入力例
20秒に指定。
[s:slideshow][title:20sec]
[flickr:1616177171]
[flickr:1617709592]
[flickr:1617792246]
[flickr:1616968063]
[flickr:1620172166]
[flickr:1620817456]
[flickr:1620182279]
[e:slideshow]
ランダム、かつ3秒に指定。
[s:slideshow][title:shuffle 3sec]
[e:slideshow]
このページでの表示
ランダム、かつ3秒の場合。