AIエージェントを使った簡単運用法

「会社名の項目を足したい」「ボタンをサイトの色に合わせたい」。そんな小さな変更は、AIに目的を伝え、編集と確認を手伝ってもらえます。このページでは、そのままコピーして使える依頼文を用意しました。

このページのゴール ローカルの作業用コピーで1つの変更を依頼し、自分で動作を確認してから公開できること。

AIエージェントに頼めること

ここでいうAIエージェントは、許可したフォルダ内のファイルを読み、編集や検証を行える開発支援ツールです。普通のチャットだけで使う場合は、提案された変更を自分で反映します。利用できる機能や料金は、使うツールの案内を確認してください。

このガイドは外部のAIツールを使う方法です。FreelanceForm本体にAI機能やAIサービスの契約が含まれるわけではありません。

STEP 1：元に戻せる作業場所を作る

1. 正常に動いているフォーム一式をバックアップします。
2. 本番とは別の、ローカルの作業用コピーを用意します。
3. AIツールでは、その作業用フォルダを開きます。
4. まず1つの変更だけを頼みます。

ファイル編集を許可する前に、作業用コピーの form/php/config/config.php にある実際の認証情報を、ダミー値へ置き換えます。バックアップ・ログ・添付ファイルに本物の問い合わせや認証情報が残っていないかも確認します。

元の設定はWeb公開範囲外の安全な場所へ保管します。ダミー設定の作業用コピーでは実メールの送信はできません。最後の受信確認は、管理者が正しい設定を戻してから行います。

「秘密を表示しないで」と依頼するだけで、ツールへのデータ送信を防げるとは限りません。ツールの共有・読み取り範囲を確認し、実際のパスワードや個人情報を渡さないコピーで作業しましょう。

STEP 2：最初に渡す共通の依頼文

次の文章をコピーし、その後ろに「今回したいこと」を追加します。パスの例は、index-contact.php・form/・PHPMailer/ があるフォルダを基準にしています。

FreelanceFormのローカル作業用コピーを編集してください。
私はHTML・CSSを学習中で、PHPの編集には慣れていません。

【進め方】
・まずファイル構成と、今回関係する処理を確認してください。
・既存の変更を残し、今回の目的に必要な範囲を編集してください。
・先頭のPHP、mfInputState()、入力検証、確認・修正の流れを保ってください。
・認証情報の入るconfig.php、バックアップ、実際の問い合わせデータは読み取り対象から外してください。
・実メールの送信、外部サービスの設定変更、公開サーバーへのアップロードは行わないでください。
・変更後は、変更ファイル・変更内容・確認結果・私がブラウザーで確認する手順を日本語で教えてください。
・確認していないことは「未確認」と書いてください。

【今回したいこと】
この下に、次の例のいずれかを貼り付けます。

設定ファイルの編集が目的の場合は、先に認証情報を除いた必要箇所だけを用意し、その範囲を指定します。フォルダ全体を無条件に共有する必要はありません。

例1：任意の「部署名」を追加する

お問い合わせフォーム index-contact.php に、任意の「部署名」を追加してください。
位置は「会社名・団体名」の直後、入力は1行、上限100文字です。

HTMLの入力欄と、form/php/config/forms.php のcontactのfieldsを合わせて変更してください。
入力名はdepartmentとし、ラベル・エラー案内・maxlengthも整えてください。
確認画面と通知メールに、会社名の次に部署名が出る構成にしてください。
ほかの用途のフォームや、共通の送信処理は変更しないでください。

部署名が空の場合と、入力した場合の確認手順を教えてください。

変更後は、部署名を空にした場合も確認画面へ進めるか、入力した文字が表示されるか、修正で戻って残るかを確かめます。項目定義の仕組みは入力項目の追加・削除にあります。

例2：サイトの色と余白に合わせる

index-contact.php のフォームを、私のサイトの見た目に合わせてください。
メインカラーは #174bff、入力文字はスマートフォンで16px以上にしてください。
余白を少し広げ、入力欄とボタンを見分けやすくしたいです。

