こんにちは、のっくん(@yamagablog)です。
ブログでアプリを紹介するのに使えるブログパーツを紹介したいと思います。
「アプリを紹介したいけど何か良いブログパーツない?」
と思っている方にオススメの記事です。
アプリを紹介する時にURLを貼っても良いのですが、それだと画像が含まれていませんし
記事を読んだ人はクリックするかも分かりません。
せっかくならアプリのアイコンやアプリ名を紹介したいですよね。
アプリーチを使うと以下のようなブログパーツを作成することができます。
写真なのでクリックはできませんが、実際にはAppStoreやGooglePlayへジャンプすることができます。
iPhoneやAndroidを使っているユーザ両方に紹介できるのも大きなメリットです。
さて、このブログパーツですが、WordPressで使用する場合には、CSSの設定が必要です。
(私はこの設定方法が分からず、最初は諦めました。)
CSSをきちんと設定できていないと、記事にブログパーツを掲載した時に、スタイルが崩れます。
スタイルが崩れると、アイコンが大きすぎたり、各パーツの幅が崩れたりします。
順番にCSSの設定方法を解説していきます。
コードをコピーする
まずはアプリーチのサイトに行ってコードをコピーしましょう。
コピーするコードは「こちらのCSS」と記載されているものです。
貼り付け先
WordPressにログイン後、
外観➡︎テーマ➡︎カスタマイズ➡︎追加CSS
で、先ほどコピーしたコードを貼り付けます。
これで準備完了です。
ブログパーツ作成
あとはアプリーチのサイトに記載の通りに、
- 紹介したいアプリ名を検索
- コードを生成してコピペ
- コピペしたコードをワードプレスの記事にテキストモードで貼り付ける
で完了です。
終わりに
最初「style.css」を直接編集してしまいました。
その結果、スタイルシートは反映されずプロポーションが崩れたまま。
ちゃんとテーマを選んでカスタマイズしないと駄目ってことに気づきました。
多分他のブログパーツでも同じだと思うので、CSSを追加する場合には気をつけましょう。