HipBox

Last-modified: 2024-02-19 (月) 22:56:27

お尻の練習場だぞ俺
お尻の練習場ってなんだ
実際に試す場合の砂場はこっち:SandBox
編集方法を備忘録的に書いておくといいんじゃないかと思うぞ俺

プラグイン備忘録

>

|引用文の開始。>、>>、>>>の3レベル。四角で囲まれて表示される。対応する<、<<、<<<で終了する。

ここが引用文(レベル1)

ここが引用文(レベル2)

ここが引用文(レベル3)

-

番号なしリスト。-、--、---の3レベル。箇条書きで表示される。

+

番号つきリスト。+、++、+++の3レベル。箇条書きで表示される。

  1. レベル1
  2. レベル1
    1. レベル2
    2. レベル2
      1. レベル3
      2. レベル3

:定義|説明

定義リスト。辞書のように表示される。:、::、:::の三段階ある。

(半角空白)

整形済みテキスト。プラグインは展開されない。

ここが整形済みテキスト

#(半角空白)

整形済みテキスト。サイズや色指定など&から始まる各種プラグインが機能する。

でっか…

|テキスト|

表組み。
詳しくは表組を作るで。

*

見出し。*、**、***の3レベル。アンカーとして[#(ランダムな英数文字列)]が自動生成され、次の見出しまでの範囲を編集できる鉛筆アイコンが表示される。

//

コメント行。ページ閲覧時は出力されない。行全体を対象に取るので、行内の一部文字列を対象に取りたい場合は&nullを用いる。

((注釈))

注釈*1
数字を直接クリックすると内容が表示されたり、ページ下部に並んでいたり。

A-D

br

改行。
表内セルやincludex取り込みなどに収めるために編集では1行で書きたいけど、視認性のためにページ閲覧時は改行したいという場所に&br;を挿入する。




空白行を挿入する場合は#brでも

color

&color(文字色,背景色){ここにテキストを入力};

色の指定。文字色と背景色をそれぞれ指定できる。どちらかを省略することも可能。
指定方法は①色名(red,blueなど)、②3桁の16進数(#000 ~ #FFF)、③6桁の16進数(#000000 ~ #FFFFFF)の三種。大文字小文字は問わない。
リンクの色を変える場合は以下のようにする必要がある。

[[&color(Red){トウコのケツ};>トウコのケツ]]

#colorでは複数行を一括して色指定する。背景色を指定した場合、文字部分だけではなく行全体が着色されるのも特徴。

#color(文字色,背景色){{
ここにテキストを入力
ここにテキストを入力
}}

色見本も参照のこと。

contents

#contents

目次。ページ内の見出しに基づいて作成される。一番シンプル。

contentsx

#contentsの拡張。

E-G

font

&font(<sans-serif | sans-serif-tight | serif | monospace | legacy-ui-gothic>){ここにテキストを入力};

#color(<sans-serif | sans-serif-tight | serif | monospace | legacy-ui-gothic>){{
ここにテキストを入力
ここにテキストを入力
}}

フォントの指定。丸括弧()で選んだフォントが、中括弧{}内の文字に適用される。

フォント比較
  • 基本文字サイズ
    ここにテキストを入力(デフォルト)
    ここにテキストを入力(ゴシック)
    ここにテキストを入力(タイトゴシック)
    ここにテキストを入力(明朝)
    ここにテキストを入力(等幅)
    ここにテキストを入力(レガシー)

  • 基本文字サイズ、強調あり
    ここにテキストを入力(デフォルト)
    ここにテキストを入力(ゴシック)
    ここにテキストを入力(タイトゴシック)
    ここにテキストを入力(明朝)
    ここにテキストを入力(等幅)
    ここにテキストを入力(レガシー)

  • 文字サイズ18

    ここにテキストを入力(デフォルト)
    ここにテキストを入力(ゴシック)
    ここにテキストを入力(タイトゴシック)
    ここにテキストを入力(明朝)
    ここにテキストを入力(等幅)
    ここにテキストを入力(レガシー)

H-K

includex

