blancブログ

Information&Blog

友だち追加

ChatGPTなどのAIに聞いてホームページを直したら崩れた|まずやること、場面ごとの戻し方、壊さない使い方と依頼する場合の料金

更新日:

ホームページ修正・更新
ChatGPTなどのAIに聞いてホームページを直したら崩れた|まずやること、場面ごとの戻し方、壊さない使い方と依頼する場合の料金のアイキャッチ画像

「ChatGPTに聞いたとおりにコードを貼ったら、ホームページが真っ白になった」「AIに教わったCSSを入れたら、スマートフォンで見たときに表示が崩れた」「社名の変更をAIに任せていたら、途中からどのファイルが正しいのか分からなくなった」。ChatGPTやGemini、Copilotなどの生成AIは、ホームページの直し方を聞くと、すぐに具体的な手順やコードを示してくれます。便利な反面、その手順をそのまま本番のサイトで試して、動かなくなった、というご相談もあります。

この記事では、AIの指示どおりに触ってホームページが崩れたときに、まず何をして何をしないか、よくある4つの場面ごとの戻し方、次にAIを使うときに壊さないための使い方、自分で戻せないときに依頼する場合の伝え方と料金を順に説明します。AIを使ったかどうかに関係なく、表示されない原因を一から切り分けたい場合は「ホームページが表示されない」をご覧ください。

AIの指示どおりにしたのに、なぜ壊れるのか

AIの答えが間違っているとは限りません。問題の一つは、サイトのファイルや設定をAIに見せないまま、示された手順をそのまま試すことです。情報を渡していても、その手順が自分のサイトに合うかは、別に確かめる必要があります。

  • サイトの中身を知らない——サイトのファイルや設定を見せていなければ、AIは、使っているテーマやプラグイン、PHPのバージョン、ほかのファイルとのつながりを踏まえずに答えます。一般的なWordPressや一般的なHTMLを前提にした答えが、あなたのサイトには合わないことがあります
  • 貼る場所の指定があいまい——「functions.phpに追加してください」と言われても、親テーマと子テーマのどちらか、ファイルのどこに入れるかで結果が変わります。親テーマに書いた内容は、テーマを更新すると消えます
  • 1文字の違いでサイト全体が止まる——PHPのファイルは、閉じかっこやセミコロンが1つ足りないだけで、そのファイルを読み込むページがすべて表示されなくなることがあります。コピーしたときに行の一部が欠けるだけでも起こります
  • CSSが別のページにも効くことがある——1か所の見た目を直すつもりで入れたCSSが、同じ名前の部品を使っている別のページまで変えてしまうことがあります
  • 存在しない設定や関数が混じる——AIの答えには、それらしく見えても実際には存在しない関数名や設定の場所が混じることがあります
  • やり取りが長いほど前提がずれる——作業を長く続けると、AIが前に作ったファイルや決めた名前を取り違え、ファイル同士のつながりが合わなくなっていくことがあります
AIの答えが、あなたのサイトに合わないことがある理由の一覧。テーマやプラグイン(使っているものを踏まえずに答えることがある)、PHPのバージョン(サイトの環境に合わないコードが混じることがある)、ほかのファイルとのつながり(名前や置き場所を変えると、読み込めなくなる)、貼る場所(親テーマか子テーマか、ファイルのどこか)。
AIの答えが、あなたのサイトに合わないことがある理由

つまり、AIの答えは一般的な例をもとにした提案で、内容が正しいか、あなたのサイトで動くかは、別に確かめる必要があります。この違いを知っておくだけでも、壊れたときの戻し方が見えやすくなります。

※お急ぎの場合は、ホームページ修正の代行(最短当日・相談無料)もご利用いただけます。

崩れたら、まずやること・やらないこと

崩れた直後にいちばん避けたいのは、慌てて手を重ねて、元の状態が分からなくなることです。直す前に、次の4つを守ってください。

