ブログにAndroid・iPhoneアプリのリンクを貼り付ける方法 | まるっとふくち
PR

ブログにAndroid・iPhoneアプリのリンクを貼り付ける方法

スポンサーリンク
アイコン付きのアプリリンクを作る方法Cocoon

この記事のリンクにはプロモーション(広告)が含まれています。感想・レビューなどは誇張せずに正直に書いております。

こまるちゃん
こまるちゃん

サイトでよく見かけるアプリのリンクってどうやって作ってるのかな?

ふくち
ふくち

実はめちゃくちゃ簡単!覚えれば1分で作成可能だよ♪

アプリの紹介記事などで当たり前のように目にするこのようなダウンロードリンク

アイビスペイントX

アイビスペイントX

ibis inc.posted withアプリーチ

見ている側としては当たり前すぎて素通りしてしまいますが、いざ自分のサイトで何らかのアプリを紹介しようとしたときに…

ふくち
ふくち

どうやってやってるんだ?!

と気になった人も多いのでは。

この記事を見ていただいたのは大正解です◎

方法から実際の手順まで、引っかかりやすいポイントを含め解説していきます♪

スポンサーリンク

アプリのダウンロードリンクをロゴ入りのリンクにするには

女性とクエスチョンマーク

そもそもどうやってこのようなリンクを作成するのか…

webデザインに精通している人なら自分でチョチョイのちょい!かもしれません。

webデザイナー
webデザイナー

まずはダウンロードページのリンクをコピーして貼り付けてCSSで整えて$%&$&$%’$##$$&&%’&%’%E’E’E(爆)

ふくち
ふくち

いやいやいやちょっとまてーーーーーい!!!

考えただけで恐ろしい。調べるだけでもかなりの時間がかかってしまいます。

そんな時に誰でもかんたんに、あっという間にリンクが作れちゃうのが「アプリーチ」というブログパーツの作成ツールです!

リンクを作るだけなら面倒な登録なども一切不要。

もちろん無料で利用することができますよ!

\さっそくリンクを作成してみる/

アプリーチでリンクを作成する方法

How toという文字と眼鏡をかけた先生風の女性

以下がリンク作成の手順です。

  • アプリーチで該当のアプリを検索
  • 出力イメージの確認と調整
  • アフィリエイトがある場合は、アフィリエイトのURLを入力
  • HTMLをコピー
  • コピーしたものをサイトに貼り付ける

さっそく手順に入りたいところですが、実は

アプリでもアフィリエイト報酬を得られる場合があります!

ふくち
ふくち

基本的にはゲームや占いなどの案件が多いのでアプリなら何でもある!というわけではありませんが、一度ASPで検索してみる価値はあると思います!

アプリ案件が豊富なASPは以下の2つ「Smart-C」と「afbです。

特にSmart-Cはほぼアプリに特化したASPで、案件数も豊富です。

登録は承認制で審査には2、3日かかるため、まずはやる気のある時に登録だけでもしておくと良いですよ!

ふくち
ふくち

下のリンクから登録できるよ!

カンファレンスバナー

また、案件数はあまり多くありませんが審査不要な「A8.net」も初心者から使いやすくおすすめです。

おそらくアフィリエイトをやっている方であれば登録してあると思いますが、検索窓に「アプリ」というキーワードで引っ掛けてみると意外と案件が出てきますよ!

アプリーチのサイト内では「Zacks」というASPも紹介されていますが、現状新規ユーザーへのアプリ案件の紹介はしていないようです。

ふくち
ふくち

それでは実際の操作方法に入っていきましょう!

アプリーチで該当のアプリを検索

「アイビスペイント」というイラストアプリを例にとって手順を見ていきます!

アプリーチのサイトを開き、検索画面にキーワードを入力します。

≫アプリーチ(別のウインドウで開きます)

アプリーチでキーワード検索をしている画面
引用元:アプリーチ

正しいアプリが表示されているか確認しましょう!

アプリーチ ブログパーツ作成画面

引用元:アプリーチ
ふくち
ふくち

探したいアプリが見つからない場合は、「検索」ではなく「複数検索」も利用して見ましょう。

出力イメージの確認と調整

サイトを見ている人にどのように見えるかを確認し、表示の微調整を行います。

ふくち
ふくち

タイトルやアイコン画像はAndroid版とiPhone版で表示が異なるので、切り替えて見比べてみると良いですよ!

出力イメージの確認・カスタマイズ画面

引用元:アプリーチ
各項目の説明
  • 表示リンク:黒いダウンロードボタンの表示設定
  • タイトル:アプリのタイトル部分の表示設定 iPhoneとAndroidで異なる場合あり
  • アイコン画像:左側のアイコン画像の表示設定 iPhoneとAndroidで異なる場合あり
  • 開発元:アプリの開発元
  • 価格:アプリの価格
  • target=”_blank”の付与:リンクを同じページで開くか、新しいウィンドウで開くか
                ありの場合は新しいウィンドウで開く