現在読み込んでいるCSSを確認してから、必要な箇所を編集してください。
フォーム内の見た目を調整し、サイト全体のヘッダー・フッターに影響しないようにしてください。
色だけで必須・エラーを表現せず、文字の案内も残してください。
入力項目、name、PHP、メール設定は変更しないでください。

PCとスマートフォンで確認し、実際に確認した画面幅を報告してください。
確認・完了画面への反映範囲も教えてください。

カラーコードは自分のサイトに合わせて変更します。使っている入力ページが違う場合は、ファイル名も置き換えてください。デザインの変更で編集場所を確認できます。

例3：エラーを分かりやすく調べてもらう

FreelanceFormで、次の症状の原因を調べてください。
まずは編集せず、分かった原因と、まだ確認が必要なことを分けて説明してください。

OS：Windows / Mac
確認先：localhost / 公開サーバー
入力ページのファイル名：
症状：例「確認画面には進めるが、修正ボタンで404になる」
再現する操作：
直前に変更したファイル：
画面やログのメッセージ：個人情報・認証情報を除いたもの

実際のファイル名、戻り先、相対パスを調べてください。
エラーを隠すために入力検証やセキュリティ処理を外さないでください。
私が次に確認することを、1つずつ説明してください。

最初に状況を埋め、空欄は「分からない」で構いません。回答を読んで原因が分かったら、修正する範囲を伝えて続けます。

例4：納品前の確認と引き継ぎをまとめる

このフォームの変更内容をもとに、納品前チェックリストと引き継ぎメモを作ってください。

入力・確認・修正・完了画面、通知メール、自動返信、スマートフォン表示を含めてください。
注文や添付など、使っている機能に合わせて項目を追加してください。
実メールを送信したり、公開サーバーへ接続したりする必要はありません。

コードから分かることと、私が実機や受信箱で確かめることを分けてください。
未確認の項目を「確認済み」にしないでください。
担当者・確認日・公開URLなど、分からない情報は記入欄にしてください。

公開前チェックリストと納品・引き継ぎも一緒に使えます。

例5：お問い合わせの返信文を下書きしてもらう

個人情報を伏せた要約と、自分で決めた回答方針だけを渡します。元メールや添付ファイルを丸ごと渡す必要はありません。

お問い合わせへの返信文を下書きしてください。実際の送信はしないでください。

【問い合わせの要約】
例：Webサイトの問い合わせフォーム設置について、対応可能か知りたい。

【伝えたい内容】
例：詳細を確認するため、現在のサイト構成と希望の入力項目を教えてほしい。

丁寧で親しみやすく、専門用語を使いすぎない文面にしてください。
未確定の料金・納期・対応可否は断定せず、足りない情報は質問にしてください。
氏名・会社名・URLは、私が後から差し込める記入欄にしてください。

下書きの内容を読み、事実・料金・納期・宛先を自分で確かめてから返信します。

STEP 3：変更後は、ここを自分で確認する

• 依頼した見た目や項目になっている。
• 必須項目を空にしたとき、エラーが案内される。
• 入力 → 確認 → 修正で、値と戻り先が正しい。
• PCとスマートフォンで操作できる。
• メールに関わる変更は、認証情報を戻した検証環境で受信を確認した。

PHPの構文チェックや同梱テストは、AIに制作担当者向けの検証を参照してもらえます。AIが「完了」と答えたことと、公開環境でメールが届くことは別々に確認します。

STEP 4：確認したファイルを公開する

変更したファイルを確認し、必要なものをアップロードします。ダミーの認証情報が入った設定ファイルで、本番の設定を上書きしないでください。公開URLでも、公開前チェックリストを使って確かめます。

うまく動かなくなったら、追加の変更を重ねず、今回変更したファイルをバックアップと比較します。「変更前へ戻す手順を、今回の変更だけに絞って教えて」と頼む方法もあります。

ここまでできたらOK 1つ頼む → 変更を見る → 自分で確かめる → 公開する。この順番で、小さな調整からAIを制作の手伝いに使えます。