手順１：拡大される画像を表示したいページのヘッダー
（</head>の真上）に、下記のソースを入れる。
↑ソースが長かったので、枠に入れました。
上記の枠内のソースをすべてコピーして、ヘッダーに貼り付けてください。
|
【注意】
ソースを入れるページは、拡大される画像を表示したいページです。
そして、ソースを入れる場所は、ヘッダーの中で、</head>の真上に入れます。
ソースを入れる場所については、十分、注意してください。
（ヘッダーの中に入れないと、動かないです）
手順２：拡大される画像を表示したい箇所に、下記のソースを入れる。
|
<a href="gazou1.jpg" data-lightbox="group"><img src="gazou1.jpg" width="300"></a>
|
上記のソースを使うときは、「画像のファイル名」を２ヵ所、変更してください。
現在は、「gazou1.jpg」にしていますけど、この画像のファイル名を、表示させたいファイル名に変更する、という形ですね。
なお、ホームページ上に表示する画像の大きさ（横幅）は、「width="300"」と指定していますが、この数字も、自由に変更することができます。
【注意】
「自分で更新できる最短ホームページテンプレート」 をお使いの場合は、
HTMLファイル（index.htmlファイルなど）と同じ場所に、画像を保存するようにしてください。
手順３：実際に画像をクリックして、確かめてみよう。
画像をクリックして、その場で拡大画像がポップアップで表示されることを確認してみてください。
拡大画像が表示されたら、作業は完了です。
