仮想通貨をこねこね@あじむまおら

一社会人が相場分析したり、仮想通貨な疑問を調べてみたり。

NEMのNano Walletのスキンをいじる。

何番煎じになるかわかりませんが、NEMのNano Walletのスキンをいじってみましたので、どういじったかシェアしたいと思います。

まず、NEMのNano Walletは説明不要だと思いますが、取引所以外にXEMを保管する際に用いるウォレットのうち、PCで使用するVer.のことですね。(フルノードではないのでハーベストできない)ウォレットDL

Nano Walletを起動すると次のような画面になるのですが、この画面を好きにカスタマイズしようというのが今回の話(実際の諸先輩方は他の画面もゴリゴリといじってます)。plane.png

で、うちのNano Walletはこうしました。(肖像権めんどくさいので対応版)目隠しかぐや姫.png

写真のような変更を加えるには4つのステップが必要です。

  1. 背景画像の差し替え
  2. テキストの位置変更
  3. テキスト1行目の修正
  4. テキスト2行目の修正

1.背景画像の差し替え まず、差し替え後の背景画像を用意します。オリジナルの背景画像のサイズが1600×1067なので、目安にしてください。次に各自のNano Walletフォルダ(start.htmlが入っているやつ)内のimagesフォルダを開きます。そこにbackground.jpgが入っていますので、これを例えばold_background.jpgにでもリネームして退避させてください。そして、各自用意した画像をimagesフォルダに格納し、ファイル名をbackground.jpgに変更してください。

2.テキストの位置変更 今度はNano Walletフォルダ内のcssフォルダを開いて、nano.cssの内容を編集します。編集するためにはテキストエディタであれば何でもいいですが、こだわりがなければTera Padがいいんじゃないでしょうか。Tera Padでnano.cssを開いて、修正箇所は694行目。centerという記述をleftに書き換えます(2.3.4.共通ですが、ファイルはバックアップを取っておいてください)。とにかくcenterのままだとかぐや姫の目に文字がかかって見栄えが悪い。694

3.テキスト1行目の修正 テキスト記載内容の修正ですが、1行目と2行目で修正箇所が離れているので2ステップに分けました。編集するファイルはNano Walletフォルダ直下のmain.jsです。これもTera Padで開いてください。いじるのは99641行目。Nano Walletの記述をかぐや姫に書き換えます。99641.png

4.テキスト2行目の修正 最後は同じくmain.jsの106891行目。これを3.と同様に書き換えます。注意したいのが、この行のあたりはNano Walletにおけるデフォルト言語、つまり英語を選択したときの画面表示に関する箇所ということ。日本語選択時にもテキスト修正を反映させたい場合は107523行目も同じ書き換えを行ってください。(テキスト1行目は全言語共通の表示なので99641行目の書き換えのみで足ります)106891.png

以上、4ステップで冒頭のかぐや姫のような表示に修正できたかと思います。修正そのものが難しいというより、何行目に修正すべき箇所があるのか見つけるのが難しいという話ですね(CSSJava Scriptいじるスキルある方はすぐわかるのでしょうけど)。

乙姫Ver.も載せまして、本記事は終わりです。目隠し乙姫.png