BlueGriffon(ブルーグリフォン)でトップページ以外のページ(リンク)作成

今回は、BlueGriffon(ブルーグリフォン)で、ホームページの
最大の特徴とも言える「リンク機能」について図解入りで
解説していきたいと思います。

bgri2

「sample.html」でトップページ以外のファイルを構成する

テンプレートをダウンロードした際の「src」フォルダの中に、「sample.html」というファイルがあったと思いますが、

bgri3

この「sample.html」はトップページ以外のページを作成する際の雛形として用います。

なので、トップページ以外のページを5つ作成する場合は、この「sample.html」をコピーして名前を変更して使います。

bgri5

ここでは、「sample1」~「sample5」までのファイルを複製しました。

bgri4

これでファイルが増えました。次に、BlueGriffon(ブルーグリフォン)でリンクページに設定するページを作っていきます。

「sample1」のページをページ内容に合わせて編集します。
編集方法は、トップページで編集した方法と同じです。

メニュー⇒「ファイル」⇒「開く」を選択します。

「sample1」を選択し、BlueGriffon(ブルーグリフォン)に読み込みます。

bgri7

ここで、個別ページで作りたい内容に編集していきます。

bgri6

内容の編集が終わったら、メニュー⇒「ページのプロパティ」を選択し、
タイトルを変更しておきます。

bgri8

これで一旦、保存をしておきます。

トップページから他のページへリンクを作成する

BlueGriffon(ブルーグリフォン)でトップページを開きます。
では、ここから下の画像の「MENU1」の部分にリンクを作成していきます。

bgri9

まず、リンクを作成したい部分をダブルクリックします。

bgri10

「リンク」のダイアログが開きますので、「対象」欄に「sample1.html」と入力します。

2014-01-23_153038これで、MENU1に「sample1.html」のファイルをリンクさせることが出来ました。

ブラウザで開いて確認してみましょう。

bgri1123

トップページのMENU1をクリックすると、サンプル1のページへジャンプすればOKです。

bgti124

赤枠をクリックすると、

bgri43

サンプル1のページへジャンプする。

 

この作業を作りたいページ数に合わせて反復作業をしていきます。

 

コメントを残す