木の机の上に、濃いグレーの外付けハードディスクと銀色のUSBメモリーが並べて置かれ、横に無地のクラフト紙のノートがある写真。
直す前に、いまの状態を自分のパソコンなどに控えておきます
  • それ以上AIに直させない——「直りません」と伝えて新しいコードをもらい、また貼る、を繰り返すと、変更が重なっていきます。どの変更で壊れたのかが分からなくなり、戻すのが難しくなります
  • AIとのやり取りを残す——何をどのファイルのどこに貼ったか、何を消したかが、あとで戻すときのいちばんの手がかりになります。画面のスクリーンショットを撮るか、会話を残しておきます
  • いまの状態を控える——触ったファイルの、いまの中身を自分のパソコンにダウンロードして保存しておきます。壊れた状態でも、何が変わったかを比べる材料になります。サーバーの公開フォルダーの中に別名の控えを置くと、外から中身を読まれることがあるので避けます
  • バックアップで上書きする前に、いつの版かを確かめる——手元のバックアップが古いと、そのあとで直した社名や価格、追加したページまで元に戻ってしまいます。ファイルの日付と中身を確かめてから使います。WordPressでは記事や設定の多くがファイルではなくデータベースに入っているため、ファイルとデータベースのそれぞれのバックアップがいつのものかも確かめます。古いバックアップに戻すと、そのあとに増えた記事やフォームの記録が消えることがあるので、戻す前にいまのデータベースも保存しておきます。保存や復元の方法が分からない場合は、上書きせずに相談してください
崩れたら、まずやる4つの図。1 それ以上AIに直させない(変更が重なり、元の状態が分からなくなる)、2 AIとのやり取りを残す(何をどのファイルのどこに貼ったか)、3 いまの状態を控える(自分のパソコンにダウンロードして保存)、4 いつの版かを確かめる(古い版だと、あとで直した社名や価格まで戻る)。
崩れたら、まずやる4つ

注意

ChatGPTの会話は、画面上部のアドレス欄のURLを送っても、ほかの人は開けないことがあります。人に見てもらうときは、必要な部分のスクリーンショットを送るのが確実です。会話の「共有」の機能でリンクを作る場合は、見せたい箇所以外の会話も見えることがあるため、会話の中にパスワードや個人情報を貼っていないかを先に確かめます。貼っている場合は共有せず、その部分を隠したスクリーンショットで伝えます。

注意

AIに「いまのファイルの中身」を見せて相談する場合も、パスワードや個人情報が書かれた部分は貼らないでください。WordPressの wp-config.php には、データベースのパスワードが書かれています。

よくある4つの場面と、戻し方

AIの指示で崩れるときは、触った場所によって症状と戻し方が変わります。自分で戻せることも多いので、まず自分がどれに当たるかを確かめてください。

よくある4つの場面と戻し方の一覧。functions.php にコードを貼った場合は今回貼った部分だけを消す、追加CSSに貼った場合は消してパソコンとスマートフォンで確かめる、HTMLのファイルを書き換えた場合は読み込むCSSのファイルの場所を比べる、.htaccess を書き換えた場合は書き換える前の内容に戻す。
触った場所ごとの戻し方

WordPressで functions.php にコードを貼ったら、真っ白になった・重大なエラーが出た

WordPressのテーマのファイルを編集したときに起こる場面です。テーマの functions.php にPHPのコードを貼り、保存したとたんに画面が真っ白になる、または「このサイトで重大なエラーが発生しました」と表示されます。

  • 管理画面に入れる場合——管理画面の「外観」または「ツール」にある「テーマファイルエディター」を開き、貼ったときと同じテーマ(親テーマか子テーマか)の functions.php を選んで、今回貼った部分だけを消して保存します。保存したあとは、ログインしていない別のブラウザーでも公開ページを確かめます。テーマファイルエディターで貼った場合は、保存した時点でエラーが見つかり、変更が保存されずに終わっていることもあります。メニューが見当たらない、どこを消せばよいか分からない場合は、無理に触らないでください
  • 管理画面に入れない場合——サーバーのファイルマネージャーやFTPで、テーマのフォルダーにある functions.php を開きます。子テーマを使っていても、貼った先が親テーマの functions.php ということがあるので、どちらに貼ったかをAIとのやり取りで確かめます。開く前に、そのファイルを自分のパソコンにダウンロードしてから、今回貼った部分だけを消します。どちらに貼ったか分からない場合は、推測で消さずに相談してください
  • 管理者あてにメールが届いている場合——重大なエラーが出ると、WordPressから管理者のメールアドレスあてに、リカバリーモードで入るためのリンクが届くことがあります。そこから入って、貼った部分を消すこともできます

どのファイルに貼ったか分からない、消しても直らない、という場合の切り分けは「「このサイトで重大なエラーが発生しました」と表示されたら」に詳しく書いています。

「追加CSS」にCSSを貼ったら、表示が崩れた

