パソコン版のグラブルの右側にあるチャット欄、あれの背景を変えてみたよ!

2017年9月14日グラブル,ゲーム,技術

この記事は2017年3月15日に書かれたものです。ご注意ください。

うあぁ~、いらっしゃぁぁぁぃ!!
ようこそ~、ジャパリカフェへぇ!
どうぞどうぞぉ、ゆっくりしてってぇ~!いや待ってたよぉ~、やっとお客さんが来てくれたよぉ~、うれしぃな!ねぇなに飲む?いろいろあるよー、これね、紅茶って言うんだって!博士に教えて貰ったの!!ここからお湯出るからそれを使ってねぇ!!

あのぉ。
ボク達、グラブルのチャット枠の背景を変えられるところ探してて…。

お客さんじゃないのかぁ… ペェッ!!!

茶番は置いといて本題へ

まず初めに必要なものを用意します。
パソコンのWeb版 グラブルしか対応してないからな!!URLは「http://game.granbluefantasy.jp」だぞ、ブクマしておけよ。そういやグラブルってSSL通信じゃないよね。SSL通信にしてもプロキシで改ざんする方法はあるみたいだし「SSL通信=絶対」とも言えないのか。
※アプリ版やユーザーエージェント偽装してのモバイル版は勝手にやってくれ!(というかアプリ版は弄れないか?)

必要なもの

◇Chrome

インストールしてください。ぶっちゃけChromium系ブラウザならなんでもいいです。ただしKinzaなど一部は音声・BGMが流れないので注意して下さい。私的にオススメなのは「Chrome Canary」「SRWare Iron」あたり。あとは「Coowon」とか?

◇Stylist

Chromeで以下のリンクへ進み、Chromeへ追加してください。
https://chrome.google.com/webstore/detail/stylist/pabfempgigicdjjlccdgnbmeggkbjdhd

◇サーバ

画像をアップロードする必要性がありますので、各自サーバを用意して下さい。これは画像を「http://example.com/image.jpg」のようにリンク化させる必要性があるためです。
用意できねーよ!!って人は、オンラインストレージサービスをつかうとええで。Cloudupっていうのが個人的オススメ。

https://cloudup.com

やりかた

まず初めにChromeを起動します。
URLに「chrome://extensions/」と記入して、アクセスすると「Stylist」というのがあります。これのオプションをクリック。
「Styles」タブを選択して、「Add New Style」ボタンをクリック。一番の上の名称は適当に【グラブル】と入れ、プルダウンを【domain】にし、その横に【game.granbluefantasy.jp】と記載。
そしてStylesheet Textに

#general-chat #chat-body,
#submenu-general-chat #chat-body {
    background:#000 url('https://cldup.com/mAtCS2eFMH.jpg') no-repeat !important;
    background-size:100% auto !important;
}

を入れます。もし表示されないときは「#000」を削除すると良いかも?(5月3日更新)
入れたら「Save」ボタンをクリックすることで… こんなかんじになります!

感が良い人なら分かると思いますが、背景の画像は「https://cldup.com/mAtCS2eFMH.jpg」です。つまり、これを自分の持っているサーバのリンクに書き換えちゃえば、自由に背景が設定できます。
サーバーもってねえよ!!って人のためにあるのが「Cloudup」。ここへ画像をあげて、ダイレクトリンクをコピーすると【https://cldup.com/***.jpg】といったURLが生成できます(上のとおなじだね)。
これの使い方は…なんとなくでいけるっしょ?リンクの取得は右上からできるよ。
あとは楽しむだけ!

わーい、たのしー!