新しい記事ページを作る手順

このページでは、新しい記事ページを作るところを詳しく説明します。まだ記事一覧への追加やリンク確認には進まず、まずは記事ページ本体を作る流れを確認します。

記事テンプレートを使う

このプロジェクトには、記事追加用の article-template.html があります。新しい記事を作るときは、このテンプレートを複製して、タイトル、説明文、カテゴリー、画像、本文を入れ替えます。

入れ替える場所

初心者向けの記事では、いきなり詳しい説明に入らず、最初に「この記事で何がわかるか」を書くと読みやすくなります。

1記事の目的を決める

↓

2読者の悩みを書き出す

↓

3目次を作る

↓

4本文を書く

↓

5画像や図解を入れる

↓

✓まとめを書く

まず、新しい記事ページを作成します。

HTMLでブログを作っている場合は、新しいHTMLファイルを1つ作ります。

例：

ai-blog-beginner-learning-record.html
chatgpt-beginner-screen-guide.html
codex-prompt-guide.html

記事ファイル名は、日本語や空白を使わず、英数字とハイフンで分かりやすく付けると安全です。

例：

chatgpt-beginner-guide.html

日本語名や空白入りのファイル名は、リンクミスや表示トラブルの原因になることがあります。

記事が増えてくると、どのHTMLファイルがどの記事なのか分からなくなりやすいです。そのため、最初からファイル名のルールを決めておくと、あとから整理しやすくなります。

画像を使う場合は、画像ファイル本体の保存場所と、HTMLに書く画像パスを合わせることが大切です。

たとえば画像を images フォルダに入れるなら、HTMLの src もその保存場所と合うように書きます。

画像パスやリンクの詳しい確認は、表示確認のページで説明しています。

新しい記事ページをCodexに作ってもらう場合は、どんな記事を作るのか、ファイル名をどうするのか、既存ページを壊さないことをはっきり伝えると安全です。

プロンプト例は別ページにまとめています。