「そういやWEB拍手って今どうなってるんだろ?」と調べていたら見つけました。
いや……懐かしすぎますわ。むかし同人界隈で流行った「本家WEB拍手」とはちょっと違うんですけど、だいたい似た感じで使えます。
この記事の目次
「WEB拍手ってなに?」
昔そういうのが流行ったんですよ……(インターネット老人会)。
今でこそ同人サークルって、Twitterやpixivで活動してますけど、昔は自分のサイトを持ってるのが普通だったんです。
で、クリック1つで「応援の気持ち」を送れるのが、WEB拍手というサービスでした。
↑「本家」のWEB拍手はこちら。
本家のWEB拍手、もう更新止まってます(2018年現在)。まだ一応動くみたいですが、掲示板にはスパムが溢れかえってるし、ブログも止まってるし、セキュリティ対策大丈夫なんですかね……。自分はさっきログインして、ID削除しておきました。過去ログも消えてましたし。
ともあれ(本家)WEB拍手は、同人界隈で一時代を築いたサービスだったわけです。ほんとお世話になりました。
「まろやかWEB拍手」について
↑詳しくは上記公式ページをどうぞ。
まろやかWEB拍手は、本家WEB拍手に近い機能をもったツールです。本家と大きく違う点は、「直接設置」「改変」できるところ。公式サイトでは高機能版のシェアウェアも配布されています。
PHPやショートコードでカンタン設置
デフォルトで各記事の下に設置できます。またPHPやショートコードを利用すれば、好きな場所に設置できます。
(まったく無意味な大量設置も可能)
↑はぜんぶ同じ数字になってますが、ページごとに独立したWEB拍手も設置可能です。
IPアドレスによるブラックリスト機能もある
本家WEB拍手でユーザーがすこし困ってたところって、「匿名の嫌がらせ対策」が用意されてなかったことなんですよね。
特に同人界隈は、昔からそういう嫌がらせが多発しやすい場所ですから(二次創作界隈はカップリングや描写で戦争が起こる)。かなり悩まされていた作者の方も多かったとおもいます。うちは一次創作メインだったおかげか幸い少なかったですが。
「まろやかWEB拍手」では、投稿者のIPアドレスを確認できます。また、それを利用してブラックリスト登録も可能です。中には偽装ツールを使ってIP誤魔化すような根っからの犯罪者予備軍の方もいるとは思いますが、レアケースですし、その時はその時で別の対策をすればいい話ですね。
関連記事
カスタマイズ
余白が気になったので削除
/* WEB拍手 */ .btn{ margin:0; } p.thanks-msg{ color:#000000; }
デフォルトで余白があるんですよね。それがどうも気になったんで、CSSに追記して余白を削除しました。また、感謝メッセージの色を調整しました。
「なんかここ弄りたいなー」ってとこは、その場所で右クリックして、Chromeの「検証」機能でCSS等を確認し、適宜追記すればいいのかなと。
フォントサイズを大きく(追記)
.maroyaka-webclap .btn-xs, .maroyaka-webclap .btn-group-xs > .btn{ padding: 5px 10px; font-size: 16px; }
スマホからだとボタン小さい気がしたので、すこし大きくしました。
↑ではフォントサイズを大きくするだけでなく、内側余白(padding)もすこし調整しています。
アラート(alert)装飾と競合する時はbefore要素を隠す(追記)
div.alert.alert-success::before{ display: none; }
自分は「Simplicity2」というWordPressテーマを使っているのですが、見事にalert装飾(ビックリマーク)と要素名が被ってました。
送信するたびにビックリマークがデカデカと表示されてしまっていたので、↑のように記述して、WEB拍手に関連するalertのbefore要素のみを隠しました。
スマホのサイドバー下などに隠れてしまう時は最前面に(追記)
.mwc-message-box{ z-index: 999999999999 !important; }
スマホのスライドサイドバーで拍手ボタンを押すと、サイドバーの下にメッセージボックスが表示されてしまったので、カスタマイズしました。
↑の「99999~~」の部分は大きな数字ならなんでもいいです。「メッセージボックスをz軸の最前面に置く」という意味になってます。また「!important」を付記することで、この命令を優先させます。
おわりに 「メールフォームで十分じゃね……?」
それを言っちゃあ、おしめーなんだよ……。
まぁメールフォームで十分だとはおもうんですけど()、なんか懐かしかったので設置してみました。お気軽にメッセージください。
↑コレ
今回は以上です。ではまたφ(・ω・ )