こんにちは。はぴです。
『ブログでアプリを紹介したい』
『「AppleStore」と「GooglePlay」の両方のリンクを同時に貼りたいんだけど』
『簡単で、しかも綺麗に表示できる方法ないかなぁ』
っていう人この指とまれ～！
はい！ １週間前の私ですよ！
調べてみると、下のようなリンクを、とっても簡単に、無料で作れる【アプリーチ】というツールを提供してくれている方がおりました。
本当にありがとうございます！
まぁ～きれい。(*´ω｀)
では早速「アプリーチ」の使い方を、初心者なりにご説明いたしますよ！
（この記事は、はてなブログを使って書いています）
アプリーチの使い方
参考にさせていただきました。ありがとうございます！
ブログパーツを作成する
まず、アプリーチの公式サイトへ行きます。
下の方に少しスクロールすると、下のようなブログパーツ作成画面になりますので、
①検索窓で目的のアプリ名を入力
②〔検索〕をクリック
③目的のアプリか確認
と進んでいきます。
表示されたアプリが目的のものでなかった場合は、
②の〔検索〕を〔複数検索〕に切り変えて、③に出てきたアプリの中から目的のものを選んでください。
選択したら、下にスクロールします。
オレンジの枠線で囲ったところが選択できる 項目です。
他の方の記事を読むと、ほとんどそのままでOKみたいなんですが、
「開発元」は「非表示」にしている方が多いみたいです。
「target="_blank"の付与」では、クリックしたら別のタブで開くかどうかを選択できます。
私は、とりあえず今は全てそのまんまで作成しました。
(・∀・)そのうち、こうした方が良いとか分かってくるかな。
その下にいくと、アフィリエイトするときに使用する画面が出てきます。
今回私はアフィリエイトしないのでスルーしました。
コードをコピーしてブログに貼り付ける
さらに下の方へスクロールすると、コードが出てきます。
ここでは、「新コード」と「旧コード」が選択できます。
旧コードの貼り付け方
「旧コード」を選択した場合、コードをコピーしたら、そのままHTML編集画面に貼り付けるだけでリンクが作成されます。
簡単なのですが、枠はありません。
新コードの貼り付け方
枠を付けるには「新コード」を選択します。
①〔こちらのCSS〕をクリックして、サンプルのCSSをGETします。
②〔コピーする〕をクリック
③はてなブログを使用している方は、はてなブログの管理画面で、
〔 デザイン〕→〔カスタマイズ〕→〔｛｝デザインCSS 〕をクリック。
WordPressの場合は、
〔外観〕→〔カスタマイズ〕→〔追加CSS〕をクリックするとのことです。
④既に書かれてあるCSSの一番後ろの方に、コピーしたCSSを貼り付けると、枠がつきます。
「枠」のカスタマイズ
このままでもシンプルで良いのですが、CSSを変えると、枠のデザインが変えられるとのこと。
おお～(・∀・)☆
しかし、CSSをいじるのは私にはハードルが高いので、すでにカスタマイズ完了コピペOKの記事から頂きました。ありがとうございます！
私は、こちらの記事で１番目に紹介されているものをコピペさせてもらいました。
少し影が入るデザインです。
コピペだけでアプリの紹介リンクがカッコ良いものに。。ありがたや。
(*‘ω‘ *)
「自分でもCSS触れるよ」って方は自分好みにカスタマイズできるそうなしてみて下さい☆
終わりに
HTMLやCSSのことをほとんど知らない私でも、すごく簡単に見栄えよくアプリを貼り付けることが出来ました☆
しかもリンクは、アフィリエイトリンクに差し替えることも出来るみたいです。
そのうち挑戦してみたいなぁ。
ということで、ほぼ、先人の方々の恩恵にあずかって書いた記事ではありましたが、
「ブログで見栄えよくアプリを紹介したいな」という方の参考になればこれ幸い☆
(/・ω・)/
それではまた、お時間のあるときに～！