サイト内の別ページを引っ張ってくるプラグイン
1見出しや1行だけ取り込むこともできる
膨大になってしまう記事のページを分けて行数制限を回避しつつ1ページにまとめるために使ったりしている
プラグインを解説する公式サイトが死んでしまったので、ウェブアーカイブから復元
HipBox/includex

#jumplist

セレクトメニュー。listboxで選択してページ移動できる。
存在しないページ名を指定した場合、スキップされる。

#jumplist([[ページ1]],[[ページ2]],[[./下層ページ1]],・・・)

L-N

nobr

#nobr{{
ここにテキストを入力
ここにテキストを入力
}}

改行抑制。
文章が長くなったときや表がデカくなったとき、画像を並べたときなどに、自動で改行されるのを抑制する。

改行抑制されてまあああああああああああああああああああああああああああああす
13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg

細かい制御をしたい場合は

&nobr{折られたくないテキスト};

でもいいが、上のケツ並べのように該当箇所がスクロールできるようにはならないので注意

O-R

S-U

&sizex

&sizex(数字1 ~ 7){ここにテキストを入力};

文字サイズの相対指定。cssのクラスを用いて指定する。

表示
ここにテキストを入力 サイズ1
ここにテキストを入力 サイズ2
ここにテキストを入力 サイズ3
ここにテキストを入力 &sizex指定なし
ここにテキストを入力 サイズ4
ここにテキストを入力 サイズ5
ここにテキストを入力 サイズ6
ここにテキストを入力 サイズ7

V-Z

&youtube

#youtube(ビデオID,横幅,高さ)

youtube用の埋め込みプラグイン。
これだけだとセンタリングとかができないので、ケツでは

#flex_container(center){{{
#flex_box(横幅){{
#youtube(ビデオID,横幅,高さ)
}}
}}}

のようにすることが多い。
ビデオIDの後ろに、

  • ?rel=0をくっつけると、関連動画を表示しない、
  • ?start=数字をくっつけると、秒数で開始位置を指定、
  • ?t=◯m△sをくっつけると、◯分△秒で開始位置を指定できる。

主要なプラグインまとめ表

用途使うやつ
計算calc
文字色color
文字サイズsize
文字を流すmarquee
目次contents
高度な目次contentx
別ページ呼び出しincludex
タグ付けtag
ページリストアップlsx
投票vote
tvote
表をソート可能にtablesort
表を別ページで開くpopout
エリアを隠すfold
accordion
ntbr
Youtube埋め込みyoutube
Twitter埋め込みTwitterTweet
改行抑制nobr
画像添付attachref

画像を添付する

メニューの臀部「添付」から画像をアップロードすればいいよ
画像は「添付」押した現在のページに添付されるぞ!あんまりとっ散らかすとめんどいから気をつけて!
本当にお尻の画像ならHiploaderでやってみよう
なんかステータスとかのアイコンはsozai置き場とか作ってそこに添付するといいって俺じゃない俺が言ってたタブンネ

…ページ中に[添付]リンクがあるならそれ使えばなんかこういい感じにしてくれるから以下は無からやる用だぞ俺
添付した画像を呼び出すのはこう

&ref(./添付画像ファイル名.形式);

別ページにある画像を呼び出して表示するならこう

&ref(ページ名/添付画像ファイル名.形式);

そのままだと画像を直接表示するよう自動リンクされるので「nolink」を付けるとリンクしなくなるぞ

&ref(添付画像ファイル名.形式,nolink);
&ref(ページ名/添付画像ファイル名.形式,nolink);
サンプルだぞ俺

13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg13BE4083-F514-41FF-8688-E202EF3DBF59.jpeg

見たらわかるけどトウコのケツがでかすぎるぞ俺
サイズ指定も(ある程度)できるから挿入するといいぞ

&ref(ページ名/添付画像ファイル名.形式,nolink,100%);
&ref(ページ名/添付画像ファイル名.形式,nolink,500x500);

数字x数字の形式は、画像の短辺がそのサイズになるように調整してくれる

サンプルだぞ俺

30%HIP!250x250HIP!

マウスオーバーするとわかるが文字がデター………ナニコレ*2
これだ俺

&ref(ページ名/添付画像ファイル名.形式,nolink,?%,しり!ふともも!);

しり!ふともも!

表組を作る

