以前に
“Google Play で手に入れよう”
のバッジの貼り方を書きましたが
今回はAppleのApp Store用の
バッジの貼りつけかたです。

App_Storeからダウンロード


Contents
  1. "App Storeからダウンロード" をダウンロード
  2. サイズや位置を調整

1."App Storeからダウンロード" をダウンロード


  1. Apple Link Maker にアクセスします。


  2. 「国または地域」は「日本」、「メディアタイプ」は「App」を選択します。

    App_Store_でダウンロード_1

  3. 検索バーにリンクを貼りたいアプリを入力し検索します。

    App_Store_でダウンロード_2

  4. 検索できると埋め込みコードが表示されるのでコピーしてバッジを設置したい位置に貼りつけます。

    App_Store_でダウンロード_3
    App_Store_でダウンロード_4

    サイズはデフォルトで "width:135px;height:40px" が指定されているので、変更したい場合はここの数字を変更します。
これで完成です。

2.サイズや位置を調整する

さっきコピーしたコードを
ブログに貼りつけました。

表示はされましたが
タテにならんで表示されています。

これをなんとか
きれいに横にならべたい。


App_Store_バッジ_1

ソースを見てみると
Google Play バッジのコードが
<div>タグでくくられていました。

これをはずすと

App_Store_バッジ_2

横ならびになりました。

でも、App Storeのバッジが
少し上にずれて表示されています。

このときは "margin-top:10px" を追加して
App Storeのバッジの位置を少し下げます。

HTML


   <a  href="https://apps.apple.com/jp/app/***" 
    style="***;width:135px;height:40px;margin-top:10px;"></a>

これで２つのバッジがきれいにならびました。

App_Store_バッジ_3