【Simplicity2】カエレバ・ヨメレバはデフォルトだと見栄えが悪い?ボタンを付けたい!

Amazonや楽天の商品を紹介するのに便利なツール「カエレバ」「ヨメレバ」を使っても、デフォルトではあまり見栄えが良くない。

このブログの使用テーマ「Simplicity2」(シンプリシティ2)で「カエレバ」「ヨメレバ」の見栄えが良くなるボタンカスタマイズの仕方を紹介する、と言うか紹介しているブログを紹介する。

カエレバ・ヨメレバ、デフォルトだと見栄えが悪い?

私がカエレバ・ヨメレバを使い始めたのはつい最近のことだ。私は文字通りブログを始めたばかりで元々PCも詳しいわけではなく、文字通り「ズブの素人」だ。

だから色々なツールの導入がめんどくさく、またイジくる自信もあまりないために、どうしても後手後手になってしまっていた。

しかし最近、重い腰を上げてとうとうカエレバ・ヨメレバを導入した。

カエレバ・ヨメレバのデフォルト

カエレバ・ヨメレバの導入自体はそれほど苦労しなかった。

だからそのこと自体はいいのだが、私が参考にしたページの「デフォルトだとこうなる」という画像と、私が実際にカエレバ・ヨメレバを使用したものの見栄えが明らかに違うのだ。

たぶんそのページは「カスタマイズ後」の画像を無作為に載せ、単細胞でテンパり易い私はそこに引っかかってしまったのだろう。

困惑して調べたが、どうやらデフォルトではそんなデザインらしい。

こんな感じだ。

上は「ヨメレバ」だが、「カエレバ」でも同じようなものだ。

ボタンカスタマイズ

そこで参考にしたページに教えられた通り、「Simplicity2」子テーマの「style.css」にカスタマイズ用cssコードを貼ってみると、とても見栄えが良くなった。

スマホでも見て確認してみたが、ボタンが縦に並ぶ以外はほとんど変わりはない。

このカスタマイズのメリット

このボタンカスタマイズのメリットは、

  1. 見栄えが良くなる。
  2. 他のカスタマイズだと「mobile.css」もいじる必要がある(場合もある)が、これだと「style.css」だけで良い。

注意点

注意点として、これはあくまで「Simplicity2」のカエレバ・ヨメレバのカスタマイズだということ(テーマが違うなら、別のページを参考にした方がいい)、また、このカスタマイズが成功しても、WordPressの投稿編集画面の「ビジュアル」だと見た目が変わらず、本画面や「プレビュー画面」で始めて見栄えが変わっている(ボタンが付く)ために、投稿編集画面の「ビジュアル」だけを見て「あれ?変わってないぞ?!」と慌てないようにして欲しい(私も一瞬慌てたので一応書いておく)。

参考にしたページ

ボタンカスタマイズで参考にしたのは「b204638」さんの「Re:ゼロから始めるサイト構築」というサイトの下のページだ。

Amazonや楽天市場などの商品を紹介するのに便利なブログパーツ「カエレバ」「ヨメレバ」をご存知でしょうか?使用すると簡単に、商品画像の入ったAmazonと楽天市場への両方のショッピングサイトへのリンクを作成することができます。つまり「カエ

最後に

このページはカエレバ・ヨメレバを初めて使う人が、私のように「デフォルトの画面を見て慌てないように」ということ(だけ)を目的に書いたものだ。

他の人は私ほど馬鹿ではないかもしれないが、このページを読んで安心する人が一人でもいれば幸いである。

フォローする