EditGuide/Plugin のバックアップの現在との差分(No.2)

九州産業大学 生命科学部


  • 追加された行はこの色です。
  • 削除された行はこの色です。
#author("2019-09-13T12:01:29+02:00","default:user","user")
#author("2020-03-05T18:39:24+09:00","default:inoue.ko","inoue.ko")
*Plugin Guide
~

**Contents2_1 Plugin
見出しを自動抽出してメニュー化します。
***追加拡張機能
このサイトに搭載された拡張機能について説明しています。
-[[Plugin/Image]]:写真の配置
-[[Plugin/YouTube]]:YouTube動画の埋め込み
-[[Plugin/Slider]]:スライドショー(カルーセル)の設定
-[[Plugin/FontAwesome]]:FontAwesome アイコンの利用
-[[Plugin/Contents2_1]]:ページ内メニューの自動作成
~

***format
 #contents2_1
~

***sample
#contents2_1
~
~


**Image Plugin
添付画像の様々な掲載方法
~

|#image(hiroshige01.jpg)|#image(hiroshige01.jpg)|
|#image(hiroshige01.jpg)|#image(hiroshige01.jpg)|
~


***format
 #image(画像ファイル名,[left, right],幅)
-画像ファイル名:ページに添付したファイル名、または URL
-left, right:回りこみ指定
-幅:コンテンツ領域に対する幅を % で指定
~

***sample
#image(hiroshige01.jpg,right,30%);
画面の右30%に表示、回りこみあり
 #image(sample.jpg,right,30%) 

~
~

**YouTube Plugin
YouTube動画の掲載方法
~
#youtube(Es3Vsfzdr14,100%)
Sittin' On The Dock Of The Bay | Playing For Change 
~

***format
 #youtube(動画のID,width,height,[autoplay,loop,LR,UD])
-動画のID:YouTube動画のURL で v= に続く文字列
-Width, height:幅と高さ(px または %)
-autoplay:ページの表示と同時に再生
-loop:ループ再生
-LR:左右反転表示
-UD:上下反転表示
~

***sample
-最もシンプルな表記:コンテンツ領域いっぱいに表示されます。
 #youtube(Es3Vsfzdr14) 
~
~

**Slider Plugin
カルーセルスライダー Slick を用いたプラグインです。
http://kenwheeler.github.io/slick/
~


***format
 #slider( 位置, 幅, 滞留時間, 切替時間, 画像01, 画像02, 画像03,・・・)

-第1引数は、left / center / right のいずれか。center以外は回りこみます。
-第2引数は、親領域に対する幅の%。
-第3引数は、スライドが止まって表示されている時間(ms)。
-第4引数は、スライドの切り替えに要する時間(ms)。
-第5引数以降に画像ファイルを列挙します。
画像ファイル自体は、当該ページに添付されていることが前提ですが、特定のページにまとめて添付して利用することも可能です。
例えば、Images という名前のページにある sample01.jpg 画像は、
 images/sample01.jpg 
という書き方で利用可能です。

-パラメータが増えると面倒なので、以下の仕様に限定しています。
--移動:左右方向
--マウスオンで一時停止します
~

***sample
#slider(center,50%,3000,1000,XGA01.jpg,XGA02.jpg,XGA03.jpg)
~

編集画面内で以下のように記載しています。
 #slider(center,50%,3000,1000,XGA01.jpg,XGA02.jpg,XGA03.jpg )
~
~