Contents
【iPhone】【Android】アプリのリンク方法
こんにちは。フミです。
先日投稿した「【モブログ】外でブログを書いてみる」という記事を執筆する際に、「アプリのリンクってどうやって張るんだろう？」と思いました。
↑こういうの。
調べた結果、とあるサイトを利用すれば簡単に張ることができたので、そのサイトと方法を紹介します。
アプリ―チを使用して簡単にアプリのリンクを張ろう！
アプリ―チとは
サイトの紹介には「iPhone,Androidアプリを紹介するブログパーツを瞬時に作成することができるツールです。」と書いてありました。
少し補足すると、このサイトでアプリを検索するとiPhoneアプリもAndroidアプリも自動で検索してくれて、それぞれのリンクをhtml形式で出力してくれるのでそれをブログに張り付けるだけでよく見るリンクが表示されるようになります。
アプリの使い方を見ていきましょう。
アプリ―チでできること
前回紹介したWord Pressアプリを例に紹介します。
デフォルトだと、アプリのアイコン画像、タイトルや開発元、そしてApp StoreとGoogle Playへのリンクを表示することができます。
開発元の表示、非表示を切り替えたり
価格の表示、非表示を切り替えたり
など、細かい点ですが色々と表示を切り替えることができます。
実際に使ってみよう
サイトはシンプルなので、直感的に使用できるかと思います。
まずはリンクを張りたいアプリを検索しましょう。
検索すると検索ボタンの下にiPhoneアプリとAndroidアプリのサンプルが表示されます。
因みに複数検索は、あいまい検索のようなもので検索ワードに近いアプリがいくつか検索されます。
次に表示・非表示の設定をしましょう。
特に気にしない場合は飛ばしても構いません。
次にアフィリエイトや紹介コードがある場合はこちらで設定しましょう。
僕はまだアフィリエイトをやっていないので未設定です。
最後にhtmlのコードが出力されるので、コピーしてブログに張り付ければOKです。
うまく表示されない場合
僕の場合、このまま張り付けても下のようにバランスがおかしくなることがありました。
こうなった場合、
・imgタグに「width=”サイズ”」を挿入※このブログではサイズ：150にしています
・アイコンのタグに「alignleft」を挿入
すればOKです。
具体的には
<div class=”appreach”>
<img class=”appreach__icon” src=”https://is1-ssl.mzstatic.com/image/thumb/Purple118/v4/64/91/6b/64916bb2-ade0-2ee8-b635-8e77e3800ee7/source/512x512bb.jpg” alt=”Word Press” />
<div class=”appreach__detail”>
<p class=”appreach__name”>Word Press</p>
<p class=”appreach__info”><span class=”appreach__developper”>Automattic</span><span class=”appreach__posted”>posted with<a title=”アプリーチ” href=”http://mama-hack.com/app-reach/” target=”_blank” rel=”nofollow”>アプリーチ</a></span></p>
</div>
<div class=”appreach__links”><a class=”appreach__aslink” href=”https://itunes.apple.com/jp/app/wordpress/id335703880?mt=8&uo=4″ target=”_blank” rel=”nofollow”><img src=”https://nabettu.github.io/appreach/img/itune_ja.svg” /></a><a class=”appreach__gplink” href=”https://play.google.com/store/apps/details?id=org.wordpress.android” target=”_blank” rel=”nofollow”><img src=”https://nabettu.github.io/appreach/img/gplay_ja.png” /></a></div>
</div>
↓↓↓↓↓
<div class=”appreach”><img class=”appreach__icon alignleft” src=”https://is1-ssl.mzstatic.com/image/thumb/Purple118/v4/64/91/6b/64916bb2-ade0-2ee8-b635-8e77e3800ee7/source/512x512bb.jpg” alt=”Word Press” width=”150″ />
<div class=”appreach__detail”>
<p class=”appreach__name”>Word Press</p>
<p class=”appreach__info”><span class=”appreach__developper”>Automattic</span><span class=”appreach__posted”>posted with<a title=”アプリーチ” href=”http://mama-hack.com/app-reach/” target=”_blank” rel=”nofollow”>アプリーチ</a></span></p>
</div>
<div class=”appreach__links”><a class=”appreach__aslink” href=”https://itunes.apple.com/jp/app/wordpress/id335703880?mt=8&uo=4″ target=”_blank” rel=”nofollow”><img src=”https://nabettu.github.io/appreach/img/itune_ja.svg” width=”150″ /></a><a class=”appreach__gplink” href=”https://play.google.com/store/apps/details?id=org.wordpress.android” target=”_blank” rel=”nofollow”><img src=”https://nabettu.github.io/appreach/img/gplay_ja.png” width=”150″ /></a></div>
</div>
と編集すれば、下記のようにバランスの取れた表示になります。
使用上の注意事項
利用規約に「本サービスは外部APIに依存しているため、外部APIの終了に伴ってサービスを終了する可能性があります。」と書いてありました。
なので、アプリの公開が終了した場合や、GooglePlayなどのダウンロードサイトが閉鎖(まずないと思いますが)場合はリンクが切れたり、表示がおかしくなったりすることがありそうです。
まとめ
アプリ―チを使用すればアプリのリンクは非常に簡単に張ることができます。
アフィリエイトなどをしている人は積極的に使用するとよさそうです。
