アフィンガー4でカエレバのカスタマイズが出来ない!ちょっと違う方法で出来ました!
(画像です)
みなさんこんにちは、ミナミです。
アフィリエイトを行う上で、ブログやサイトが必ず必要なのですが、ワードプレスでサイトを作る上で色々なテーマがあります。
僕はその中でアフィンガー4を使っているのですが、僕自身かなり素人でして、一つの設定をするのにも何時間もかけてようやくできる程度。
いくつかサイトを作っているのですが、毎回同じところで悩むことがあるので、自分の備忘録的に今回もまとめました。
アフィリエイトで商品を紹介しているサイトでは、基本的に主力商品以外の商品は紹介しない方がいいです。そっちに流れてしまうからですね。
でも、場合によっては別の商品も書かなきゃ不自然だったり不便だったりします。
そんなときにAmazon等を使うことがあるのですが、やっぱりリンクは綺麗にしたい所。
今回はそんなAmazonや楽天などのリンクが簡単に作れる「カエレバ」を使うときのカスタマイズ方法です。
カエレバを知らない人はコチラを見て下さい。超便利ですw
アフィンガー4でカエレバのカスタマイズが出来ない
「カエレバ ワードプレス カスタマイズ」で検索するとコピペでOKな記事がいっぱい出てきます。
それらの記事を見比べて、自分が気に入ったデザインの物を自分のサイトのCSSに貼れば出来ます。
今回参考にしたのは有名なゆきひーさんのこちらの記事。
うん、出来ない(:;)
まずアフィンガー4はレスポンシブなので、「PC」「スマホ」は無視して「レスポンシブ」を使います。
そして「デザインCSS」に貼り付けるとの事ですが、ワードプレスでは「style.css」で問題ないハズ。もちろん子テーマのstyle.cssの最後に貼ります。が、
変わりません。
親テーマのstyle.cssにも貼ってみます。
やっぱり変わりません。(:;)
アフィンガー4はオリジナルCSSが効かない場合がある
アフィンガー4ですが、原則として「CSS?は?なんじゃそれ?」という方でも簡単にデザインを変更できるようになっており、逆に自分でCSSをカスタマイズしたいという場合は少々ややこしい仕様になっているらしい。
詳細はコチラのページに書いてあるのですが
簡単に言うと、アフィンガー4の初心者モードを解除しないとCSSの変更は反映されないので、解除して中級者モードでやりなさいという感じ。
でも僕はもうすでに初心者モードで結構サイトを構築してしまっていたので、今更そのモードを解除出来ない状態。(解除すると色々設定が戻ってしまう。)
・・・これはカエレバのカスタマイズを諦めるしかないのか?
基本フォントも変更出来なかった
別の記事にも書いたのですが、基本フォントを大きくする時もstyle.cssでは出来ませんでした。
親テーマのCSSを変更してもダメ。
その時は「外観」→「カスタマイズ」→「追加CSS」に書くことでうまくいきました。
・・・今回もそれで行けるんじゃなかろうか。
何が起こったワードプレス
上記通り「style.css」ではなく「追加CSS」に書いてみます。
保存してみます。
「何かうまくいかなかったようです。時間を置いてもう一度お試しください。」
「何かうまくいかなかった」じゃねー。
原因を教えてくれ。
アフィンガー4でカエレバのカスタマイズを行った方法
色々試してついに出来ました。
方法ですが、「追加CSS」に書く所までは良かった。
しかし、何故か「追加CSS」ではコメントアウトがエラーになるようでした。
上図の「/*」から「*/」で囲んだオレンジの部分ですね。
通常はプログラムで「何をしている部分か後からわかるようにするため」にコメントを追記して、プログラムが無視してくれるように「/*」と「*/」で囲むんです。
するとプログラム側では無視してくれるんですが、「追加CSS」ではダメのようでした。
で、貼り付けるCSSの中のコメントアウトを全て消してから保存してみると
おお!出来た!
あとは自分の好みで色や形をCSS上で変更することも出来ます。
このままでよければこのままでOK。
最後に
僕のスキル不足のせいで出来なかった部分がおおいにあったのだと思うのですが、きっと僕と同じ程度のスキルの人はいっぱいいるハズと思いまとめました。
ま、記事頭でも言ったとおり、別サイトを立ち上げる時の自分の備忘録の為でもありますが。
他のアフィンガー4のカスタマイズについては下記記事でも書きましたので良ければ御覧ください。
以上、「アフィンガー4でカエレバのカスタマイズが出来ない!ちょっと違う方法で出来ました!」でした!