盛って楽して、サイト運営MoteRakuを使って404ページを作ってみた！AIのコードを貼るだけで本当にできる？
yoshimi
2026/07/21
「WordPressのページデザインを変えてみたい。でも、自分でHTMLやCSSを書くのは難しそう……」
そんな私が今回使ってみたのが、AIにコードを作ってもらい、そのコードを貼り付けるだけでページを作成できるWordPressプラグイン「MoteRaku」です。
途中でコードが反映されないトラブルもありましたが、原因が分かってからは本当に一瞬！
それでは、使い方をご紹介します。
盛って楽して、サイト運営。MoteRakuの使い方
STEP1
STEP2
STEP3
今回は404ページを作成したかったので、この後に404ページのコードをお願いしました。自分の運営しているサイトのURLを入力してこれに合う404ページをおまかせでお願いしました。
出てきたコードを「新規ページ追加」のこの画面に貼り付けをしましょう
反映できない！「更新に失敗しました」と表示された
「え？ コードを貼り付けるだけじゃないの？」
と、一瞬止まってしまいました。
最初はコードに問題があるのだと思い、ChatGPTにエラーの内容を伝えて、別のコードを作ってもらいました。
しかし、新しく出してもらったコードを貼り付けても、うまく反映されません。
コードを変えても解決しなかったため、
「もしかして、コード以外に原因があるのでは？」
と思い、勝田さんへ問い合わせてみました。
原因はConoHa WINGのWAFだった
勝田さんに問い合わせたところ、私が利用しているレンタルサーバーがConoHa WINGだったことが関係していると教えていただきました。
ConoHa WINGはセキュリティーがしっかりしているため、WAFがコードの保存や通信を止めてしまうことがあるそうです。
WAFを一時的にOFFにしてから、もう一度MoteRakuの画面で保存してみたら、今度はすぐに反映されました！
※WAFとは、Webサイトへの不正なアクセスや攻撃を検知し、遮断するためのセキュリティー機能だそうです。
解決したあとは一瞬で404ページが完成
WAFを一時的にOFFにして再度反映すると、作成した404ページがすぐに表示されました。
まずは今までの404。
もっと華やかにしたくてAIに追加でお願いしてみた
完成した404ページを見ていると、もう少し華やかにしたくなり、
今度は、ChatGPTに、
「もっと桜の花びらを増やしたい。
花びらが上からひらひらと落ちるようにしたい。動画でお願い」
と、追加でお願いしてみました。
すると、桜の花びらをアニメーションで動かすためのCSSコードを作成してくれました。
静止画ですが、実際は周りの花びらがひらひらと舞って落ちてきます。
MoteRakuを使ってみた感想
最初に「レスポンスが反映されません」と表示されたときは、正直、
「え？ どういうこと？」
となりました。
ChatGPTに別のコードを出してもらっても解決しなかったため、少し難しく感じたのも事実です。
でも、問題が解決してからは本当に簡単でした。
AIに作りたいデザインを伝えて、出てきたHTMLとCSSをそれぞれコピーして貼り付けるだけ。
さらに、「もう少しこうしたい」と思ったときも、追加のプロンプトでコードを作ってもらい、貼り足すことでデザインを調整できました。
自分で一からコードを書くことを考えると、かなり楽です。
「コードが分からないから、オリジナルページは作れない」
と思っていた人でも、AIとMoteRakuを組み合わせれば、自分のイメージに近いページを作れる可能性が広がると感じました。
ぜひ、一度お試しくださいませ〜
この記事の著者・監修
yoshimi
AIを学びたい方び寄り添い、カツプロを通じて、安心して一歩を踏み出せる場所づくりのお手伝いができればと思っています。
この記事をシェア