[iPhone]アプリのダウンロードボタンをつけてみた!
Icons! (161 / 365) Photo by somegeekintn
なんか最近皆さんの記事にあるアプリのダウンロードボタンが大きくなっている?
というわけで僕も作ってみたくなったのでAppHTMLをカスタマイズしてつけてみることにしました!
もう皆さんブログで紹介されている方がたくさんいるとは思いますが自分用で作り方を載せておくことにします!
参考にしたブログ
delaymaniaさんを参考にして作ってみました。
アプリをダウンロードするボタンが付くようにAppHTMLをカスタマイズしました | delaymania
ダウンロードボタンを作る
まずはボタンを作ってみた。既にあるボタンを頂いてもいいけど「ボタン素材 自動生成サイト」という便利なサイトがあったので自作してみた。
ボタン素材 自動生成サイト – ButtonMakerアフラット
上のサイトで作ったボタンがこちら
ブログにあわせてと思ったけどブラックでいいかな!
このサイトでは、フォントもいろいろ変えることが可能だし、カドを丸くしたりすることもできますね!
出来上がったボタンを保存します。
ボタン画像をアップロード
出来上がったボタン画像をWordPressのメディアのアップロードでアップロードします。
そしてボタン画像のURLをコピーします
delaymaniaさんのソースをコピーして
ソースは改行をとりましょう。そのままだとうまくいかなかった!
Bookmarklet生成!
Bookmarkletリンク集のAppHTMLへ
AppHTMLの中のカスタマイズするときに入れる欄に先ほどソースをいれます。このとき上のテンプレートは選択しないでおきます。
ペーストしたソース内のURLを先ほどアップロードしたものに変更してブックマークレットを生成してできあがり!ブラウザー上にブックマークしたりiPhone上でブックマークしましょう!
完成!
出来上がったのがこれです!
ダウンロードがわかりやすくなったね!
さいごに
ブログでアプリ紹介をするのはいいんだけど、初心者はダウンロードボタンを探してしまうとかダウンロードする方法がわからないということを知りました。これでわかりやすくなるかな?それとクリック数が増える効果もあるのだとか。これはやってみる価値ありですね!
クリック数がこれだけ上がる! アプリダウンロードボタン設置前と設置後を比較 | NANOKAMO BLOG
ボタンは既にあるボタンを頂いてもな〜と思ったので文字をちょっと変えて自作してみました。ボタン作成のページがなかなか良かった!カスタマイズするときに使えるかな?
ところでMac上に作ったのでiPhone上でもと思ったらうまくいかない。Mac上で作ったのをiPhoneに流そうかな。
皆さんも自分のボタンを作ってみてはいかがでしょうか!tatoでした!