【AI社員実践記 第25話】AIと新しいサイトを作る　WordPress設置から最初の掲載相談まで

こんにちは、オフィスピコッツの小笹です。

AIと新しい事業のアイデアを考えていると、画面の試作までは驚くほど早くできます。ただ、試作画面ができたことと、実際に使えるWebサイトができたことは同じではありません。

ドメインを取る。サーバーへつなぐ。WordPressを入れる。掲載する情報をどう管理するか決める。写真を使っていいか確認する。問い合わせフォームが本当に動くか試す。そして最後には、掲載してほしい相手へ実際に連絡する必要があります。

今回は、そんな工程を一つずつ進めて、新しいサイトを立ち上げました。名前は「あの場所のつづき」です。

テーマは、以前お店や施設などで使われていた家具や道具。その品物がどこで使われ、今どこで販売されているのかを一緒に紹介します。

今回できたのは「サイトを作った」だけではありません。専用テーマと掲載管理機能を入れ、一般の人から掲載相談を受け取れるところまで確認し、実際の販売店2件へ最初の掲載相談を送るところまで進みました。

古いものを「商品」だけで終わらせず、以前の居場所も残したい

喫茶店で使われていたテーブル。学校の椅子。工房で使われていた道具。中古品として見れば、価格やサイズ、状態が主な情報になります。

でも、「以前どこで使われていたのか」が分かると、同じ品物でも少し違って見えます。

今回考えたのは、その背景を販売情報と一緒に残せないか、というサイトです。

ただし、オフィスピコッツ自身が商品を仕入れて販売するわけではありません。サイト内で決済もしません。在庫も持ちません。商品の詳細ページから、実際の販売元へ案内します。購入方法や配送については販売元へ相談してもらいます。

最初から役割を広げすぎると、在庫管理、決済、発送、返品対応など必要な仕事が一気に増えます。今回はまず、「由来の紹介」と「販売元への案内」に役割を絞りました。

AIの試作を、そのまま終わらせずWordPressへ移した

最初はAIと画面を試作しました。

ただ、試作はあくまで試作です。今後自分で品物を追加し、情報を修正し、掲載相談を管理するなら、普段使っているWordPressで動く方が扱いやすい。

そこでAIに、専用のWordPressテーマと掲載管理プラグインを作ってもらいました。

テーマ側はトップページ、品物一覧、詳細ページなどの表示を担当します。プラグイン側では、品物の情報と掲載相談を管理します。

品物には通常の記事タイトルや本文だけではなく、以前使われていた場所、販売元、販売ページURL、価格、送料や受取方法、在庫状況などを登録できるようにしました。さらに、写真の利用許可と由来の確認状況も管理項目へ加えています。

ここで大事なのは、AIが私のWordPressへ勝手にログインし、全部操作したわけではないことです。AIがコードや設定案を用意し、私がインストールや入力を行い、その画面をスクリーンショットで見せて確認してもらう。これまでのAI社員実践記と同じ進め方です。

ドメインを取って、既存サーバーへ新しいサイトを追加

サイト用には、新しくanobasho.netを取得しました。

サーバーを新規契約したわけではありません。すでに使っているレンタルサーバーへ新しい公開フォルダを作り、そこへWordPressを設置します。

ドメインの管理先とWebサーバーは別なので、ドメインを取得しただけではサイトは表示されません。DNSを設定して、ドメインから既存サーバーへつなぎます。

WordPressを入れたあと、サイト名、URL、パーマリンクなどを設定し、今回作った専用テーマとプラグインを有効化しました。

ここで一つ問題が出ました。

wwwなしのドメインはSSL設定ができたのに、www付きだけSSLを設定できない状態が残ったのです。

このSSL問題は作業が少し長くなったので、第26話で別にまとめます。

「販売ページにある写真だから使える」とは限らない

サイトの見た目を作るとき、写真を入れると一気にそれらしくなります。

ただし、販売店のWebサイトで公開されている写真だからといって、別サイトで転載してよいとは限りません。

試作を進めている途中で、この点を明確にしました。

今回のテーマとプラグインの配布用データからは、利用許可を得ていない商品写真を外しています。また、品物ごとに写真の利用許可を管理できる項目も設けました。

写真がない場合は代替表示を出せるので、写真の許可がまだなくても、商品情報の入力やページの確認はできます。

ただし、技術的にすべての画像転載を止める仕組みではありません。今回制御しているのは、テーマが表示するアイキャッチ画像です。本文へ直接画像を挿入すれば、その画像までは自動判定できません。

結局のところ、使ってよい写真かを人が確認して登録する運用は必要です。

本物の商品を入れる前に、テスト商品を1件作った

