iPhone、Androidアプリの綺麗な紹介バナーを作るには？
いちいちCSSを編集する必要ある？
こんな疑問に答えていきます。
アプリの紹介って、綺麗にバナーが貼ってあった方がわかりやすいですよね。
しかしApple公式のバナーは、使いづらいんですよね。
Apple公式のiPhoneアプリのアフィリエイトは終了するようですが、まだURLを編集する需要はありますよね。
今回は、綺麗にブログにアプリのバナーを貼る方法を紹介していきます。
※記事内にプロモーションを含む場合があります
アプリーチを使う
アプリーチというサービスを使うのが手軽そうです。
サイトからコピペ
まず、こちらのサイトで、アプリのバナーを作成し、コードをコピペします。
http://mama-hack.com/app-reach/
CSSの編集
新バージョンと旧バージョンがあります。
新バージョンは自分のブログにCSSを書き加える必要があります。
（デザインの定義をスタイルシシートのファイルの中に、このアプリーチ専用の、線幅や色などの命令を書いてあげる作業）
こんな感じ
簡単にうまくいきました。
きれいですね。
文字の色の編集
自由に編集して良いとのことなので、ツールの文字部分は灰色にさせてもらいました。
同じ条件のブログなのに、片方では枠が表示されない
しかし、僕の１つのサイトではうまくいきましたが、もう１つでは何度やっても上手くいきません。
同じ条件なのに原因不明です。
強いて言えば、サーバーが違うことくらい…
仕方ないので旧バージョンを使いました。
旧バージョンに枠を追加したかったので、こちらのサイト様を参考にさせていただきました。
外枠を表示させるには生成されたコードの先頭に<fieldset>、末尾に</fieldset>（すべて半角）を追加します。
http://wp-lecture.com/pc/tool/387/より引用
これで完成。
iTunes Link Makerを使う
Apple公式のリンクメーカーですが、横幅を自由に作成できないのが致命的です。
デザインもなんか古い…
最後に、コードをいちいち自分でID入れて、改変するのもめんどいです。
https://linkmaker.itunes.apple.com/
WP-Appboxを使う
これはプラグインを使う方法です。
正サイトが重くなるのを防ぐためにプラグインは極力使わないようにしたので、やめました。
https://ja.wordpress.org/plugins/wp-appbox/
というわけで今回は以上です。
CSS編集は慣れると抵抗ありますが、アプリーチを使うのは時短でおすすめです。
ただし、ブログテーマをアップデートした時に、CSSが消えた場合、CSSを再度入れ直すのを忘れないようにしたいです。