コードエディターはどこ？ブロックエディターの使い方を、生成AIのChatGPTで習得する

使える場面、状況の想定

はじめてWordPressを使う方や、クラシックエディター（旧エディタ）からブロックエディターに乗り換えたとき、HTMLコードを直接編集したいのに、管理画面上で「切り替えボタンが見当たらない、コードエディターの表示はどこ？」と、迷ってしまった場面を想定しています。

コードエディターは、部分的なデザインやレイアウト調整のために、特定のブロックのHTML構造を確認・変更するのに大変便利な機能です。

まずは、AIに「画像」を見せて現状共有。解決を早める！最速スクリーンショット活用術を参考に、管理画面（投稿記事や固定ページの編集画面）のスクリーンショットを準備してください。
ブロックエディターの画像をAIのチャット欄に貼り付けて、目的の操作手順や設定方法をChatGPTに解説してもらいましょう。

【スクショ画像】

解決プロンプト（質問）

AI・ChatGPTの回答例

ポイント解説

このAIプロンプトは、コードエディターの場所に限らず、ブロックエディターの操作・設定方法、基本的な使い方全般に広く応用できますので、ぜひ以下のテクニックも合わせてマスターしてください。
➡ WordPressのブロックエディタの使い方・操作方法をAIに質問してみる

AI・ChatGPTからの回答の最後に「画像で指し示しながら説明したほうが分かりやすければ、該当ボタンの位置に印を付けた画像も作れます。」という提案があったので、続きのプロンプトで「それでは、画像の作成をお願いします。」とだけ入力してみました。

出力された画像が以下です。

驚くほど完璧な出力結果ですね。
もしかすると、もう人間より丁寧なサポートを受けられるのかもしれません。

注意点

このAIの回答例は、出来るだけデフォルト設定に近いChatGPTの応答をシミュレーションしています。生成AIは、これまでの会話の履歴やパーソナライズ設定によって、ユーザーごとに異なる反応をするということを覚えておいてください。

また、コードエディターを用いる際の注意点としては、もともとビジュアルエディター（ブロックエディターの標準編集画面）で作ったページのコードを直接編集すると、表示崩れが発生するリスクがあるという点です。
元のHTMLコードをバックアップし、リビジョン機能を用いながら、安全に修正作業を行うようにしてください。