WordPress記事内にリンクボタンが設置できない！その解決備忘録

ブログでアフィリエイトを行う際
リンクを”ポチッ”とクリックしてもらう為の
【リンクボタン】を作りたい。

こういうやつです！

それが不幸の始まりでした。
簡単に作れると思ったら丸一日以上もかかってしまった…

同じ境遇でお困りの方がいらっしゃったら、
その時の悪戦苦闘日記が何かの足しになればと、
書き記しておきたいと思います。

私が苦戦した流れとして

この難題が次々と襲ってきました。
ボタンを作りたいだけなのに…

私はこういうコードとか内部のシステムは全くの素人でして、
専門的な詳しい解説はできませんが、
そんな素人目線での悪戦苦闘ぶりを赤裸々にお伝えいたします。

WordPressのテキストエディタでは作れない

私はWordPressでの記事作成は、
テキストエディタを使っています。

しかし、最近WordPressで
Gutenberg（グーテンベルグ）たるものが、
突然アップロードされて、
「何だよこれ！」とお手上げ状態。

そこでお助けプラグイン”classicエディター”
を使って旧型のテキストエディタで作業しています。

そんな環境の下、
“リンクボタンを作る”とググると、

でも、
WordPressのテキストエディタはダメなのです！

実際、上の2つは標準装備されているのですが
テキストエディタだけ何もない！

参った！

無理っすよ！

そこで次の作戦としては、
“ボタンのプラグインを入れてしまおう作戦”

我ながら名案！

なのですが、
これも一筋縄ではいきませんでした！

広告コードとプラグイン

これで解決！じゃね！

…と、またそうは行きませんでした。

ここで立ちはだかる壁が

の二つ！
では見ていきましょう。

プラグインを使えば確かに簡単に、
リンクボタンを設置できます。

その際、
広告コードをリンクボタンに埋め込むのですが、
何やらそこに問題があるとか。

ここでの問題は、
ASPの規約で一般的に禁止されている、
広告コードを変えてしまう事

これプラグインに組み込む際、
意図しなくても、
プラグイン側が勝手に変えてしまう恐れがあるとの事。

そうすると、
ASPの規約違反で報酬が見込めないどころか、
ペナルティまでついてくる…

ちょっと怖いなプラグイン…

実際調べれば、
コード変更を”大丈夫ですよ”と言ってるASPもあるのですが、
ここは一旦保留。

またプラグイン問題といえば、
別のブログでプラグインをバシバシ入れたら、
動作が重くなるという事があったので、

新しいブログ作ったら、
あまりプラグイン入れない方がいいかな…と。

ここは一旦保留で、
ひとまず別の解決方法を調べることにします。

それから調べて行くと、
比較的簡単にコードを埋め込みができて、
ボタンを作れるとの事。

コード変更はかなり抵抗があるのですが、
それほど大掛かりでは無さそうなので、
ここは少しチャレンジ！

追加CSSが反映されない

方法としては、

今回は
こちらの記事のコードを参考にさせていただきました

アフィリエイトリンクをボタンにするには？【CSS追加するだけで簡単です】

[say name="" img=" ...

bryog.com

結構簡単！
これで完結！と思いきや、
思うように反映されない…

なんで？参った！

教えてくれたブログが嘘ついてるの？
いやそんな事はないよ！

私の埋め込み方がおかしいんだよ！
たぶん…

という事で、
一文字一文字の睨めっこ。

でも、
どこをどう見ても同じなんすよね。

この最後の砦がなかなか壊せない…
何が原因？

全部試したけどうまく反映されず…
すっかり迷宮入りです。

そして、
ふと挿入したアフィリエイトのリンクに
反応した！

おおおっ！

実は私の試したボタンリンクは、
アフィリエイトリンク対応のボタンだったのです。

このボタンに
挿入するリンクの種類に注意が必要なんです。

試しに何度も挿入していたのが、
ただのURLリンク。

テストだから”ただのURL”でいいか…と、
ひたすら”ただのURL”を試していたのです。

これが原因！
これだと全く反応しないボタンなのです。

ここまで丸一日です！
トライ&エラーは仕方がないですが…
まぁ、開通したから良しとしましょう！

最後に

ブログ記事内にリンクボタンを設置するという、
文章で書けば一行たらずの行為なのですが、

解決するまでに丸一日を要してしまいました。

ですが、
誰に聞くことなく、Google様とにらめっこで、
自力で解決できました。

4６歳のおじさんでも調べれば自力でできる！

そして同じ場面でお困りの方に、
少しでも解決のヒントとなれば幸いです！