チャットするだけで新しいページを追加してメニューに載せる

サイトを運営していると、最初はなかったページが必要になることがあります。たとえばイベント、ケータリング、料金表、よくある質問などです。WordPress では、ページを作成し、レイアウトを組み、さらにメニュー設定を開いてリンクを追加する必要があります。ShipPress なら、チャットで一度伝えるだけです。このチュートリアルでは、Pier 7 Coffee に Private Events ページを追加してトップメニューに載せ、うまく表示されなかった1か所を直します。

まずメニューを確認しましょう

ShipPress でサイトを開き、プレビューのトップメニューを見てください。Pier 7 Coffee には Lots、Bar、Roastery、People、Journal、Visit があります。新しいページの名前、メニューに表示する文言、置く場所を決めましょう。メニューの文言は、ページのタイトルそのままより短いほうが読みやすくなります。

変更前のトップメニュー：リンクは6つです。
1通のメッセージでページを説明します
左下のチャット欄をクリックして、ウェブサイトを作っている友人に説明するつもりで、やりたいことを書きましょう。次の内容を同じメッセージに入れてください。
- ページ名：ここでは「Private Events」です。
- 載せたい内容：誰向けか、いつか、何人までか。
- 見た目：「ほかのページと同じスタイル」にすることと、使う写真。
- 連絡方法：私は「バーで声をかけるか、お電話ください（フォームなし）」と書きました。これで AI が問い合わせフォームを勝手に追加しません。
- メニュー：表示する文言と場所。ここでは「Events」を Roastery と People の間にします。
Enter キーを押して送信します。
1通のメッセージで、ページ、内容、見た目、メニューでの位置を伝えます。
AI にページを作ってもらいます

AI はこれから何をするかを説明し（ここでは、Cupping & Classes と同じレイアウトでバーの写真を使ってページを作り、そのあとメニューリンクを追加する、という内容です）、作業を始めます。Worked · N steps の行を開くと、各ステップを確認できます。途中で別のことを思いついたら、そのまま入力を続けてください。次のメッセージは、今の作業が終わりしだい送られます。
Pier 7 Coffee では約1分半かかりました。AI が返信を書き終える前に、新しいメニューリンクがプレビューに表示されました。

作業中は各ステップが見え、入力を続けることもできます。
AI がしたことを読みます

作業が終わると、AI が変更内容をまとめてくれます。ページが公開されたこと、「Events」がトップメニューの Roastery と People の間に入ったこと、ページにバーの写真が使われたこと、予約の案内に Visit ページの電話番号が使われたことなどです。まとめの下には、次のおすすめの操作としてボタンが並びます。たとえば See what changed や Mention events on the Visit page です。やりたいことに合うものがあればクリックし、なければ自分でメッセージを入力しましょう。

まとめで変更内容が分かり、その下に次のおすすめの操作が表示されます。
新しいページを開いて確認します

プレビューのメニューで Events をクリックします。実際のサイトと同じように、新しいページが開きます。訪問者になったつもりで読んでみましょう。文章は合っていますか？サイトのほかの部分と同じ見た目になっていますか？
ここでは文章は合っていましたが、見た目が少し違いました。写真の上に余分な「Private Events」のタイトルがあり、写真と文章が細い列に収まっていたのです。ほかのページは、幅いっぱいの写真から始まっています。

最初のバージョン：内容は合っていますが、余分なタイトルと細い写真があります。
合わない部分を、ふつうの言葉で直します

見えたことを伝え、すでにきれいに見えているページを例に挙げましょう。私は次のように書きました。「Private Events ページがまだほかのページと合っていません。写真の上に余分なタイトルがあり、写真と文章が細い列に入っています。People ページと同じ見た目にしてください。余分なタイトルはなし、上部は幅いっぱいの写真、その下の文章は同じ幅にします。」
1分もかからないうちに、ページの上部が People と同じ幅いっぱいの形になり、写真の上にページ名と紹介文が表示されました。

すでにきれいに見えるページの名前を挙げると、AI は目標をはっきり理解できます。

修正後：幅いっぱいの写真で、余分なタイトルはありません。
ページ全体と Phone での表示を確認します

ページを下にスクロールしてみましょう。Pier 7 Coffee のイベントページは、3つの質問（どんなイベントか、いつ予約できるか、どう予約するか）に答え、最後に予約の案内と、来店を計画するためのリンクがあります。
次に、プレビュー右上の Phone をクリックして、MENU を開きます。Events も同じ位置にあります。ほとんどの訪問者は新しいページをスマートフォンで見るので、この確認は10秒かける価値があります。（詳しくは Computer、Laptop、Tablet、Phone でサイトを確認するをご覧ください。）

ページの残りの部分：3つの短い答えと予約方法です。

Phone での表示：ページと、メニューの Events です。
あとで見つける、または元に戻す

新しいページは、ふつうの WordPress のページです。プレビュー左上のページメニューに表示されるので、いつでもそこから移動できます。Dashboard の Pages にも表示されます。
AI が変更を行うたびに、復元ポイントも保存されます。上部バーの History をクリックすると、ページの追加とレイアウトの修正という2つのステップが表示されます。結果が気に入らないときは、その前の時点の横にある Restore をクリックしてください。

新しいページはページ一覧にあります。

各ステップが History の復元ポイントになります。
ヒント
- メニューリンクを置く場所を伝えましょう（「Roastery と People の間」「いちばん最後」など）。伝えないと、AI が場所を選びます。
- メニューの文言は短く、ページのタイトルは長めでも大丈夫です。たとえば「Events」と「Private Events」のようにします。
- 問い合わせフォームが不要なら、そう伝えましょう。必要な場合は、メッセージを誰が受け取るかも伝えてください。
- どこかおかしいと感じたら、きれいに見えているページの名前を挙げましょう（「People ページと同じ見た目にして」）。レイアウトを説明するより分かりやすく伝わります。
- お礼ページのように、メニューに載せたくないページには、「メニューには追加しないで」と伝えるだけで大丈夫です。
- チャットで編集する方法について詳しくは、チャットでサイトを編集するをご覧ください。変更を元に戻すには、復元ポイントで AI の変更を元に戻すをご覧ください。