編集マニュアル
坂本隆太朗
自分用の編集マニュアルなので意味分かんなかったらごめんなさい！なんか分かんないことあったら聞いてください！
- 目次の作り方
- 文頭記号
- 文字色,背景色
- リンク
- 画像
- 文字の大きさ
- 表
- スライド
- MainVisual
- アイコン
- ダミースペース
- サイドバー
- QRコード
- カウント
- コメント
- 解答
- スケジュール
- RSS(Rich Site Summary)表示
- ドキュメントファイル
- 検索バー
- 数式(何もわかってない)
目次の作り方
#contents 見出しが目次になる
文頭記号
:〇〇〇|△△△ 定義文 〇に言葉、△に説明文 // 編集画面でのみ閲覧可 * 大見出し ** 中見出し *** 小見出し - ・１行目 -- ◦２行目 --- ◦３行目 + 01. ++ ⅰ. +++ a. ~ 改行扱いに
&br 改行
%%〇〇〇%% 取り消し線 __〇〇〇__ 下線 ---- 水平線 #hr 水平線 LEFT: 左寄せ CENTER: 中央寄せ RIGHT: 右寄せ
文字色,背景色
&color(#2f4f4f){〇〇〇}; {}に色を変えたい文
#settextcolor(#2f4f4f) ()にカラーコードでページ全体の文字色変更
#settextcolor(#2f4f4f) サイト全体の文字色を変更
#setbgcolor(#2f4f4f) サイト全体の背景色を変更
#setbgcolor("linear-gradient(-90deg, #FF00A1, #F6FF00)") グラデーション
&textcolor_picker(); 文字色を閲覧者が変更可能
&bgcolor_picker(); 背景色を閲覧者が変更可能
#setbgimage(画像ファイル名) 背景を画像に変更可能
#setbgimage(画像ファイル名,cover) ウィンドウの長辺に合わせる
#setbgimage(画像ファイル名,contain) ウィンドウの短辺に合わせる
#setbgimage(画像ファイル名,〇〇〇,opacity) 不透明度(動作不安定)
カラーコード表
カラーコードレーン
カラーコードカーソル
グラデーション
リンク
[[ページ名]] ソーシャルデザインのサイト内のリンク(例：サブページ等) URL 外部ページはURLを直接貼るだけ [[〇〇〇>URL]] 〇が表示されリンクになる #iframe( URL, [幅％], [アスペクト比％] ) サイトを表示可(できないサイトもある) #setunderline リンク文字にアンダバーを表示可
youtube,vimeoはプラグインにより簡略化 https://youtu.be/IDOPbPJIufAの「IDOPbPJIufA」部分を #youtube(IDOPbPJIufA)と貼るとHPに表示 #youtube(URL,〇〇) 〇にアスペクト比入力(0.1~3.0。4:3は0.75,16:9は0.5625) #youtube(URL,loop) ループ再生可 #youtube(URL,autoplay) ページ読み込み時に自動再生(ミュートになる) #youtube(URL,flip-h) 左右反転 #youtube(URL,flip-v) 上下反転 #youtube(URL,50%) 50%のサイズに
画像
画像を表示させたいページ下の「UPLOAD」にjpg,png,gif,WebP,SVGをアップロード 推奨は200KB(512KBまでは可能) #image(〇〇〇) 〇には画像の名前 #image(〇〇〇,left,50%) rightで右寄せ &image(〇〇〇,,50%);&image(〇〇〇,,50%) で並べて表示 #clear で回り込み防止(画像の横に文字が来ることを防止) 他ページにある画像は#image(ページ名/画像ファイル名)でアップロードなしで表示可 #imageの代わりに#lightboxでも代用可(こっちはサイズを〇x〇で指定可)
文字の大きさ
&scale(サイズ%){〇〇〇}; 画面比率に対して文字の大きさを変える(-40~500%まで)
&small(〇〇〇); 文と相対的にサイズ縮小(文章途中に使用)
&size(サイズ){〇〇〇}; サイズに数値を入力
表
|〇〇〇| 左寄せ100&の表(横や下に増やせる) |〇〇〇|h ヘッダー行(上部)を太字 |〇〇〇|f フッター行(下部)を太字 #settableborder(box) 罫線で囲まれる #settableborder(line) 罫線が上下の横線だけに #settableborder(none) 罫線なし,画像や動画の空白0に |>| 表の中に>を入れると表を空欄にできる |~| でhやfを残したまま改行可能
スライド
#slider( 位置, 幅, パターン, 滞留時間, 切替時間, 画像01, 画像02, 画像03,・・・)
- 位置 left,right,center left.rightは回り込みあり
- 幅 %で設定
- パターン
- fade デフォルト
- h1 水平スライド(数字は同時表示数。9まで可)
- v1 垂直スライド(数字は同時表示数。9まで可)
- 滞留時間 スライドが止まって表示される時間(msで数値のみ入力)
- 切替時間 スライドの切替にかかる時間(msで数値のみ入力)
- 画像01 画像ファイル名を入力
- 画像02 3つ目以降も同じように増やす
MainVisual
坂本隆太朗/MainVisual
1.自分のMainVisualページを作成
2.自分のMainVisualページに画像や動画を表示させる
3.MainVisualの画像や動画が〇〇〇//MainVisualの〇のページに表示される
アイコン
&fontawesome(fas fa-home); アイコン [[&fontawesome(fab fa-home); >URL]] リンク付き
使用可能アイコン検索サイト
↑HTML用の<i class="fas fa-home"></i>みたいなコードのfas fa-homeを()の中に入力
Fas：Font Awesome Solid
Fad：Font Awesome Brand
block：#twitter TwitterのPostリンク inline：&twitter; TwiiterのPostリンク
ダミースペース
#spacer( 幅, 高さ, 回りこみ)
- 幅 %で数値入力
- 高さ pxやremで数値入力
- 回り込み left,rightで回り込み指定可
サイドバー
#setsidebar(left) 左にサイドバー表示 #setsidebar(right) 右にサイドバー表示 #setsidebar(none) サイドバー無し
QRコード
#qrcode( [URL], [left], [サイズ%] ) 左寄せ(文章回り込み) #qrcode( [URL], [right], [サイズ%] ) 右寄せ(文章回り込み) #qrcode( [URL], [center], [サイズ%] ) 中央揃え
カウント
&counter(total); 累計のアクセス数 &counter(today); 一日のアクセス数 &counter(yesterday); 昨日のアクセス数
コメント
#article 投稿フォームを作成可 #comment 簡易コメント窓口作成可 #comment(above) コメントを入力欄上部に追加 #comment(below) コメントを入力欄下部に追加 #comment(nodate) コメント時間を表示させない(デフォは表示) #comment(noname) コメント記入者の入力なしに可(デフォは入力)
解答
&answer(〇〇〇); 〇をカーソルによって表示可(パソコンのみ) ''ans:''&answer(〇〇〇);みたいなのがおすすめ &answer2(〇〇〇,△△△); △を〇をクリックすることで表示可
スケジュール
#schedule カレンダー表示可
RSS(Rich Site Summary)表示
#showrss( RSSのURL ) ニュースやブログの更新情報を表示可
ドキュメントファイル
UPLOADでファイルをアップロード ＆ref(); ファイルを表示可
検索バー
#lookup( InterWikiName,検索,フォームのデフォルト)
数式(何もわかってない)
&mathjax( LaTex記法の数式 ); ＞ インライン数式モードが適用
#mathjax( LaTex記法の数式 ) ＞ ディスプレイ数式モードが適用
２次方程式 &mathjax( ax^2+bx+c=0 \quad ( a \neq 0 ) ); の解は
#mathjax( x = \frac{-b \pm \sqrt{b^2-4ac}}{2a} )
#mathjax( a=\sum_{i=0}^{n} (1+x_i+x_i^2) )