半角数字のみのコメントを非表示にしたい

対象

わんコメ

利用OS

Windows

利用バージョン: Windows、わんコメやOBSのバージョン

Windows: 11
わんコメ: 5.1.4
OBS: 0.0.0(こちら今回関係がないためSKIPさせてくださいませ)

PRO版を利用

している

過去ログ確認 (検索はこちらから)

した

ドキュメント確認 (公式サイト)

した

内容

いつもお世話になっております!

配信プラットフォームのイベントなどでポイントのために「視聴者が1~100をカウントする」という行為があるのですが、こちらが通常コメントと混ざってしまうため、可能であれば半角数字のみのコメントを非表示にしたいと思っています。

こちら現状の仕様で非表示にする方法はございますでしょうか。
ご教示いただけますと大変助かります。

何卒よろしくお願いいたします。

半角数字「1~100」のみで投稿されているコメントを非表示にしたいのですね。

残念ながら、現状のわんコメの設定では、非表示にはできません。

要望の「非表示」とは異なってしまいますが、文字列置換機能を使えば、好きな文字に置き換えることは可能です。


ただ、わんコメの設定にはご希望の機能がないだけで、ご自身でテンプレートをカスタマイズすれば、希望いただいている半角数字を非表示にすることは可能です。

basicをベースにしたサンプルのテンプレートを用意いたしましたので、そちらも確認いただくとわかりやすいかと思います。

▼サンプルテンプレートのダウンロード
https://nvl-game.tokyo/uploads/onecomme/templates/basic-ngword-forum-1559.zip


このサンプルテンプレートのindex.htmlの26行目には、

:data-ngcomment="comment.data.comment"

というものが追加されています。

そして、style.cssを開いていただくと「1」と「2」だけ設定してありますが、半角数字の「1」だけのコメントを消すために

[data-ngcomment="1"] {
    display: none;
}

が指定してあります。

面倒ではありますが、これを「100」まで設定すれば(上記コードをコピペして、数字だけ書き換えればいいと思います)、1~100の半角数字だけのコメントは非表示とすることができます。

スクリーンショット 2024-03-18 192025
1と2だけ非表示にしている例のスクショ(左がサンプルそのままのbasicテンプレ)


サンプルのテンプレートはbasicを使っていますが、その他のテンプレートでも同じような手法が使えますので、ご自身でのカスタマイズを試してみてください。

【重要】
テンプレートをカスタマイズする際には、必ずもとのテンプレートをコピーして別名にしたうえで作業してください。

ちなみに、1~100までの100パターン登録するのが面倒、ということがあれば、以下のように非表示の絞り込みを緩くすることもできます。

[data-ngcomment^="1"] {
    display: none;
}

このコードを使う場合は先の投稿で示したコード違い、半角の「1」から始まるコメントはすべて表示されません
1~100の間で言うと、1と10~19と100がこの1つのCSSだけで非表示にできます。

つまり、1~100の半角数字を非表示にする場合、先の投稿で示したコードだと1~100の100パターン必要でしたが、こちらは1~9で始まるコメントの9パターンの指定で解決するということです。


【デメリット】
1~100の半角数字のみをキッチリ指定していないため、たとえば

「1000回腹筋しました」

という半角数字以外も含んでいるコメントや、1~100の範囲外の数字があっても、半角「1」から始まるコメントであるため、非表示になってしまいます。

ただ同じようなコメントでも

「腹筋1000回しました」

というコメントであれば、半角数字以外から始まるコメントであるため、半角数字を含んでいても表示が可能です。

スクリーンショット 2024-03-18 213619
1から始まるコメントが数字以外を含んでもすべて非表示なる例

【メリット】

  • テンプレートをカスタムする工程が少ない
  • 工程が少ないため半角数字以外に全角数字の指定もしやすい(必要ならば)

こちらのパターンのように、大まかな指定で作業工程を減らすこともできますが、思っていなかったコメントまで非表示へと巻き込んでしまう可能性があるため、一長一短ですね :sweat_smile:

どちらのパターンで非表示を実現するにせよ、テンプレートをカスタマイズする際には、必ずもとのテンプレートをコピーして別名にしたうえで作業 するのを忘れないようお願いいたします。

shinkunoshizuku様

テンプレートの制作までありがとうございました!
こちら無事に解決いたしました。

ありがとうございました!

解決したようでなによりです :+1:

サンプルとして用意させていただいたテンプレートはbasicを使わせていただきましたが、
index.htmlに追記する

:data-ngcomment="comment.data.comment"

や、style.cssに追記(もしくはOBSのカスタムCSSに追記)する

[data-ngcomment="1"] {
    display: none;
}

といったものをわんコメのその他テンプレートにも適用すれば、同じように半角数字の非表示が可能となります。


また、おせっかいかもしれませんが、イベントでカウントするとのことで、もう一つ環境によってはテンプレートを見直すといいかもしれない部分もあります。

テンプレートにはscript.jsが含まれていますが、1行目の

const LIMIT = 30

で表示するコメントの数(上記コードで非表示にしたを含む)を制限しています。

LIMITの数字(30)を大きくすると負荷は高くなりますが、本件で非表示に設定した1~100の数字が一気にコメントされた際に、通常のコメントが押し出されて不自然に消えてしまうことを防ぎやすくはなります。

通常コメントが押し出される例 ←クリックでオープン
  • カウントする人が一気に増え、通常コメントが極端に少なくなったとき

ただ若干ながらPCへの負荷が高まるため、数字を大きくする際には一気にではなく、少しずつ調整するとよいかと思います。


もし今後、こんなカスタマイズがしたいという相談が出てきた際には、カスタマイズカテゴリもご活用いただければと思います。


【気をつけていただきたい点】
本件に限らずテンプレートをカスタマイズする際には、そのまま進めるとわんコメ本体やお使いの配布テンプレートのアップデートがあるとき上書きされてしまうため、必ずテンプレートを複製して別名のフォルダを作ってカスタマイズを進めていただくようお願いいたします。
(テンプレエディタを使うなど、OBSのカスタムCSSに追記するだけのときは別)