#AQM

I oppose and protest the Russian invasion of Ukraine.

はてなブログ に #codoc で「投げ銭」機能を無理やり載せる

f:id:AQM:20210115113617p:plain

『お金の無駄遣いを指す表現として使われる「金をドブに捨てる」のイラストです。』

だそうです。誰がドブみたいなブログやねん。

 

経緯・考え方

ブログも毎日やってると飽きてくるもので、年も改まったしなんか新しいことをやりたいなと、とりあえずブクマ非表示とかやってみてるんですが、

aqm.hatenablog.jp

他なんかないかなと考えた結果、YOUTUBEのゲーム実況とか見ててスパチャが羨ましくて「俺も投げ銭されたい!」と思ったので、やってみようと思います。

モチベの源泉の日々のKPIにしろお金にしろ、多いに越したことはない。不正な手段に頼らない範囲で、お金は欲しい。

うちのブログは「金を取る」ほどのものを書いてない自覚はあるので、有料記事(コンテンツ販売)じゃなくてあくまでご厚意頼りの「投げ銭」がいいかなと思います。

 

現在のはてなブログで主流のやり方ではないので、嫌儲的に嫌われそうな感じですが、都合の良いことにちょうどブクマも非表示にしてるし、そもそも

f:id:AQM:20210115115127p:plain

うちのブログ、元々はてな内で全然人気なくて「がっかりしましたAQMちゃんのファンやめます!」という人も別にいないので、客が離れる心配いらないし、たぶん炎上もしねえだろ。炎上したらはてな社さんは投げ銭機能実装の観測気球として参考にしてください。

はてなブログの標準機能で実装しててくれたら楽なんですけど、んで、よく「noteに客が流れてる」と言われているとおり、はてな社内でもはてなブログへの投げ銭機能は当然検討されているとは思うんですが、「はてなブログ+はてなブックマーク」はユーザ傾向として嫌儲的空気が強かったり互助会問題があったりする元々舵取りが難しいコミュニティである中、そうした問題を助長させかねない機能ではあるので、石橋を叩いて渡らない慎重な社風もあって実装されるにしても時間がかかりそうよね。

はてなポイントは…ああ、うん…

 

というわけで他社のサービスを無理やり乗っける感じでやりたいと思います。

 

サービス選択

下調べ

最初に思ったのは、noteかFANBOXあたりで賽銭箱代わりの捨てエントリーを置いて、そこへのリンクを貼っとけばいいかな、と思いました。

help.note.com

www.fanbox.cc

が、FANBOXはともかく、noteは最近のいろいろ以前から元々あんまり好きじゃないので、投げ銭される度にnoteに手数料がチャリンチャリンと入るのも業腹なので、なんかないかなとちょっと調べるというか、ググってみました。

www.google.com

www.google.com

 

したらちょうど、最近noteからはてなブログに引っ越して来た id:cafe_petit さんの記事があったので、これに沿ってやればええやんけ!ってなった。

petitmatch.hatenablog.com

 

codocというサービスを使ってるらしく、codoc側でもはてなブログへの実装方法なんてエントリーがあるのでこの辺も参考に。

codoc.jp

 

さらに id:cafe_petit さんのcodoc設置特化の解説記事。

petitmatch.hatenablog.com

先駆者が既にいてBANもされてないってのは、下調べが楽でいいですね。

 

機能・条件 比較

こういうの作ろうと思ったんですけど

  codoc note FANBOX
投げ銭 設置場所 ブログに直置き    
利用料 無料    
課金手数料 15%    
売上金 銀行振込    
振込手数料 300円/回    
投げ銭(サポート)者のログイン 不要    
投げ銭(サポート)決済方法 クレジットカード    
投げ銭(サポート)金額制限 100〜10000円    

 

途中でもう気持ち的に「もうcodocでいいじゃん」とめんどくさくなった。別にこのブログは税金で運営してるわけでもないのでそこまで公平性に配慮する必要もないし、随意の選択でよくね?