|トウコさん|メイ|
|ケツ|メイっぱい&heart;|

セルごとに|で分割することで表組できる。

トウコさんメイ
ケツメイっぱい [heart]
  • 編集ページの上部にある構文ハイライト (β版 ver 0.2.1)を有効化している間は、スプレッドシート、エクセル等の表計算ソフトをコピペすることで自動的に表になる。
    loading...

記述子

各セルの文頭(=|の直後)に記述子と呼ばれる命令を入れることで、以下が可能になる

左揃え LEFT:
右揃え RIGHT:
中央揃え CENTER:
上揃え TOP:
下揃え BOTTOM:
上下中央揃え MIDDLE:
文字色指定 COLOR(色名): もしくは COLOR(#rrggbb):
背景色指定 BGCOLOR(色名): もしくは BGCOLOR(#rrggbb):
文字サイズ指定 SIZE(数字):
|BGCOLOR(Black):COLOR(#ffffff):トウコさん|CENTER:メイ|
|RIGHT:ケツ|SIZE(30):メイっぱい&heart;|

・トウコのセルには、背景色を黒、文字色を白
・メイのセルには、右揃え
・ケツのセルには、中央揃え
・メイっぱい [heart]のセルには、文字サイズ30
を指定している。

トウコさんメイ
ケツメイっぱい [heart]

セルの結合、ヘッダ、書式指定

のセルと結合したい場合は>を、のセルと結合したい場合は~を単独でセルの内容にする。

| |HP|攻撃|防御|特攻|特防|素早|合計|>|>|特性|
|クチート|50|85|85|55|55|50|380|かいりきバサミ|いかく|ちからずく|
|メガクチート|~|105|125|~|95|~|480|>|>|ちからもち|

上の表は、
メガシンカ時に変化しないステータスは上のセルと結合し、
メガクチートは、クチート時の特性に関わらずちからもちに変わるので、右のセルと結合したい、というもの。
以下のようになる。

HP攻撃防御特攻特防素早合計特性
クチート508585555550380かいりきバサミいかくちからずく
メガクチート10512595480ちからもち

基本はできたが……これでは見づらい!ので、ヘッダ、書式指定を利用していこう。
まず先頭行は、いわゆる見出し行、ヘッダ行としたいので、末尾にhをつける。
次に、クチート、メガクチートというポケモン名も強調したいので、セルの文頭に~をつける。

| |HP|攻撃|防御|特攻|特防|素早|合計|>|>|特性|h
|~クチート|50|85|85|55|55|50|380|かいりきバサミ|いかく|ちからずく|
|~メガクチート|~|105|125|~|95|~|480|>|>|ちからもち|
HP攻撃防御特攻特防素早合計特性
クチート508585555550380かいりきバサミいかくちからずく
メガクチート10512595480ちからもち

随分…鍛えなおしたな…ちょっと見栄えが悪いので、hを付けたヘッダ行にも各セルに~をつけておくことにしよう。


ここから書式指定をしていく。書式指定行は、下のすべての行に記述子を命令する機能。
記述子のみを記述したセルを並べ、行末にcをつけることで完成する。
・種族値の数字は左揃えから、右揃えにしたい
・3つの特性の幅を均等にしたい
という2つを目標に以下のような書式指定行を設定する。
・RIGHT: → HP~合計の列は、右揃えにしなさい
・100 → 特性の列はセルの幅を100にしなさい
という命令が掛かっている。
なお、右の列と同じ命令を飛ばしたい場合、書式指定行>を指定すれば、全セルに記述子を書かなくていい。

||>|>|>|>|>|>|RIGHT:|>|>|100|c
|~ |~HP|~攻撃|~防御|~特攻|~特防|~素早|~合計|>|>|~特性|h
|~クチート|50|85|85|55|55|50|380|かいりきバサミ|いかく|ちからずく|
|~メガクチート|~|105|125|~|95|~|480|>|>|ちからもち|
HP攻撃防御特攻特防素早合計特性
クチート508585555550380かいりきバサミいかくちからずく
メガクチート10512595480ちからもち

コメント


*1 こういうやつ
*2 すまほ環境はしらない←画像長押ししたら出た♥️