【簡単３分】ブログにアプリリンク(iOS＆Android)を張る方法

シングルマザーにも心のゆとりを！

こんにちは　”あずき”　です。

この記事を書いている人

◎子供の学費を稼ぎたい40代のシングルマザー。

◎WEBマーケターを目指して、日本トップクラスのマーケティング講座に在籍中。

◎業界未経験で０から勉強中。

◎目標は1年後に副業収入２０万円

私と同じように「稼ぎたい！」と思われているシングルマザーのお役に立てたら嬉しいです。

よろしければこちらもご確認ください。
プロフィール　と　コンセプト

こんな風に思ったことはありませんか？

◎ブログにアプリのリンクボタンを貼りたい

◎アフィリエイトでアプリを紹介したい

◎リンクボタンって面倒そう

本日は「アプリーチ」というWEBサイトを利用していき、このお悩みをたった３分の作業時間で解決いたします。

また初回だけ必要な作業もあるので、2回目からはわずか「1分」で完成させることが可能です。

アプリーチでは下の画像のようなボタンをとっても簡単に作ることが可能です。

YouTube

Google LLCposted withアプリーチ

この記事を読むと

◎アプリのリンクボタンが簡単に作れるようになる

◎アフィリエイトでもリンクボタンを簡単に作れるようになる

前提条件

◎WordPressテーマは「JIN」を使用しています

◎旧エディタ画面での操作方法となります

Contents

アプリーチとは
アプリリンクボタンを作る５step
アフィリエイトのリンクを張り付ける方法
最後に

アプリーチとは

アプリーチとはiPhoneやAndroidのアプリのリンクボタンを無料でしかも簡単に作れるサイトとなります。

アプリーチ公式サイト

アプリリンクボタンを作る５step

STEP1

アプリ名を入力します

検索画面にアプリ名を入力し「検索」をクリックします。

「検索」ボタンをクリックすると下の画像のように検索結果が表示されます。

また「複数検索」のボタンをクリックすると、類似するアプリが表示されます。
STEP2

表示内容を確認します

ここでは表示させるリンクボタンの内容をカスタマイズできます

◎表示リンク

iPhone、Androidどちらのリンクボタンを表示させるか、両方表示するか

◎タイトル

iPhone用、Android用どちらのタイトル名を表示させるか

「検索ワード」はstep1で検索窓に入力した内容が表示されます

◎アイコン画像

iPhone用、Android用どちらの画像を表示させるか

◎開発元

アプリの開発元を表示するかさせないか

◎価格

iPhone用、Android用どちらの価格を表示させるか、非表示にするか

◎target=”_blank”の付与

「あり」にするとリンクボタンをクリックした際に新しいタブで開きますので、「あり」を推奨します
STEP3

CSSコードを追加していきます

リンクボタンは「新コード」と「旧コード」があり、「新コード」はカスタマイズが可能、「旧コード」はカスタマイズ不可となっています。

先ずは「新コード」をご紹介します。

「こちらのCSS」をクリックしましょう

「新コードとサンプルCSS」のポップアップ画面が表示されますので、「コピーする」をクリックします
STEP4

WordPressの追加CSSへ貼り付ける

WordPressの画面を開きダッシュボードの「外観」→「カスタマイズ」を選択します

下の方の「追加CSS」をクリックします

STEP3でコピーしたCSSコードを貼り付け、「公開」ボタンをクリックします

追加CSSの中に既に別のコードが入力されている場合は、そのコードの下に１～2行スペースを空けて貼り付けましょう。

既に入力してあるコードの上から上書きしないように気を付けてください。

追加CSSの貼付け作業は初回の時だけの作業となります。次回の作成時からこの作業は不要となります。

きなこ

楽ちんになるね！
STEP5

「新コード」を投稿画面へ貼り付けます

「アプリンク」のサイトへ戻り「新コード」を選択し「コピーする」ボタンをクリックします

投稿画面のテキストエディタを開き、リンクボタンを挿入したい箇所に貼り付けします

ビジュアル画面にすると、下の画像のように表示されます

スマホでの表示もキレイにされますね。

「旧コード」を使用する場合はSTEP３とSTEP４の追加CSSの貼付けは不要です。

旧コードをコピーしたら投稿画面の任意の箇所に貼り付けるだけで完成です。