みなさんこんにちはコイトです。
ブログをやっている人をやっている方で、ヨメレバ・カエレバを使っている人も多いと思います。
カスタマイズできることを知っていましたか？
私は知りませんでした(笑)
ただ、やってみると結構簡単で、多くの方がデザインを提供してくれていることがわかり、今回記事にしてみました。
読者の悩み
・カエレバ・ヨメレバのデザインを変えたい
・初心者でも分かりやすく変える方法を教えてほしい
こんな方はぜひこの記事を読んでいってください。
Contents
カエレバ・ヨメレバをカスタマイズしたらこんなデザインになります
カスタマイズをした後にはこんなデザインになります。
このように楽天、アマゾンなどのリンクが大きくなるのでボタンが強調されることによりクリック率も向上していきます。
デザインの方式はさまざまで多くの方がカスタマイズ用のCCSを提供しており、私自身も他の方が作ってくれたCCSを利用しています。
コピーして貼り付けるだけなのでかなり簡単ですよ。
カエレバ・ヨメレバのカスタマイズ用のCCSと設定
カスタマイズ用のCCSを紹介します。
ちなみに私が活用しているCSSはこのような方のものを使わしていただいています。
他にも多くの方がCSSは載せています。
「商品表示 カエレバ」などで検索するといろいろ出てきますよ。
CSSがあったらコピーしましょう！
カスタマイズ用のCCSの設定方法を紹介します。
編集する箇所
外観 ➤ カスタマイズ ➤ 追加CCS
このような流れで行ってください。
まずワードプレスのメイン画面から外観にカーソルをあわせましょう。
外観にカーソルを合わせるとカスタマイズが一覧に出てきますのでクリックします。
カスタマイズをクリックするとカスタマイズの画面に移ります。
そこで追加CSSをクリックしてください。
追加CSSをクリックすると次の画面に移ります。
画面左側に上の画像が表示れると思います。
まずは①の赤い枠に先ほど紹介したCSSを貼り付けてください。
その後②の公開をクリックします。
クリックをすると薄い字で公開済みが表示されるようになります。
そうしたら実際にカエレバ・ヨメレバが表示されているかを確認しましょう。
追加CCSにそのままコピーしたものを貼り付ければ完了です。
記事に貼り付けたらプレビュー表示してみてください。
記事に貼り付けるだけでは変化しているかが確認できません。
しっかりと変わっているようなら完璧です。
カエレバ・ヨメレバのデザインをカスタマイズ まとめ
最後までご覧いただきありがとうございました。
実際にやってみると意外と簡単にできることがわかります。
私自身も、最初は
ココがダメ
・めんどくさい
・難しそう
などの理由からやっていませんでしたが、ワードプレスを立ち上げたことを考えると正直全然余裕でした。
カンタンにできるのでぜひやってみてください。
みなさんの参考になればうれしいです。