*応用編
RIGHT:[[PukiWiki公式ヘルプ>Help]]
#contents
~
**画像の掲載
ページに画像を掲載するには、
1.画像の準備(Web用に縮小) －＞ 2.当該ページにアップロード －＞ 3.ページの編集
という３つの手順が必要になります。
***画像の準備(Web用に縮小)
デジカメで撮った写真や、スキャナーで取り込んだ写真は、
一般にはWebページ用には大きすぎますので、
画像処理ソフトでサイズ変更する必要があります。
※中央の画面幅は 480pixel です。
-参考：画像のサイズ変更が一発でできるWebサイトがあります。
Support Ware - Image Resizer｜http://myct.jp/resize/
画像処理ソフトを立ち上げるより簡単です。
~
~
//変更後の写真画像を保存する際は、以下のルールに従って下さい（Webの一般的なルールです）。
//ファイルの形式 －＞ JPEG形式 （詳しい方は適宜PNGやGIFもご利用下さい）
//ファイル名 －＞ （名称）.jpg
//※名称は、半角英数で、スペースや特殊記号を含んではいけません。
//※拡張子である .jpg の部分は必須です。
//~
***当該ページにアップロード
まず、画像を掲載したいページに移動して下さい（画像はページ単位にアップロードする必要があります)。
管理アイコン「添付(クリップ)」をクリックします。
「参照」から用意した画像(○○.jpg)を見つけて選択します。
「添付」をクリックすると画像が送信されて、「（ページ名）にアップロードしました」と表示されます。
※「添付」には編集用とは別の(ページ名変更時と同じ)パスワードが必要です。
~
***ページの編集
当該ページで管理アイコン「編集」をクリックして、編集画面に入ります。
画像を掲載したい箇所で、
#ref(添付した画像ファイル名)
と記述すれば完了です。
~
~
**画像の掲載（応用操作）
***他のサイトの画像の埋め込み
Flickrなどにアップ済みの画像であれば、それをリンク表示できます。
#ref(http:// ～ )
ただし、他者の著作物である画像を直接自分のページに埋め込むのはマナー違反です。
掲載サイトの利用規約等でファイルのライセンスを確認して下さい。
~
***別ページにある画像の利用
別のページにある画像を流用したい場合は、以下のように、
ファイル名の前にページ名を記載するか、又は第２パラメータにページ名を記載します。
#ref(添付されたページ名 / 画像ファイル名)
#ref(画像ファイル名, [[添付されたページ名]])
事例、[[file]]ページに掲載されている dummy.jpg をここに表示
#ref(dummy.jpg,[[file]])
#ref(dummy.jpg,[[file]],240x120)
~
***サイズ変更
サイズを変更して表示するには、以下のように第３パラメータに、
幅 x 高さ、 あるいは倍率を記述します。
#ref(画像ファイル名,,480x360)
#ref(画像ファイル名,,50%)
ただし、添付したデータが大きければ、結局、転送・表示に時間がかかりますので、
できるだけ、最終的な表示サイズに変更してからページに添付することをお勧めします。
~
***回り込み
以下のように記述すれば画像の横に数行のテキストを回り込ませられます。
左に回り込み（画像が左側）
#ref(画像ファイル名,left,around);
一行目
二行目
#clear
ここから回り込みが解除されます。
右に回り込み（画像が右側）
#ref(画像ファイル名,right,around);
一行目
二行目
#clear
ここから回り込みが解除されます。
~
#ref(file/dummy.jpg,left,around,240x120,"Sample")
このシステムでは画像周囲の余白を0にしているため、ふつうに書くと、このようにくっつきます。
したがって、写真の右に文を書く場合、
このように、全角スペースを利用して
余白をとることが必要です。
#clear
ここから回り込み解除になっています。
ただし、全角スペースで余白･･･というのは、あまりスマートな方法ではありません。
自由な余白作りには、以下のようにスペーサー画像を使う方法をお勧めします。
~
***スペーサー画像の利用
スペーサーとは「余白をつくるための透明な画像」のことです。
[[共用ファイルのページ(file)>file]]に添付していますので、ご利用下さい。
例えば、以下のように使います。
#ref(file/dummy.jpg,left,around,240x120,"Sample")
#ref(file/spacer.gif,left,around,24x120,"Spacer")
スペーサーを画像の右に置く(left,around)ことで、
文章の左に空白文字を打つ手間が省けます。
~
#ref(file/dummy.jpg,left,around,240x120,"Sample")
#ref(file/spacer.gif,left,around,24x120,"Sample")
スペーサーを画像の右に置く(left,around)ことで、文章の左に空白文字を打つ手間が省けます。
#clear
~
***Light Boxの利用
初期状態では、小さく表示しておいて、クリックしたら大きく表示する･･･というような演出をしたい場合は、以下のように lightboxプラグインをご利用下さい。
#lightbox(画像ファイル名,,初期表示サイズ,"一行コメント")
＃refをベースにしていますので、記述形式は同じです。
とりあえず、初期表示サイズのみ記載して下さい。
#lightbox(dummy.jpg,[[file]],120x60,"これはサンプル画像です。")
~
~
&aname(youtube);
**Youtube動画の掲載
Youtubeの動画は、下記のとおりの記述で実現します。
#youtube( 動画のアドレスの v= 以降の文字列を入力 );
ちなみに、以下の表示は、
#youtube(hKoB0MHVBvM);
と記述しています。
~
#youtube(hKoB0MHVBvM);
Youtubeの動画は、「共有」が目的・前提となっていますので、
参考になる動画は、自分のページに埋め込んで紹介することができます。
※もちろん、Youtubeの規約に違反してアップされた動画は対象外です。
~
~
**PDF、WORD、EXCELなどのファイルをページから提供する
画像の掲載と同様で、以下の手順です。
***当該ページにアップロード
まず、ファイルを提供したいページに移動して下さい（ページ単位にアップロードする必要があります)。
管理アイコン「添付(クリップ)」をクリックします。
「参照」から用意したデータを見つけて選択します。
「添付」をクリックするとファイルが送信されて、「（ページ名）にアップロードしました」と表示されます。
※「添付」には編集用とは別の(ページ名変更時と同じ)パスワードが必要です。
~
***ページの編集
当該ページで管理アイコン「編集」をクリックして、編集画面に入ります。
ファイルを掲載したい箇所で、
#ref( 添付したファイル名 );
と記述すれば完了です。
※アップロードできるファイルは１件につき1MB以内という制限があります。
~
~
**その他
***Wikiフォルダ内の実ファイル名を知るには（管理者用）
アドレスの入力フォームで、以下のようにコマンドを入力すると一覧が表示されます。
http://www.funagoya.org/index.php?cmd=filelist
~
~
