特殊タグを使用したデザインの紹介 作：SunGenuin(佐藤)
ハーメルンにおける「掲示板形式」のほぼ8割は「2ch/5ch」をベースに表現されているかと思います。
世の中にはメイン機能が掲示板ではなく、付属品として掲示板を提供しているサービスもあります。
今回は、そういった「付属品としての掲示板」を表現できるデザインを紹介します。
あくまでも一例ですので、下記を参考にいろいろとカスタムしてみてください。
今回の参考にしたのは競馬情報サイト「netkeiba.com」さんの掲示板ページです。
PC版を元にしているため、色合いもPC版の緑を中心にしています。
スマホ版っぽくしたい場合は、色を青やそれに近しいカラーコードに置き換えてください。
≪例≫
○○掲示板（XXXX件）
？ ミュート、報告の使い方 ∨
なまえ さん lwqBCAJ | と フォローする |
タグの構成を説明します。
今回メインで使用するタグは「box」です。
「table」等で表現することも可能ではあると思いますが、個人的に分解しやすく打ちやすいタグが「box」なのでこちらで表現します。
構成の大外のbox①は
wide : 100% ※固定
padding : 0.2
backgroundColor : 4C7F00 (= green)
paddingはbox内側の余白を指定するものです。
一番外の縁から0.2余白を取って、そこにもう1個下記のbox②を重ねることで太い枠を表現します。
wide : 100% ※固定
padding : 0.3
borderColor : 4C7F00 (= green)
backgroundColor : 4C7F00 (= green)
新しくborderColor(bo)を追加しています。
これはbox②の外枠のカラーを指定したものです。
後は他に変化はありませんが、このbox②内に掲示板のタイトルを入れることを想定しています。
次のbox③は、box②を《 /box》で閉じてから使用しましょう。
wide : 100% ※固定
padding : 0.3
backgroundColor : FFFFFF(= white)
box③内部にあるbox④には掲示板に関する注意書きを置いています。
必要ない場合はbox④を作成しなくてもかまいません(しかしbox③は打ちましょう)
次のbox⑤からメインに入ります。
《 hr》で水平線を入れた後、box③と同じ構成のboxをもう一度置きます。
この時重要なのは、box③を閉じた後に打ち始めることです。
打ち終えたら、box⑤内にtableを置きます。
ここから少し複雑です。
テーブル全体の構成
backgroundColor : FFFFFF
各コマごとの構成(※半角スペースを入れているのでコピペ注意)
①アイコン
《 box:w10%,bg#EAE8F2,p1.5》《 /box》
②ユーザー名やID
《 left》《 blue》なまえ《 /blue》 さん 《 color:#808080》lwqBCAJ《 /color》 《 /left》
全体的に左に寄せるよう指定する
③フォローボタン
《 box:p0.2,bo#a9a9a9,bg#FFFFFF》《 blue》《 text:s0.8》《 font:u58》と《 /font》 フォローする《 /text》《 /blue》《 /box》
boxタグでボタンを再現すると崩れにくい
フォントは有志が提供しているものです
ここまでテーブルを整えたら「《 /table》」でしっかり閉じてください。
その後にメインのコメントを書き込むbox⑥を設置します。
wide : 100% ※固定
padding : 0.5
backgroundColor : FFFFFF(= white)
内側の余白を0.5に変更することで、文字を見やすくできます。
box⑤を《 /box》で閉じた後は、再び水平線(《 hr》)を打ち込みます。
コメントを増やす場合は、box⑤とその中身、そして水平線までをコピーし、再度貼り付けることで続きます。
≪例2≫
○○掲示板（XXXX件）
？ ミュート、報告の使い方 ∨
なまえ さん lwqBCAJ | と フォローする |
なまえ さん lwqBCAJ | と フォローする |
改行も機能します
以上で完了です。
冒頭では付属的な掲示板として紹介しましたが、もちろんメインの掲示板としての使用していただくのもOKです。
あくまで一例ですので、常識と利用規約の範囲でご自由にお使いください。
このデザインとは別の話ですが、有志の方による「ハーメルの特殊タグに対応したジェネレーター」なるものもございます。
制作者様より当デザインをいくつかベースに利用しているとのことで、こちらでもご紹介させて頂こうと思います。
Z/Generator
2024/04/13時点で確認できているのは
・マシュマロ風
・大百科風
・LINE風
・匿名掲示板風
です。
ハーメルン非公式の有志によるジェネレーターなので、もちろんハーメルンを運営していらっしゃる「作る人」様は関与しておらず、当方もデザインをベースにして頂いているだけで関与しておりません。
ジェネレーターに関するご質問等は上記サイトにて直接運営者様にお聞き頂ければと思います。