【10秒でできる】ブログでアプリリンク(iOS&Android)を貼る方法

ブログでiOS&Androidのアプリリンクを貼る方法

こういった方向け
  • iOSとAndroidのアプリリンクを作りたい
  • 面倒な作業をせずに、簡単に作りたい

ゆうが

こういった疑問に答えます!

完成イメージ

アプリーチ

今回は上記のような、アプリリンクを作る方法を紹介していきます。アプリリンクは視覚的にもわかりやすいので、テキストリンクで表示するよりも圧倒的にクリック率が上がりますよ。

それでは、さっそくいきましょう!

スポンサーリンク

アプリリンクとは?

アプリリンクを説明すると、先程の完成イメージのように「アプリ画像・App StoreやGoogle Playのダウンロードリンク」がキレイに並んでいるリンクカードのことです。

アプリリンクとは?

普通のテキストリンクで表示するよりも、視覚的にわかりやすいためクリック率も高いのが特徴です。

ブログでiOS&Androidのアプリリンクを貼る方法

アプリーチ

結論は、アプリーチというサイトでアプリリンクを作成することでブログに貼ることができます。

アプリーチとは、iOSとAndroidのアプリリンクが簡単に作れるサイトで多くのブロガーさん達に愛用されています。

アプリーチ

自分が紹介したいアプリを検索して、HTMLを貼れば一瞬でアプリリンクが作れるという便利すぎなサイトです。またアフィリエイトリンクを引っ張れば収益も得ることができて、かなり最強なサイトです。

それでは、アプリーチの使い方を図解を用いて解説していきます。

スポンサーリンク

アプリーチの使い方

アプリーチでアプリリンクを作成するには、下記の3STEPでできます。

  1. パーツ作成
  2. デザイン用コードの貼り付け
  3. アプリリンクのコードの貼り付け

STEP1:パーツ作成

アプリーチへアクセスして、パーツを作っていきます。

1. パーツ作成

まずは自分がブログに貼りたいアプリを検索してください。

たとえば「instagram」のアイコンを作りたい場合はそのまま「instagram」と入力してください。

そして、下にスクロースすると「出力イメージを確認しましょう」とでてくるので、下記の画像のように設定をしてください。

アプリーチ

STEP2:デザイン用コードの貼り付け

つづいて、アプリリンクのデザインのコードを貼り付けていきます。

デザイン用コードの貼り付け

下の方にスクロールすると「こちらのCSS」とあるのでクリックして、コードを表示させてコピーしてください。

デザイン用コードの貼り付け

画像のように、CSSがでてくるのでこちらをコピーしてください。

デザイン用コードの貼り付け

そしたらつぎに、WordPressへいき「外観→カスタマイズ」を選択して、追加CSSに先程のコードを貼り付けます。

これでアプリリンクのデザインは完了です。

STEP3:アプリリンクのコードの貼り付け

では最後にブログにアプリリンクのコードを貼っていきます。

アプリリンクのコードの貼り付け

アプリーチに戻って、下にある「新コード」をコピーしてください。

そしたらWordPressの投稿画面にいき、コピーしたコードをアプリリンクを表示したいところに貼ってください。

お疲れさまでした!これにて、アプリリンクの実装が完了しました!

もっと貼りたい場合は、「アプリの検索⇨新コードのコピー⇨WordPressに貼り付け」を繰り返せばOKです。マジで10秒でできますよ。

それでは、今回は以上です。
最後まで見てくださり、ありがとうございました。

参考になるかもしれない記事

「ShareHtmlを、もっと綺麗にしたメーカー」を使ってブログカードを作ろうShareHtmlを、もっと綺麗にしたメーカーを使ってブログカードを作ろう 【検証済み】見やすい!引用ボックスのデザイン3選【コピペでできる】見やすい!引用ボックスのデザイン3選【検証済み】