HTMLは「かたまり（セクション）」の集まり

ホームページは、大きな「かたまり」が上から順番に積み重なってできています。多くの場合、この「かたまり」は <section> タグや <div class="content-section"> のようなタグで囲まれています。

例えば、「使い方ガイド」の「お品書きページ」の解説でも、<div class="menu-list-item">...</div> という「かたまり」を丸ごとコピーして貼り付ければ、項目が追加できると解説しています。これと同じ原理です。

セクションをコピー＆ペーストする手順

1. index.html など、編集したいHTMLファイルをVSCodeで開きます。
2. 増やしたい「かたまり」の開始タグ（例：<section id="about">）と、それに対応する終了タグ（</section>）を見つけます。

【VSCodeの便利ワザ】
開始タグ <section ...> の行の左側にある「V」のような矢印をクリックすると、その「かたまり」全体が折りたたまれて1行になります。これで、どこからどこまでが「かたまり」なのかが一目瞭然になります。

3. その「かたまり」のコード（<section ...> から </section> まで）を丸ごと選択してコピーします。
4. 増やしたい場所（例：元の </section> タグの真下）に、そのまま貼り付けます。
5. 新しく貼り付けた方の「かたまり」の中身（見出しや文章、写真など）を、好きな内容に書き換えれば完了です。

【重要】ID名の重複に注意

コピーした「かたまり」に id="about" のように「ID名」がついていた場合、そのまま貼り付けると id="about" というIDがページ内に2つ存在してしまいます。

IDはページ内で絶対に重複してはいけません。

新しく貼り付けた方のIDは、id="voice" のように全く違う名前に変更するか、特にナビゲーションでジャンプする先として使わないのであれば、id="..." の部分ごと削除してしまっても構いません。