本番の掲載商品はまだ決まっていなかったため、最初はテスト用の品物を登録しました。

価格は12,000円。在庫は販売中。販売元、受取方法、販売ページへのリンクなども仮の内容で入力します。

ここで確認したかったのは、管理画面に入力欄があることではありません。

入力した情報が、実際の訪問者向けページへどう出るか。

です。

保存したあと、詳細ページを開きます。

由来、価格、在庫、販売元、受取方法、販売ページへのボタンが反映されました。

実物の商品を掲載する前に、このテストをしたことで、「販売元から何を聞く必要があるか」も具体的になりました。

掲載相談フォームは、送った内容をいきなり公開しない

販売元などから情報を寄せてもらえるよう、「掲載のご相談」ページも作りました。

入力するのは、名前や事業者名、連絡先メールアドレス、品物名、販売ページのURL、以前使われていた場所や用途などです。個人情報の取り扱いへの同意欄も付けました。

送信された内容は、そのまま公開されません。

WordPressの管理画面へ非公開の相談データとして保存します。

写真を使っていいか。由来はどこまで確認できるか。内容に問題はないか。そこを見てから掲載します。

フォームはログイン状態だけでなく、シークレットウィンドウでもテストしました。一般の訪問者として入力し、送信し、管理画面に保存されるところまで確認しています。

なお、現在の版には通知メールや自動返信は付けていません。

フォームが正常に送信できることと、メール通知まで届くことは別です。今の運用では、相談が届いているかはWordPressの管理画面で確認します。

サイトができたら、次は実際に「載せてもいいですか」と聞く

ここまででサイトの基本機能は動きました。

でも、品物が0件のままならメディアとしては始まりません。

そこで、実際に紹介できそうな商品を探しました。

最初の候補にしたのは2つです。

一つは、喫茶店で使われていたテーブル。もう一つは、イギリスの学校で使われていたと説明されている木製スツールです。

ただ、由来について分かる情報量は同じではありません。

テーブルには、お店で使われたあと個人宅でも使い続けられた経緯があります。一方、スツールは学校で使われていたという説明はありますが、学校名など詳しい情報までは確認できません。

だから、分からない部分をAIで補ってもっともらしく書くのではなく、確認できた範囲だけを書くことにしました。

最初の掲載相談を2件送った

販売店への相談文もAI社員と一緒に作りました。

お願いしたのは、商品の紹介をさせてもらえるか、販売ページの写真を数点使ってよいか、販売元名と商品ページへのリンクを掲載してよいか、ということです。

了承してもらえれば、まずサンプルページを作り、公開前に確認してもらう流れも伝えました。

今回の掲載に費用や販売手数料はかからないことも明記しています。

最後は私が、それぞれの問い合わせフォームから送信しました。

2026年9月7日時点では2件とも返信待ちです。

ここは重要です。

まだ掲載許可はもらっていません。写真利用の許可もありません。商品も公開していません。当然、販売や集客の成果もまだありません。

今回できたのは、「相談を始められるところまで」です。

AIでサイトを作っても、最後に残るのは人との確認だった

今回、AIを使ったことで、サイトの試作、WordPressテーマ、プラグイン、フォームなどはかなり速く形になりました。

ただし、最後までAIだけで完結したわけではありません。

写真を転載してよいか。

由来は本当か。

フォームが一般訪問者でも動くか。

販売店が掲載を了承してくれるか。

こういう部分は、実際に確認する必要があります。

AIがサイトを作れるようになっても、使ってよい情報かどうかまで自動的に決まるわけではないということです。

今回の結論

今回、「以前使われていた家具や道具を、その由来とともに紹介する」という案を、実際のWordPressサイトまで持っていきました。

ドメインを取得し、既存サーバーへWordPressを設置。専用テーマと掲載管理プラグインを導入。テスト商品を登録し、詳細ページへの反映を確認。掲載相談フォームを一般訪問者として送信し、管理画面への保存も確認しました。

そして最後に、実際の販売店2件へ掲載相談を送りました。

ここまで来て初めて、「作れそうなサイト」から「掲載を始められるサイト」へ変わったと思っています。

次に必要なのは、機能追加ではありません。

まず2件の返事を待つこと。

了承が得られたら、実際の情報だけで紹介ページを作り、販売店に確認してもらうことです。

AI社員実践記は、まだ続きます。

• AI標本木：https://pikoz.net/ai-hyohonboku/
• 一見さんテスト：https://pikoz.net/ichigen-test/
• 新しい取り組み一覧：https://pikoz.net/atarashii-torikumi/
• AI社員実践記：https://pikoz.net/category/ai-jissen/

技術の話はここまで。考え方の話は「社外Web担当の頭の中」へ。