設定は自分の好みで良いですが、わたしは大体以下の通りです。

  • 表示リンク:両方
  • タイトル:iPhone
  • アイコン画像:iPhone
  • 開発元:表示
  • 価格:非表示
  • target=”_blank”の付与:あり

アフィリエイトがある場合は、アフィリエイトのURLを入力

リンクを貼りたいアプリにアフィリエイトがある場合は、ASPのサイトからコピーしたURLを赤枠の箇所に貼り付けます。

アフィリエイトURL貼り付け箇所

※PHGコードはアップルのアフィリエイトなのでほとんど使うことはありません

機種ごとにURLが分かれている場合はそれぞれ別のものを、同じ場合は同じURLを両方に貼り付けます。

HTMLをコピー

生成されたHTMLをコピーします。

ふくち
ふくち

「新コード」と「旧コード」のタブがありますが、

  • 見た目をカスタマイズしたい場合は新コード
  • 簡単に使いたい場合は旧コード

を選択しましょう!

アプリーチ URLのコピー画面

引用元:アプリーチ

コピーするボタンからうまくコピーができない場合は、全て選択してマウスの右クリックからコピーか、Ctrl(Macは⌘)+Cでコピーしましょう。

旧コードを使用すると、プレビューした時に下記のように枠がなかったり、横に広っがったりと見た目が崩れてしまうケースがあります。その場合は「新コード」を使用しましょう。

新コード使用の場合の追加手順(※旧コードでOKの場合は不要です!)

①下記画面の「こちらのCSS」リンクをクリック

アプリーチ コードコピー画面

引用元:アプリーチ

②表示されたCSSを全てコピーします。
 ※かなり長いので一番下までもれなくコピーしましょう。

アプリーチ 新コード用のCSSコピーしている画面

引用元:アプリーチ

③Wordpressのダッシュボードの画面で、外観→カスタマイズをクリック

Wordpressダッシュボードで外観→カスタマイズをクリック

引用元:アプリーチ

④CSSをクリック

Wordpressのカスタマイズ画面で追加CSSをクリック

⑤先ほどコピーしたものを貼り付け、公開をクリック

追加CSSにコピペしたコードを貼り付け

WordPressの画面上で見ると下記のように画像が大きく縦並びで見える場合がありますが、プレビュー画面でキレイに見えれいれば問題ありません。

新コードのWordpress上の表示

新コードでさらに見た目をカスタマイズしたい!という場合、下記のサイトで詳しく紹介されていましたので見てみてください。

コピーしたものをサイトに貼り付ける

最後にコピーしたコードをサイトで貼り付ければ完成です。

ここでは、Wordpressのブロックエディタでの貼り付け方法を解説します。

まずはブロックエディタの検索窓に「html」と入力

検索結果からカスタムHTMLをクリック

ブロックエディタの検索画面

先ほどコピーしたコードを貼り付けます。

html貼り付け画面

プレビューして以下のように表示されればOKです。

アイビスペイントX

アイビスペイントX

ibis inc.posted withアプリーチ

ふくち
ふくち

とっても簡単でしたね!慣れてしまえば1分くらいでリンクが作れます

アプリのリンクをアイコン画像入りにすることのメリット

メリット

アイコン画像のあるリンクと文字のみのリンクでは、見た目の「信頼度」が異なります。

ふくち
ふくち

アイコン画像があるとぱっと見でなんのアプリかわかりますし、ダウンロードボタンもGoogleストアやAppleストアで見慣れたものなので安心しますよね!

また、ただの文字やボタンリンクよりも目に留まりやすいのも利点です!

通常人は必要のある部分以外は読み飛ばす傾向にありますが、ビジュアルがあると手を止めてくれる可能性が高くなります!

アプリのアイコン画像入りリンクを貼り付ける方法

まとめ

本日はウェブサイトやブログなどに、アプリのアイコン画像入りのリンクを貼り付ける方法をお教えしました!

もう一度流れをおさらいします。

  • アプリーチにアクセス  ※ブクマ推奨
  • アプリーチで該当のアプリを検索
  • 出力イメージの確認と調整
  • アフィリエイトがある場合は、アフィリエイトのURLを入力
  • HTMLをコピー
  • コピーしたものをサイトに貼り付ける
ふくち
ふくち

初心者でも承認されやすい(A8は審査なし)アプリ案件の充実したASPは下記の通り

  • Smart-C  アプリ特化型のASPでは最大手
  • afb(アフィb)  アプリ案件の他、セルフバックも充実。
  • A8.net   最大のASP。審査がないため即日利用可能。

どんどん活用して見てくださいね!

コメント

タイトルとURLをコピーしました