Google Playへのバッジ(リンクバッジ)とは上にあるような、Google PlayにリンクするGoogle公式のボタンのことです。通常のテキストリンクより、カッコよくて、これを使うと記事自体の信頼性が上がるような気がしませんか。ここではこのバッジをWordPressで作ったブログ記事への貼り方を解説していきます。とても簡単ですので、トライしてみて下さい。また、最後のまとめの章では、Apple Storeへのリンクバッジの貼り方説明の記事へのリンクもありますので、合わせて参照してくださいね。
バッジの貼り方
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
まずは上のリンクからGoogle Playのアプリのサイトに移ろう。
![](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_06-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
検索窓①に目的のアプリの名前を入れて、アプリを検索しよう。ここでは例としてグーグルマップを使っているよ。検索結果として、目的のアプリ②が表示されたら、クリックしよう。
![](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_07-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
目的のアプリのページのURL(矢印の部分)をコピーしよう。
![](https://storage.googleapis.com/pe-portal-consumer-prod-wagtail-static/images/og_image.png?X-Goog-Algorithm=GOOG4-RSA-SHA256&X-Goog-Credential=wagtail%40pe-portal-consumer-prod.iam.gserviceaccount.com%2F20240630%2Fauto%2Fstorage%2Fgoog4_request&X-Goog-Date=20240630T103806Z&X-Goog-Expires=86400&X-Goog-SignedHeaders=host&X-Goog-Signature=636f1c77a9179ea3997c05a56b5d2dc1c902fca9d00526b9f836426de0f9dd5721308f0d65f390fe705fe2437e32ec910cfae50930b5872f4c4529a38f5c9d9943bece49d21ae718fd3016a441fdbe0320b91012e75a1b1a357316fb85c1a7925ecd51ab6273c9548359bbb3ff3b62a0b5de387e83cc5e25a76ae7c847e762e52ed351179c9ff92ede7b4092f66ca34ba9b11c314e7ff049e4547bce13f7f223cdb24f0b54f6b7be78fc4d6f9e7c39b729a893ef442e866012fdbac48798e5a0664db9e33a14afac37d9bc211644e50006cbe36c3bb6894230b148447f3588418a63b500c9a59ebff976ac487349a61b36038491279d05443e6b5cf017d071c4)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
次に、上のリンクからGoogleのバッジを取得するサイトに移るよ。
![Google_Play_04](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_04-1-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
リンク後、上のスクショのサイトに移るので、スクロールして下に移ろう。
![Google_Play_08](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_08-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
Google PlayのサイトでコピーしたURLを「Play ストア URL」①へペーストして、②が「日本語」になっていることを確認して、③のコードをコピーしよう。
![Google_Play_09](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_09-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
最後にWordPressのバッジを貼りたい記事の投稿ページに移って、①のボタンをクリックして、プルダウンメニューからコードエディター②をクリックしよう。
![Google_Play_10](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_10-1024x640.jpg)
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
そして、①の部分にバッジのサイトからコピーしたコードをペーストして、「下書きとして保存」②をクリックし、「プレビュー」③をクリックして表示画面を見てみよう。
![Google_Play_11](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_11-1-1024x640.jpg)
![みさきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/4e0d748e99c40a0e20064264fd95caae-1.jpg)
ちゃんと貼れているけど、大きすぎるよ。
![みゆきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/miyukimedaka_normal_fukidashi.jpg)
そうだね。確かにブログで使うには大きすぎるね。だけど心配無用だよ。下のスクショにあるように、アンカーの閉じタグ”</a>"の前に、幅 width、高さ heightをピクセル単位で指定すれば(例:width="150" height="45")大きさは自由に調整できるよ。
![Google_Play_12](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play_12-1024x640.jpg)
![Google_Play-13](https://miyukimedaka.com/wp-content/uploads/2019/06/Google_Play-13-1024x640.jpg)
![みさきメダカ](https://miyukimedaka.com/wp-content/uploads/2019/04/misakimedaka-1.jpg)
ほんとだね。サイズを変更できるね。記事に合わせて、数字を変えてサイズを調整して見てね。
まとめ
いかがでしたでしょうか。思ったより簡単だったのではと思います。表示サイズの変更に一部のコードの追記が必要ですが、これはこれで、HTML、CSS勉強への第一歩にするのも一考かと思います。
また、別記事で"App Store"へのリンクバッチの貼り方も解説していますので、良かったら下のリンクから覗いていって見てくださいね。
それでは、最後までお付き合いありがとうございました。さようなら。
コメント