CSSの書き間違いだけで、サーバーの処理が止まることは通常ありません。その代わり、思わぬ場所の見た目が変わり、場合によっては文字やボタンが隠れて操作できなくなることもあります。パソコンでは直って見えても、スマートフォンでだけ崩れていることもあります。

  • WordPressの多くのテーマでは、「外観」→「カスタマイズ」→「追加CSS」を開き、今回貼った部分を消して「公開」を押します
  • ブロックテーマ(サイトエディターで編集するテーマ)では、「外観」→「エディター」→「スタイル」を開き、スタイルの画面にある「︙」のメニューから「追加CSS」を選びます。今回貼った部分を消して「保存」を押します。画面の作りが違って項目が見つからない場合は、別の場所のCSSを触らないでください
  • テーマのCSSファイル(style.css など)に直接書いた場合は、そのファイルから貼った部分を消します

消したあとは、パソコンとスマートフォンの両方で、トップページとほかのページをいくつか開いて確かめます。崩れ方から原因を探す方法は「ホームページの表示が崩れた!」をご覧ください。

HTMLのファイルをAIに書き換えてもらったら、デザインが消えた

WordPressではない、HTMLで作られたサイトで起こりやすい場面です。文字は出ているのに、色や配置がすべて消えて、文字だけが縦に並んだページになります。

この症状は、ページが読み込むCSSのファイルが見つからなくなっているときに出ることが多いです。AIがファイルの名前や置き場所を変えた、ファイルを1つにまとめた、古いファイルを消した、といった作業のあとに起こります。JavaScriptのファイルが見つからない場合は、見た目は残っていても、メニューの開閉やスライドなど動きのある部分が動かなくなります。

  • サーバーにある元のファイルを、いまのうちにすべて手元にダウンロードしておきます
  • 崩れていないページがあれば、崩れたページと、HTMLの先頭にあるCSSの読み込み(<link rel="stylesheet" href="…"> の行)の書き方を比べます。全ページが崩れている場合は、書き換える前の控えにある同じページと比べます
  • 読み込み先のファイルが、書かれた場所に実際にあるかを確かめます
  • CSSのファイルが残っていて、書かれた場所とずれているだけなら、HTMLの読み込み先を実際のファイル名と場所に合わせて直します
  • CSSのファイルそのものが消えているなら、書き換える前の版から、そのファイルを戻します

ページの数が多いサイトでは、1ページずつ直すより、どのファイルがどう変わったかを全体で比べたほうが早く確実です。書き換える前の版がどれか分からない場合は、ほかのページを丸ごと上書きして合わせようとせず、比べた結果を持って相談してください。

無地の木のジグソーパズルがほぼ組み上がった状態で机に置かれ、3つのピースが外れて、空いた場所の横に斜めに置かれている写真。
変わった箇所を全体で比べて、1つずつ元の場所に戻します

.htaccess を書き換えたら、500エラーになった

「httpsに転送したい」「URLの末尾をそろえたい」などの目的で、AIに .htaccess の書き方を聞いて書き換えると、「500 Internal Server Error」が出てサイト全体が表示されなくなることがあります。.htaccess を使うサーバーでは、公開フォルダーにある .htaccess の1行の誤りで、そのフォルダーから下のページがすべて500エラーになることがあるためです。

  • サーバーのファイルマネージャーやFTPで、書き換える前の .htaccess に戻します
  • 書き換える前の内容が分からない場合は、そこで手を止めて相談してください。.htaccess にはWordPressの設定や転送のほか、特定のフォルダーへのアクセスを制限する設定が書かれていることもあり、名前を変えたり消したりすると、その制限まで外れてしまうためです

500エラーのほかの原因については「500エラーが発生したときの基本的な対応方法」をご覧ください。

AIを使うなら、壊さないための使い方

AIに聞くこと自体が悪いわけではありません。小さな修正なら、うまく使えば自分で直せることも増えます。壊さないために、次のことを守ってください。

  • 本番のサイトで、いきなり試さない——試す前にバックアップを取ります。サーバーにテスト用の環境を作れるなら、そこで試してから本番に入れます
  • 「どのファイルの、どこに」を確かめてから貼る——AIに聞くときは、使っているテーマやプラグインの名前、WordPressかHTMLかを先に伝えます。親テーマのファイルに書くように言われたら、子テーマがあるかを確かめます
  • 1回に1か所だけ変える——いくつもの変更をまとめて入れると、壊れたときにどれが原因か分かりません。1か所変えたら、パソコンとスマートフォンで表示を確かめてから次に進みます
  • 変える前のファイルを残す——ファイルを書き換える前に、自分のパソコンに日付を付けた名前で保存しておきます。サーバーの中にコピーを置いたままにはしません
  • 分からない言葉が出てきたら、そこで止める——「データベース」「権限」「ネームサーバー」など、意味の分からない操作を求められたら、そこで手を止めて詳しい人に確かめます。元に戻すのが難しい操作が含まれていることがあります