そのうち気が向いたらnoteとFANBOXについても調べて埋めるかも。

 

codocの利用方法

サポート(投げ銭)の練習・テスト

利用料とか手数料も大事なんですけど、投げ銭する側の「投げ銭しやすさ」も大事よねえ、投げ銭するために使ってないサービスのアカウントをいちいち作るの面倒よねえ、ということで、投げ銭まで試してみました。

 

申し訳ないが id:cafe_petit さんには参考になった記事のお礼も兼ねて投げ銭の実験台になっていただく。

 

id:cafe_petit さんの記事の下部の「オオスキにコーヒーをおごる」をクリックすると

f:id:AQM:20210115202247p:plain

 

こういう画面になるので、メッセージを入れて金額を選択

f:id:AQM:20210115202304p:plain

「この価格に決定」をクリックすると、

 

こう遷移するので、

f:id:AQM:20210115202319p:plain

「会員登録しないで決済」をクリック。

お、会員登録しないで決済できるのはいいね。

 

決済画面に遷移。メルアド、ニックネーム、クレカ情報を入力。

f:id:AQM:20210115202334p:plainメルアドの入力も必須なのがダルいっちゃダルいね。

 

クレカ情報まで全部入力したら「支払う」をクリック。

 

f:id:AQM:20210115202354p:plain

これで投げ銭完了。

システムを介して id:cafe_petit さんから丁寧なお礼メッセージをいただいてビビった。

こちらこそ勉強になりました。ありがとうございました。

 

codocのユーザ登録

支払いが終わったらそのまま流れるようにcodocの入会を促して来たので、

f:id:AQM:20210115202510p:plain

 

最初っからそのつもりだったので、パスワードを登録。

f:id:AQM:20210115202443p:plain

メール認証やらなんやらありますけど、図解するほどでもないので割愛。

メルアドとクレカ情報はもう入力済みなので、楽ね。

 

ブログにサポートウィジェット(投げ銭機能)を設置

登録が済んだので、さっそく投げ銭ウィジェットを作ってブログに設置しまう。

codocのダッシュボード画面で「サポート機能(投げ銭)の設置」をクリック。

f:id:AQM:20210115202541p:plain

 

説明文を編集して、「<>貼り付けタグを表示」をクリック。

f:id:AQM:20210115202606p:plain

 

デフォの「JS+要素」のまま、「クリップボードにコピー」をクリック。

f:id:AQM:20210115205349p:plain


はてなブログのデザイン編集画面の「記事」をクリックして開いてスクロールして、

f:id:AQM:20210115202654p:plain

 

「記事下」欄のHTMLをクリック。

f:id:AQM:20210115202713p:plain

 

1〜2行目にペーストして設定を保存。

f:id:AQM:20210115202831p:plain

 

お、設置できた。

f:id:AQM:20210115202854p:plain

 

投げ銭のデザインをスッキリさせて、ボタンの文言もわかりやすく編集して、あとアドセンスと連続してガチャガチャした見た目になったのでアドセンスはどっか別の場所に移すことにした。

f:id:AQM:20210115205327p:plain

 

あと投げ銭の振込先になる口座情報の登録もいるんですけど、図解するほど難しくもないので割愛。

 

「特定商取引法に基づく表記」について

うちのブログ、サポート機能(投げ銭)だけで、有料記事などのコンテンツ販売や物販、サービス提供とかもしないので、「特定商取引法に基づく表記」要らないと思うんだけど、どうなんかな。

ちょっと週末に消費者庁のガイドを読み込もう。

www.no-trouble.caa.go.jp

読み込んだ結果次第で、もしかしたら追記や、「特定商取引法に基づく表記」を追加するかもしれません。

 

(追記)

アドセンスを適当なところに動かしたら数字が死んだので元の位置に戻して、投げ銭をサイドバーに移動。

f:id:AQM:20210116195013j:plain

 

じゃあ、おわりでーす。