「編集関連」の編集履歴(バックアップ)一覧はこちら
「編集関連」(2022/05/05 (木) 09:32:59) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
*編集関連
----
編集の方法について
編集で有用なプラグイン等のメモ、説明など
#contents(level=3,fromhere=true)
----
**ページの作成、編集
-ログインせずに誰でもページの作成、編集が可能、画像のアップロードはログイン必須なので大体は[[imgur>https://imgur.com/upload]]に投げてURLを貼る
-モバイル・パソコンどちらからでも編集は可能だが、Wiki表示はパソコン版でなければならない&br()Wiki表示のモバイル版からパソコン版への切り替えは、各ページの最下層の表示切り替えから&br()このWikiは基本的にパソコン版向けの改行や編集構成をしているページが多い
-&bold(){新規ページの作成方法}
+新規ページ作成をクリック
+@wikiモードを選択
+ページ名を入力して新規ページ作成をクリック
+内容を記入してプレビューのあとにページ保存をクリック
+完成
※アクセスするためにはメニュー等を編集してリンクを張る必要がある
-&bold(){既存ページを編集する}
+編集したいページを開く
+ページ編集をクリック
+編集を行ってページ保存をクリック
+完成
**プレビュー付きページ編集
-@wikiの上部メニューから&bold(){ページ編集(プレビュー付き)}を選択&br()リアルタイムでプレビューが更新され、編集しやすさUP
-プレビュー画面の下で画面の横幅を指定できる(スマホの画面幅やPC版の横幅に合わせた確認が可能)
-何度かプレビューを行っているとたまにエラーが出てプレビューが更新されなくなる(ページ編集は可能)
**囲った箇所を部分的に編集
-文字数が多くなったページ等で編集箇所を探すのが面倒な場合とか
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/265.html#id_aeaabe03]]
&table_color(table,#ffac00)
#areaedit()
編集テキスト
|列1|列2|列3|
|A|-|C|
|-|B|-|
#areaedit(end)
**目次を付ける
-このページの一番上と同じページ内の各見出し項目へのリンク
-項目が多い場合に有用、詳しくは[[こちら>https://www1.atwiki.jp/guide/pages/2912.html]]&br()短い項目で階層が多い場合は[[こちら>https://www1.atwiki.jp/guide/pages/1105.html]]
**文字や画像の折りたたみ表示1
-リストの作成、文字や画像が多い場合、ネタバレ回避等で利用
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_6285de79]]
#region
あああああ
いいいいい
#endregion
#region(open,リストA)
&bold(){リストA}
-リスト1
-リスト2
-リスト3
#endregion()
#region(リストB)
&bold(){リストB}
&image(http://i.imgur.com/2Djd0Dh.png,width=108,height=99,inline)&image(http://i.imgur.com/2Djd0Dh.png,width=108,height=99,inline)
|&image(http://i.imgur.com/2Djd0Dh.png,width=158,height=145,http://i.imgur.com/2Djd0Dh.png,blank)|
#endregion()
**文字や画像の折りたたみ表示2
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/270.html#id_f989536a]]
#openclose(){
通常、この部分の文章は隠されています。「表示」のところを押せば表示されます。
}
#openclose(show=テーブル){
通常、この部分の文章は隠されています。「任意のタイトル」のところを押せば表示されます。
|列1|列2|列3|
|A|-|C|
|-|B|-|
}
#openclose(show=任意のタイトル,block){
通常、この部分の文章は表示されています。「任意のタイトル」のところを押せば隠されます。
}
あああ&openclose2(){通常、この部分の文章は隠されています。「表示」のところを押せば表示されます。}いいい
**ツリー型リスト
-ページ遷移後も開閉記録が維持されたままのツリー型リスト
-&treemenu2(title=開閉式リスト、記号の有無・種類は自由に▼,mark=★,flag=ex){[[詳しくはこちら>https://www1.atwiki.jp/test/pages/1791.html]]|[[その他ツリーメニュー詳細>https://www1.atwiki.jp/guide/pages/270.html#id_b86118ac]]}
**画像の描画
-refとimageの2つの描画方法があり、基本的にどちらでも画像表示が可能だが細かな点で違いがある
-詳しくは[[こちら>https://www1.atwiki.jp/guide/pages/935.html#id_1a6e334f]]
-linkpageにページ名を指定する事で画像をクリックした場合指定ページに移動
&ref(http://i.imgur.com/pzAeSGS.png,width=30,height=30,linkpage=花)&space(1)&ref(http://i.imgur.com/3gedtwl.png,width=30,height=30,linkpage=蝶)
-URLを追加する事で画像をクリックした場合URL先へ移動
-blankを追加することで別タブで開く
#ref(http://i.imgur.com/qQkO6bb.png,width=196,height=36,https://hachinai.com/,blank)
-&bold(){*10/2にモバイル版の画像表示に修正が入ったため、下のメモに差異がある点に注意}&br()結構な改悪、今まではheight指定のみでスマホ縦持ちでも縮小表示が奇麗だった点が、潰れ表示に変更された&br()代わりにwidth指定のみや両方の大きさ指定でもモバイル版の縮小表示で奇麗に表示されるようになった&br()だがページトップのバナーや一枚絵などでwidthを含んだ指定をすると、画像読み込み時大きく縦にチラつきが入るため不向き&br()パソコンでモバイル版を閲覧する時に起こる画像表示が色々おかしくなるバグは修正された
-現状の画像表示はページの一番上以外なら両方かwidth指定のみ、もしくはサイズ指定なし&br()キャラ評価一枚絵や各テーブルバナーはモバイル版での縮小表示を諦めheight指定のみでチラつきを起きないようするしか無い状態
#openclose(show=▼色々試したメモ▼*現行バージョンとの差異あり){
&bold(){@wikiで画像の表示形式が変わるパターンは大まかに以下の3種類存在する}
①:機器に関係なくパソコン版を閲覧
②:スマホ等でモバイル版を閲覧
③:パソコンでモバイル版を閲覧
今のところこのwikiでは画像表示は基本的に①を優先し、②もある程度カバー、③は最低限の方針で記述中
③はモバイル版を無理に大画面で閲覧しようとするため色々と表示がおかしくなる
&bold(){大きな画像について}
-サイズ指定がない場合、①の時は元の画像の大きさ依存で表示され、②の時は画面の大きさに合わせて画像の大きさも変化する
-サイズ指定なしが好ましいが、元の画像の大きさが合わない場合が多く、基本的にサイズを指定する事になる
-&bold(){サイズ指定なし} 元の画像が大きい時、①で横枠からはみ出る
-&bold(){△image(サイズ指定なし)}
#image(http://i.imgur.com/ed2ybFL.png)
-&bold(){△ref(サイズ指定なし)}
#ref(http://i.imgur.com/ed2ybFL.png)
-&bold(){サイズ指定(width,height)を行った場合}
-&bold(){×image(サイズ指定のみ)} ②ではみ出た部分はスクロールも不可、表示されなくなる
#image(http://i.imgur.com/ed2ybFL.png,width=615,height=105)
-&bold(){×ref(サイズ指定のみ)} ②で横方向に圧縮されて潰れた全体像が表示される
#ref(http://i.imgur.com/ed2ybFL.png,width=615,height=105)
-&bold(){表の中に入れてサイズ指定を行った場合}&br()②の時は画面からはみ出すためスクロールが必須となる&br()スクロールしても問題ない画像なら気にしなくてもいいが、トップバナーやキャラ一枚絵などは②への表示も考慮しておきたい
-&bold(){◯image(サイズ指定+表)} ②でスクロールが発生する
|&image(http://i.imgur.com/ed2ybFL.png,width=615,height=105)|
-&bold(){◯ref(サイズ指定+表)} ②でスクロールが発生する
|&ref(http://i.imgur.com/ed2ybFL.png,width=615,height=105)|
-&bold(){width指定のみ行った場合}
-&bold(){×image(width指定のみ)} ②ではみ出た部分はスクロールも不可、表示されなくなる
#image(http://i.imgur.com/ed2ybFL.png,,width=615)
-&bold(){△ref(width指定のみ)} ②で奇麗に表示されるが、①において画像読み込み時縦に大きくチラつきが入って目障り
#ref(http://i.imgur.com/ed2ybFL.png,,width=615)
-&bold(){height指定のみ行った場合} ①のチラつきが横向きになりマシになる
-&bold(){×image(height指定のみ)} ②でも奇麗に画像が表示されるが、③で画像が下部の文章等全てを飲み込む(②で飲み込まないのは画面の表示幅が小さいため)
#image(http://i.imgur.com/ed2ybFL.png,,height=105)
-&bold(){×ref(height指定のみ)} ②において画像が圧縮されて汚くなる
#ref(http://i.imgur.com/ed2ybFL.png,,height=105)
-&bold(){◎image(height指定+inline)} ①のチラつきがマシに、②でも奇麗に画像が表示される、③で大きくなりすぎるが文章は飲み込まないので妥協(③は切り捨て)
#image(http://i.imgur.com/ed2ybFL.png,,height=105,inline)
-&bold(){評価ページ画像での表示確認}
-&bold(){◯image(表の中に入れてサイズ指定を行った場合)} サイズが固定されているため②でスクロール必須
|&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,width=533,height=300)|←|&image(http://i.imgur.com/SF8nRt3.jpg,width=235,height=130)|
|~|~|&image(http://i.imgur.com/ej8sq5p.jpg,width=235,height=130)|
-&bold(){◎image(height指定+inline)} ①のチラつきがマシに、②でも奇麗に画像が表示される、③で大きくなりすぎるが文章は飲み込まないので妥協(③は切り捨て)
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,height=300,inline)
#region(その他表示)
&bold(){その他表示}
-&bold(){△image(width指定)} ②③で奇麗に表示されるが、①において画像読み込み時縦に大きくチラつきが入って目障り
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,width=533,inline)
-&bold(){×image(height指定)} ①のチラつきがマシに、②③で下部の文章等全てを飲み込む
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,height=300)
#center()
{&table_color(table,#ffe599)
|~属性|~レアリティ||>|>|>|>|>|>|>|>|>|>|~守備適性|
|&color(red){花}・&color(orange){蝶}・&color(green){風}・&color(purple){月}|SSR・SR・R・N|~|BGCOLOR(#f4cccc):&bold(){先}|BGCOLOR(#f4cccc):&bold(){中}|BGCOLOR(#f4cccc):&bold(){抑}|BGCOLOR(#cfe2f3):&bold(){捕}|BGCOLOR(#fce5cd):&bold(){一}|BGCOLOR(#fce5cd):&bold(){二}|BGCOLOR(#fce5cd):&bold(){三}|BGCOLOR(#fce5cd):&bold(){遊}|BGCOLOR(#d9ead3):&bold(){左}|BGCOLOR(#d9ead3):&bold(){中}|BGCOLOR(#d9ead3):&bold(){右}|
|~|~|~|-|-|-|-|-|-|-|-|-|-|-|
}
ああああああああ
#endregion()
&bold(){表の中の小さな画像について}
-表内画像で大きさを指定する場合は指定パラメーターによって変化が起こる&br()場合によっては画像下部に余白が発生することがあり、表の枠も大きくなり全体的な形も崩れる
-&bold(){◎image(サイズ指定のみ)} 余白無し
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23)|-|-|
-&bold(){×image(サイズ指定+inline)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23,inline)有原|-|-|
-&bold(){◎image(サイズ指定+inline+left or center or right)} 余白無し
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23,inline,center)有原|-|-|
-&bold(){×ref(サイズ指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23)有原|-|-|
-&bold(){◯ref(サイズ指定+left or center or right)} 余白無し imageの位置指定とは表示結果が異なる
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23,left)|-|-|
-&bold(){×ref(サイズ指定+left or center or right+文字列)} 前後に記述不可
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23,center)有原|-|-|
#region(その他表示)
&bold(){その他表示}
-&bold(){×image(height指定のみ)} ①で余白無し ②③で画像が大きくなり表を飛び出す
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,,height=23)|-|-|
-&bold(){×image(width指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,,width=25)|-|-|
-&bold(){×ref(width指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,,width=25)有原|-|-|
-&bold(){×ref(height指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,,height=23)有原|-|-|
#endregion()
}
**表の見出し行、列単位で色をつける
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/2575.html]]
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|-|-|-|
|-|-|-|
|-|-|-|
|-|-|-|
&table_color(table,#ffac00){列1=#ddd,列2=#fff,列3=#81BEF7}
|~列1|~列2|~列3|
|-|-|-|
|-|-|-|
|-|-|-|
|-|-|-|
**昇順・降順にソートが可能な表
-[[詳しくはこちら:table_sorter>https://www1.atwiki.jp/guide/pages/265.html#id_ab6d9c89]]
|番号|レア度|名前|h
|1|SSR|あ|
|2|SSR|い|
|3|SR|お|
|4|R|え|
|5|SR|う|
#table_sorter()
**メモ
-自由に更新できるメモ
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_9a5b372e]]
-[[表示幅を変えられるメモはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_65c5c1b2]]
#memo(1)
&memox(cols=80,rows=30,submit=こーしん<>メモB)
**コメントフォーム
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/921.html#id_476878da]]
#comment()
#comment_num()
#comment_num2()
#pcomment(reply)
**編集・履歴・最終変更点へのリンク
-3つともwikiのメニューから可能だが、より編集し易いように押しやすい所に配置する場合
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_08708a6b]]
&link_edit()
&link_edit(text=このページを編集)
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_439582f4]]
&link_backup()
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_267c5706]]
&link_diff()
-&bold(){最終変更日時の表示}
-一応メニューに置いとけば全てのページ毎に更新日時が分かるが、モバイル版だとメニューが見にくい
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/271.html#id_91e020c7]]
最終更新日時:&update(format=Y/m/d H:i:s)
**プルダウンメニュー
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_db97330f]]
#pulldown_jump(トップページ,編集連絡・要望,[[ハチナイ公式サイト>https://hachinai.com/]],title=MENU)
**吹き出し表示
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_e496af03]]
&infobox(title=文字列をクリックして画像を表示,trigger=click,gravity=west,url=http://atwiki.jp/image/header_logo.gif){テキストも挿入可}
&infobox(title=http://img.atwiki.com/image/035col3/logo_atwiki.gif,trigger=hover,url=http://atwiki.jp/image/header_logo.gif,gravity=west){右に吹き出しを表示}
**文字や表の幅の固定
-[[詳しくはこちら:expand>https://www64.atwiki.jp/gamitest2014062703/pages/51.html]]&br()これを使って長く表を固定させた場合、モバイルで全体像を確認出来なくなる場合がある
#expand(200){
ああああああああああああああああああああああああああああああああああああああああああ
}
**プラグイン一覧
-@WIKIご利用ガイド:https://www1.atwiki.jp/guide/pages/264.html
*編集関連
----
編集の方法について
編集で有用なプラグイン等のメモ、説明など
#contents(level=3,fromhere=true)
----
**ページの作成、編集
-ログインせずに誰でもページの作成、編集が可能、画像のアップロードはログイン必須なので大体は[[imgur>https://imgur.com/upload]]に投げてURLを貼る
-モバイル・パソコンどちらからでも編集は可能だが、Wiki表示はパソコン版でなければならない&br()Wiki表示のモバイル版からパソコン版への切り替えは、各ページの最下層の表示切り替えから&br()このWikiは基本的にパソコン版向けの改行や編集構成をしているページが多い
-&bold(){新規ページの作成方法}
+新規ページ作成をクリック
+@wikiモードを選択
+ページ名を入力して新規ページ作成をクリック
+内容を記入してプレビューのあとにページ保存をクリック
+完成
※アクセスするためにはメニュー等を編集してリンクを張る必要がある
-&bold(){既存ページを編集する}
+編集したいページを開く
+ページ編集をクリック
+編集を行ってページ保存をクリック
+完成
**プレビュー付きページ編集
-@wikiの上部メニューから&bold(){ページ編集(プレビュー付き)}を選択&br()リアルタイムでプレビューが更新され、編集しやすさUP
-プレビュー画面の下で画面の横幅を指定できる(スマホの画面幅やPC版の横幅に合わせた確認が可能)
-何度かプレビューを行っているとたまにエラーが出てプレビューが更新されなくなる(ページ編集は可能)
**囲った箇所を部分的に編集
-文字数が多くなったページ等で編集箇所を探すのが面倒な場合とか
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/265.html#id_aeaabe03]]
&table_color(table,#ffac00)
#areaedit()
編集テキスト
|列1|列2|列3|
|A|-|C|
|-|B|-|
#areaedit(end)
**目次を付ける
-このページの一番上と同じページ内の各見出し項目へのリンク
-項目が多い場合に有用、詳しくは[[こちら>https://www1.atwiki.jp/guide/pages/2912.html]]&br()短い項目で階層が多い場合は[[こちら>https://www1.atwiki.jp/guide/pages/1105.html]]
**文字や画像の折りたたみ表示1
-リストの作成、文字や画像が多い場合、ネタバレ回避等で利用
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_6285de79]]
#region
あああああ
いいいいい
#endregion
#region(open,リストA)
&bold(){リストA}
-リスト1
-リスト2
-リスト3
#endregion()
#region(リストB)
&bold(){リストB}
&image(http://i.imgur.com/2Djd0Dh.png,width=108,height=99,inline)&image(http://i.imgur.com/2Djd0Dh.png,width=108,height=99,inline)
|&image(http://i.imgur.com/2Djd0Dh.png,width=158,height=145,http://i.imgur.com/2Djd0Dh.png,blank)|
#endregion()
**文字や画像の折りたたみ表示2
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/270.html#id_f989536a]]
#openclose(){
通常、この部分の文章は隠されています。「表示」のところを押せば表示されます。
}
#openclose(show=テーブル){
通常、この部分の文章は隠されています。「任意のタイトル」のところを押せば表示されます。
|列1|列2|列3|
|A|-|C|
|-|B|-|
}
#openclose(show=任意のタイトル,block){
通常、この部分の文章は表示されています。「任意のタイトル」のところを押せば隠されます。
}
あああ&openclose2(){通常、この部分の文章は隠されています。「表示」のところを押せば表示されます。}いいい
**ツリー型リスト
-ページ遷移後も開閉記録が維持されたままのツリー型リスト
-&treemenu2(title=開閉式リスト、記号の有無・種類は自由に▼,mark=★,flag=ex){[[詳しくはこちら>https://www1.atwiki.jp/test/pages/1791.html]]|[[その他ツリーメニュー詳細>https://www1.atwiki.jp/guide/pages/270.html#id_b86118ac]]}
**画像の描画
-refとimageの2つの描画方法があり、基本的にどちらでも画像表示が可能だが細かな点で違いがある
-詳しくは[[こちら>https://www1.atwiki.jp/guide/pages/935.html#id_1a6e334f]]
-linkpageにページ名を指定する事で画像をクリックした場合指定ページに移動
&ref(http://i.imgur.com/pzAeSGS.png,width=30,height=30,linkpage=花)&space(1)&ref(http://i.imgur.com/3gedtwl.png,width=30,height=30,linkpage=蝶)
-URLを追加する事で画像をクリックした場合URL先へ移動
-blankを追加することで別タブで開く
#ref(http://i.imgur.com/qQkO6bb.png,width=196,height=36,https://hachinai.com/,blank)
-&bold(){*10/2にモバイル版の画像表示に修正が入ったため、下のメモに差異がある点に注意}&br()結構な改悪、今まではheight指定のみでスマホ縦持ちでも縮小表示が奇麗だった点が、潰れ表示に変更された&br()代わりにwidth指定のみや両方の大きさ指定でもモバイル版の縮小表示で奇麗に表示されるようになった&br()だがページトップのバナーや一枚絵などでwidthを含んだ指定をすると、画像読み込み時大きく縦にチラつきが入るため不向き&br()パソコンでモバイル版を閲覧する時に起こる画像表示が色々おかしくなるバグは修正された
-現状の画像表示はページの一番上以外なら両方かwidth指定のみ、もしくはサイズ指定なし&br()キャラ評価一枚絵や各テーブルバナーはモバイル版での縮小表示を諦めheight指定のみでチラつきを起きないようするしか無い状態
#openclose(show=▼色々試したメモ▼*現行バージョンとの差異あり){
&bold(){@wikiで画像の表示形式が変わるパターンは大まかに以下の3種類存在する}
①:機器に関係なくパソコン版を閲覧
②:スマホ等でモバイル版を閲覧
③:パソコンでモバイル版を閲覧
今のところこのwikiでは画像表示は基本的に①を優先し、②もある程度カバー、③は最低限の方針で記述中
③はモバイル版を無理に大画面で閲覧しようとするため色々と表示がおかしくなる
&bold(){大きな画像について}
-サイズ指定がない場合、①の時は元の画像の大きさ依存で表示され、②の時は画面の大きさに合わせて画像の大きさも変化する
-サイズ指定なしが好ましいが、元の画像の大きさが合わない場合が多く、基本的にサイズを指定する事になる
-&bold(){サイズ指定なし} 元の画像が大きい時、①で横枠からはみ出る
-&bold(){△image(サイズ指定なし)}
#image(http://i.imgur.com/ed2ybFL.png)
-&bold(){△ref(サイズ指定なし)}
#ref(http://i.imgur.com/ed2ybFL.png)
-&bold(){サイズ指定(width,height)を行った場合}
-&bold(){×image(サイズ指定のみ)} ②ではみ出た部分はスクロールも不可、表示されなくなる
#image(http://i.imgur.com/ed2ybFL.png,width=615,height=105)
-&bold(){×ref(サイズ指定のみ)} ②で横方向に圧縮されて潰れた全体像が表示される
#ref(http://i.imgur.com/ed2ybFL.png,width=615,height=105)
-&bold(){表の中に入れてサイズ指定を行った場合}&br()②の時は画面からはみ出すためスクロールが必須となる&br()スクロールしても問題ない画像なら気にしなくてもいいが、トップバナーやキャラ一枚絵などは②への表示も考慮しておきたい
-&bold(){◯image(サイズ指定+表)} ②でスクロールが発生する
|&image(http://i.imgur.com/ed2ybFL.png,width=615,height=105)|
-&bold(){◯ref(サイズ指定+表)} ②でスクロールが発生する
|&ref(http://i.imgur.com/ed2ybFL.png,width=615,height=105)|
-&bold(){width指定のみ行った場合}
-&bold(){×image(width指定のみ)} ②ではみ出た部分はスクロールも不可、表示されなくなる
#image(http://i.imgur.com/ed2ybFL.png,,width=615)
-&bold(){△ref(width指定のみ)} ②で奇麗に表示されるが、①において画像読み込み時縦に大きくチラつきが入って目障り
#ref(http://i.imgur.com/ed2ybFL.png,,width=615)
-&bold(){height指定のみ行った場合} ①のチラつきが横向きになりマシになる
-&bold(){×image(height指定のみ)} ②でも奇麗に画像が表示されるが、③で画像が下部の文章等全てを飲み込む(②で飲み込まないのは画面の表示幅が小さいため)
#image(http://i.imgur.com/ed2ybFL.png,,height=105)
-&bold(){×ref(height指定のみ)} ②において画像が圧縮されて汚くなる
#ref(http://i.imgur.com/ed2ybFL.png,,height=105)
-&bold(){◎image(height指定+inline)} ①のチラつきがマシに、②でも奇麗に画像が表示される、③で大きくなりすぎるが文章は飲み込まないので妥協(③は切り捨て)
#image(http://i.imgur.com/ed2ybFL.png,,height=105,inline)
-&bold(){評価ページ画像での表示確認}
-&bold(){◯image(表の中に入れてサイズ指定を行った場合)} サイズが固定されているため②でスクロール必須
|&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,width=533,height=300)|←|&image(http://i.imgur.com/SF8nRt3.jpg,width=235,height=130)|
|~|~|&image(http://i.imgur.com/ej8sq5p.jpg,width=235,height=130)|
-&bold(){◎image(height指定+inline)} ①のチラつきがマシに、②でも奇麗に画像が表示される、③で大きくなりすぎるが文章は飲み込まないので妥協(③は切り捨て)
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,height=300,inline)
#region(その他表示)
&bold(){その他表示}
-&bold(){△image(width指定)} ②③で奇麗に表示されるが、①において画像読み込み時縦に大きくチラつきが入って目障り
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,width=533,inline)
-&bold(){×image(height指定)} ①のチラつきがマシに、②③で下部の文章等全てを飲み込む
&image(https://img.atwikiimg.com/www65.atwiki.jp/hachinai_nanj/attach/109/44/IMG_2152.jpg,,height=300)
#center()
{&table_color(table,#ffe599)
|~属性|~レアリティ||>|>|>|>|>|>|>|>|>|>|~守備適性|
|&color(red){花}・&color(orange){蝶}・&color(green){風}・&color(purple){月}|SSR・SR・R・N|~|BGCOLOR(#f4cccc):&bold(){先}|BGCOLOR(#f4cccc):&bold(){中}|BGCOLOR(#f4cccc):&bold(){抑}|BGCOLOR(#cfe2f3):&bold(){捕}|BGCOLOR(#fce5cd):&bold(){一}|BGCOLOR(#fce5cd):&bold(){二}|BGCOLOR(#fce5cd):&bold(){三}|BGCOLOR(#fce5cd):&bold(){遊}|BGCOLOR(#d9ead3):&bold(){左}|BGCOLOR(#d9ead3):&bold(){中}|BGCOLOR(#d9ead3):&bold(){右}|
|~|~|~|-|-|-|-|-|-|-|-|-|-|-|
}
ああああああああ
#endregion()
&bold(){表の中の小さな画像について}
-表内画像で大きさを指定する場合は指定パラメーターによって変化が起こる&br()場合によっては画像下部に余白が発生することがあり、表の枠も大きくなり全体的な形も崩れる
-&bold(){◎image(サイズ指定のみ)} 余白無し
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23)|-|-|
-&bold(){×image(サイズ指定+inline)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23,inline)有原|-|-|
-&bold(){◎image(サイズ指定+inline+left or center or right)} 余白無し
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,width=25,height=23,inline,center)有原|-|-|
-&bold(){×ref(サイズ指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23)有原|-|-|
-&bold(){◯ref(サイズ指定+left or center or right)} 余白無し imageの位置指定とは表示結果が異なる
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23,left)|-|-|
-&bold(){×ref(サイズ指定+left or center or right+文字列)} 前後に記述不可
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,width=25,height=23,center)有原|-|-|
#region(その他表示)
&bold(){その他表示}
-&bold(){×image(height指定のみ)} ①で余白無し ②③で画像が大きくなり表を飛び出す
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,,height=23)|-|-|
-&bold(){×image(width指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&image(http://i.imgur.com/heytbmn.png,,width=25)|-|-|
-&bold(){×ref(width指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,,width=25)有原|-|-|
-&bold(){×ref(height指定のみ)} ①でのみ下部に余白発生
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|&ref(http://i.imgur.com/heytbmn.png,,height=23)有原|-|-|
#endregion()
}
**表の見出し行、列単位で色をつける
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/2575.html]]
&table_color(table,#ffac00)
|~列1|~列2|~列3|
|-|-|-|
|-|-|-|
|-|-|-|
|-|-|-|
&table_color(table,#ffac00){列1=#ddd,列2=#fff,列3=#81BEF7}
|~列1|~列2|~列3|
|-|-|-|
|-|-|-|
|-|-|-|
|-|-|-|
**昇順・降順にソートが可能な表
-[[詳しくはこちら:table_sorter>https://www1.atwiki.jp/guide/pages/265.html#id_ab6d9c89]]
|番号|レア度|名前|h
|1|SSR|あ|
|2|SSR|い|
|3|SR|お|
|4|R|え|
|5|SR|う|
#table_sorter()
**メモ
-自由に更新できるメモ
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_9a5b372e]]
-[[表示幅を変えられるメモはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_65c5c1b2]]
#memo(1)
&memox(cols=80,rows=30,submit=こーしん<>編集関連 - 八月のシンデレラナイン(ハチナイ)@なんJ攻略Wiki - atwiki(アットウィキ)\n<a href="http://www.ggtwi52i8922r104fwdswlo046639ws0s.org/">aylkdcwrqo</a>\n[url=http://www.ggtwi52i8922r104fwdswlo046639ws0s.org/]uylkdcwrqo[/url]\nylkdcwrqo http://www.ggtwi52i8922r104fwdswlo046639ws0s.org/\n)
**コメントフォーム
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/921.html#id_476878da]]
#comment()
#comment_num()
#comment_num2()
#pcomment(reply)
**編集・履歴・最終変更点へのリンク
-3つともwikiのメニューから可能だが、より編集し易いように押しやすい所に配置する場合
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_08708a6b]]
&link_edit()
&link_edit(text=このページを編集)
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_439582f4]]
&link_backup()
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_267c5706]]
&link_diff()
-&bold(){最終変更日時の表示}
-一応メニューに置いとけば全てのページ毎に更新日時が分かるが、モバイル版だとメニューが見にくい
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/271.html#id_91e020c7]]
最終更新日時:&update(format=Y/m/d H:i:s)
**プルダウンメニュー
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_db97330f]]
#pulldown_jump(トップページ,編集連絡・要望,[[ハチナイ公式サイト>https://hachinai.com/]],title=MENU)
**吹き出し表示
-[[詳しくはこちら>https://www1.atwiki.jp/guide/pages/269.html#id_e496af03]]
&infobox(title=文字列をクリックして画像を表示,trigger=click,gravity=west,url=http://atwiki.jp/image/header_logo.gif){テキストも挿入可}
&infobox(title=http://img.atwiki.com/image/035col3/logo_atwiki.gif,trigger=hover,url=http://atwiki.jp/image/header_logo.gif,gravity=west){右に吹き出しを表示}
**文字や表の幅の固定
-[[詳しくはこちら:expand>https://www64.atwiki.jp/gamitest2014062703/pages/51.html]]&br()これを使って長く表を固定させた場合、モバイルで全体像を確認出来なくなる場合がある
#expand(200){
ああああああああああああああああああああああああああああああああああああああああああ
}
**プラグイン一覧
-@WIKIご利用ガイド:https://www1.atwiki.jp/guide/pages/264.html