AIを使うときに守ることの一覧。本番のサイトで、いきなり試さない(試す前にバックアップを取る)、「どのファイルの、どこに」を確かめる(テーマやプラグインの名前を先に伝える)、1回に1か所だけ変える(変えたら、パソコンとスマートフォンで確かめる)、変える前のファイルを残す(自分のパソコンに日付を付けて保存)、分からない言葉が出たら止める(元に戻すのが難しい操作のことがある)。
AIを使うときに守ること

ポイント

AIに長い作業をまとめて任せるほど、途中で前提がずれたときに気づきにくくなります。社名の変更のように多くのページにまたがる作業は、AIに任せきりにせず、変えるページと箇所の一覧を先に作ってから進めると、漏れや取り違えを防げます。

自分で戻せないときは

貼った場所が分からない、消しても直らない、管理画面にもサーバーにも入れない、という場合は、それ以上触らずに依頼したほうが早く済みます。直そうとして重ねた変更が多いほど、原因を探す時間が長くなるためです。

依頼するときに伝えること

  • サイトのアドレス
  • いつから、どのページで、どんな表示になっているか(画面のスクリーンショットがあれば一緒に)
  • AIに何を聞いて、どのファイルのどこに何を貼ったか(やり取りのスクリーンショットや共有リンク)
  • そのあと自分で戻そうとして行ったこと
  • サーバーやWordPressのログイン情報が手元にあるか

全部そろっていなくてもかまいません。分かっている範囲で伝えれば、そこから調べられます。ログイン情報が分からない場合は「ホームページの管理画面に入れない」もご覧ください。

blancに依頼する場合の料金

blancでは、AIに聞いて触ったら崩れたサイトの復旧をお受けしています。他社が作ったサイトでもご相談いただけます。料金表では、簡単な修正には「基本作業料金」、WordPressの重大なエラーや画面崩れには「WordPress復旧」の項目があります。

作業

料金

備考

基本作業料金

5,500円(税込)

※簡単なテキスト修正等含みます。

WordPress復旧(重大なエラー・画面崩れ・更新失敗)

33,000~110,000円(税込)

※原因調査・切り分け込み。被害状況により増減します。

基本作業料金だけで復旧できる、という意味ではありません。HTMLのサイトや .htaccess の復旧も含めて、どの作業になるかと金額は、原因を調べたうえでお知らせし、ご承諾をいただいてから作業を始めます。ご相談とお見積りは無料です。なお、元どおりに戻せることはお約束できません。バックアップが残っているか、いつの時点のものかによって、戻せる範囲が変わります。

実際にあったご相談です。HTMLで作られたサイトの社名変更をAIに任せていたところ、途中から意図しないファイルが作られ、ページが崩れました。慌てて手元のバックアップで上書きしたものの、それは社名を変える前の古い版でした。見た目が崩れ、社名も古いままになっていたサイトを、読み込むファイルの整理、表記の直し、サイトマップの作り直しまで行って復旧しました。

ほかのトラブルも含めた相談先と進め方は「ホームページの復旧・トラブル対応」にまとめています。

まとめ

  • AIの答えは一般的な例をもとにした提案で、あなたのサイトで動くことを確かめた手順ではない
  • 崩れたら、それ以上AIに直させず、やり取りといまの状態を残す
  • バックアップで上書きする前に、いつの版かを確かめる
  • functions.php なら貼った部分を消す、追加CSSなら消して表示を確かめる、HTMLなら読み込むファイルの場所を比べる、.htaccess なら書き換える前に戻す
  • AIを使うときは、本番でいきなり試さず、1回に1か所だけ変える
  • 自分で戻せないときは、何をどこに貼ったかを伝えて依頼する

「AIに聞いて触ったら、どこを変えたか分からなくなった」という状態でも、いまのファイルと設定から原因を調べられます。まずは、いまの状況をそのままお聞かせください。

ホームページの修正・更新でお困りではありませんか?

お電話でのお問い合わせはこちらまで

フリーダイヤル0120-781-437

受付時間 平日 9:00~18:00(時間外も応相談)

他社で制作したサイトもOK。軽微な修正は最短当日対応します

ホームページ修正・更新の詳細を見る(相談無料)

検索ボックスへキーワードを入力してください

ホームページ制作、更新、SEOに関する
お問い合わせ・お見積もり依頼は、
電話もしくはフォームでも受け付けております。

フリーダイヤル0120-781-437

受付時間 平日 9:00~18:00

まずは無料相談する