自身のWebサイトやブログでiPhone・Androidのアプリを紹介する際にどうやって載せるか悩んだことありませんか？
今回はアプリを紹介するためのブログパーツを簡単に作成できるアプリーチというツールの設定・使い方を解説します。
アプリーチとは？
アプリーチとはWebサイトやブログでiPhone・Androidのアプリを紹介するリンクを簡単に作成することができます。通常のテキストリンクのように、Apple StoreとGoogle Playのアプリの詳細ページのURLをコピーしてテキストにリンクを貼ることでも紹介できますが、アプリのアイコン画像やストアのダウンロードアイコンなどが表示されている方がユーザーの興味を引くことができると思います。
アフィリエイトのリンクを作れる
特的のアフィリエイトASPを経由して、アプリを紹介することで紹介料を得ることができます。
同じアプリでもASPによって紹介料が変わってきます。管理画面でそれぞれ検索して紹介料の高いASPを利用すると良いです。
まだ登録していない方は以下のリンクから新規登録を行い、審査後にアプリの紹介案件を検索しましょう。その後、発行出来たURLをアプリーチでリンクの差し替えを行ってブログで紹介できます。
アプリーチの使い方
アプリの検索
紹介したいアプリ名を入力して検索します。検索にヒットすると、ボタン下のiPhoneアプリ検索結果、Andoroidアプリ検索結果に該当アプリがプレビュー表示されます。
複数検索のボタンをクリックすると、入力したキーワードにヒットするアプリが全て表示されます。
表示形式のカスタマイズ
ブログパーツで表示させる表示形式をカスタマイズすることができます。
【表示リンク】
アプリダウンロードリンクを両方、iPhoneのみ、Andoroidのみから選択できます。
【タイトル】
タイトルをiPhone、Andoroid、検索ワードから選択できます。
【アイコン画像】
アプリアイコンをiPhone、Andoroidで選択できます。
【開発元】
アプリの開発元の表示の有無を選択できます。
【価格】
アプリの価格をiPhone、Andoroid、表示しないから選択できます。
【target="_blank"の付与】
ブログパーツを新しいタブで開くかの設定ができます。ありにすると新しいたぶで開きます。
アフィリエイト設定
アフィリエイトASPに紹介したいと思っていたアプリのプログラムがあった場合は、ASPから任意のURLをコピーして、アプリーチに貼ることでアプリーチで作成したブログパーツの表示形式を変えずに、リンク先を任意のリンク先に変更することができます。
ソースコードの生成
あとはソースコードをコピーして、貼り付けるだけでブログパーツを表示させることができます。注意としては、新コードの場合は、CSSの記述を追加する必要があります。
.appreach {
text-align: left;
padding: 10px;
border: 1px solid #7C7C7C;
overflow: hidden;
}
.appreach:after {
content: "";
display: block;
clear: both;
}
.appreach p {
margin: 0;
}
.appreach a:after {
display: none;
}
.appreach__icon {
float: left;
border-radius: 10%;
overflow: hidden;
margin: 0 3% 0 0 !important;
width: 25% !important;
height: auto !important;
max-width: 120px !important;
}
.appreach__detail {
display: inline-block;
font-size: 20px;
line-height: 1.5;
width: 72%;
max-width: 72%;
}
.appreach__detail:after {
content: "";
display: block;
clear: both;
}
.appreach__name {
font-size: 16px;
line-height: 1.5em !important;
max-height: 3em;
overflow: hidden;
}
.appreach__info {
font-size: 12px !important;
}
.appreach__developper, .appreach__price {
margin-right: 0.5em;
}
.appreach__posted a {
margin-left: 0.5em;
}
.appreach__links {
float: left;
height: 40px;
margin-top: 8px;
white-space: nowrap;
}
.appreach__aslink img {
margin-right: 10px;
height: 40px;
width: 135px;
}
.appreach__gplink img {
height: 40px;
width: 134.5px;
}
.appreach__star {
position: relative;
font-size: 14px !important;
height: 1.5em;
width: 5em;
}
.appreach__star__base {
position: absolute;
color: #737373;
}
.appreach__star__evaluate {
position: absolute;
color: #ffc107;
overflow: hidden;
white-space: nowrap;
}