こんにちは、ちむです
またずいぶん久しぶりの更新になってしまいました
今回はワードプレスで作っているブログのことで相談されたのでこちらについて話していこうと思います。
ブログのことで困っているので相談を聞いてほしいということで色々聞いてみたところ、ブログの読者向けにYes/Noの質問に答えてその人に合った答えを提示するYes/Noチャートを作りたいとのこと。
始めは「専用のプラグインがあるからこれを使えば良いんじゃない？」と思って伝えたのですが、すでに多くのプラグインを使っており、ページが上手く作動しなくなる可能性が高まるからプラグインは使わずにコードで作ってほしいということになりました
この時点で難しそうだなとは察してました
ちなみにすでにHTMLのコードはある程度できており、これをワードプレスのカスタムHTMLに入れると１つ目のチャートは作動するのですが、2つ目以降のチャートが全く表示されないということで行き詰っているようです。
私の今の知識ではHTML、CSS、JavaScriptを多少読むことはできても、１から作り上げたり不具合が出ているものを解決することはまだまだできません
そこで困ったときのchat GPTに頼ることにしました。
やはりchat GPT大先生は本当に頼りになりますね
何度か質問を繰り返すことでおおよその原因は見えてきました。
質問の流れとしては以下の通りです。
１，ワードプレスで作成のページにYes/ Notチャートをプラグイン無しで作りたいです。サンプルのコードを作れますか？
２，１つのチャートしか反映されないのですが、何が原因でしょうか？
３，実際のコードを送って見てもらう
４，修正してもらったコードを同じページで2回貼り付けると１つしか表示されないのですが何が原因でしょうか？
５，さらに修正版のコードを入れるとプレビューでは表示されますが、実際のページで反映させると１つしか出ません。どういった原因があるでしょうか？
上記の流れで質問を繰り返したところ、考えられる原因は次の通りです。
１，JavaScriptの競合またはエラー、他のプラグインやテーマのスクリプトが競合している可能性があり、複数のチャートを制御するJavaScriptが正しく動作しないことがある。
２，CSSの影響、他のスタイルシート（テーマやプラグイン由来）がチャートやその子要素に影響を与え、片方のチャートが非表示になっている可能性がある。
３，ワードプレステーマのキャッシュ、実際のページでは、テーマやプラグインによるキャッシュ機能が影響し、コードが正しく読み込まれない場合がある。
４，サーバーサイドのHTML整形機能の影響、ワードプレスやサーバー設定によって、HTMLの重複部分が自動的に削除される場合がある。
上記が考えられる原因として挙がっており、それぞれの対策も挙がっていたのでこれから対応していこうと思います。
ちなみに現段階では未だに解決できていません
実際やってみた感想ですが、ある程度ワードプレスについては知識を持って操作にも慣れた方が理解度は上がりやすいかなと感じました。
今回の相談についてはできるだけ早めに解決したいと思っているので、これからも試行錯誤しながらやってみようと思います