ホームページビルダー14・13・12・11 使い方解説


スクリプトの挿入には、ビルダーの機能を使う場合と、配布サイトからコピーする方法があります。自分の気に入ったスクリプトがビルダー内に無い場合は、配布から探すしかありません。ここでは配布サイトからのスクリプトの挿入の1例を先に紹介します。 

JAVAスクリプト

配布サイトより使用したいスクリプトのソースをメモ帳などにコピーをする。
サイトの指示に従い記述(スクリプトの挿入)場所を確認。
・設定だけのスクリプト(リンクに触れると下線を出す等)の場合は、<HEAD></HEAD>の中に記述しますので、もし何も指示がなければそうしてください。
・ページ上にスクリプトを形として表示させるもの(時計など)の場合は<BODY></BODY>の中に記述します。
ページ編集画面でHTMLソースを開く。するとたいてい以下のようになっていますので、下記を参考に貼り付けてください。<BODY>内のスクリプトがある場所には、編集画面の時だけ{S}のマークが付きます。

通常は<HEAD>と</HEAD>の間にスクリプトの記述をします。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META
http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META
name="GENERATOR" content="IBM WebSphere Studio Homepage Builder Version 8.0.0.0 for Windows">
<META
http-equiv="Content-Style-Type" content="text/css">
<TITLE></TITLE>
<SCRIPT Language='JavaScript'>
・・・・・・・・・設定だけのスクリプトの場合この位置・・・・・・・
</SCRIPT>
</HEAD>

<BODY>
<SCRIPT Language='JavaScript'>
・・・・・ページ上に表すスクリプトの場合この位置・・・・・・・
</SCRIPT>

</BODY>

JavaScript の記述 ソースが2つ(以上)の場合
スクリプトによっては2つのソースを必要とするもの(下にある日付付きの時計など)があります。サイトの指示に従い位置を確認してください。
スクリプトを挿入します。1つは<HEAD></HEAD>の中にもう一つは<BODY></BODY>の中に記述します。
<BODY>間に記述したスクリプトは、そのままブラウザに反映されますので、位置が問題となります。その場合、表を作成しその中に記述すると好きな所に表示できます。表の中に記述する方法は下記で確認してください。

 「5・6年生にもわかるやさしいJava」から

JavaScript の記述  表中に記述する 
1 時計を表記したい場所に表を作成する。
2 表の中にカーソルを当て、入力状態にする。
3 HTMLソースを開く。何故ソースを開くの?=編集画面で、ビルダーの挿入機能を使わずに直接表中に貼り付けると↓風になり、ただの文字としか認識されませんので使えません。
× <SCRIPT language="JavaScript"><!--/ ここはプログラムが記述されます / --></SCRIPT>
4 ソースを開くと、<TD></TD>このように点滅している場所を確認し、コピーしたソースを貼り付けます。
5 プレビューウィンドウで見ると、表の中に表示したいスクリプトが現れているはずです。
6 フォームが挿入され表の高さが編集画面とプレビューでは違って見えることがあります。レイアウト上小さくしたい場合は、表の中を右クリックし、メニューから「スタイルの変更」→次のメニューの上の「タグ」に「FORM」となっているのを確認し、2つある編集ボタンのうち下の編集(4)のボタンを押します。
7 次のメニューの「レイアウト」をクリック→マージン(A)の値を右側のプルダウンメニューから「ピクセルかcm」を選択し値から「0」を選択してください。OK→OKで終了です。変更後のようになります。
8 出来上がった表に色を付ける場合は、表の作成を参照してください。
注意 1行表の場合、表作成編を実行しても「セル」という表示が現れない場合があります。上2つのように2行であれば上行からドラッグして「セル」を呼び出せますが、1行ではできません。その場合は、7で選択した「レイアウト」の代わりに「カラーと背景」を選び「背景色」で色を変更してください。ちなみに「前景色」は文字色となります。

変更前

変更後

罫線の幅::1 セル内の余白:1 枠線の表示:なし 表の色:グリーン セルの色(背景色):グレー

JavaScript の記述  ビルダーを使う・・この方が簡単です。 
1 スクリプトを用意する。(配布サイト)
2 ソースをコピーする。この際コピーをする範囲は今までと違います。赤い文字の部分です。ビルダー機能で挿入する場合は既に青文字は用意されていますので、 <!--//-->の間の赤い部分をコピーしましょう。
<SCRIPT LANGUAGE="JavaScript">
<!
--
var mes3="";
var i=0;
setTimeout("msg3()",2000);
}

//-->
</SCRIPT>
 <HEAD>間にスクリプトを挿入する場合。
3 メニューバーの「編集」→「属性の変更」→一番上のメニューから「ページのプロパティー」を選択。
4 「その他」→「スクリプトの編集」をクリック。編集画面右下に下記の部分がありますので、赤字の部分を消去し、コピーしておいたソースを貼り付けましょう。右上の窓を確認してください。<HEAD>の下、<BODY>の上に//左の・・・があるはずです。
5 <!--
// 左のウィンドウからアイテムをドラッグして
// ここにドロップするか、マウスの右ボタン
// でポップアップ メニューを出して「スクリプト
// に挿入」を選択して、現在のカーソル位置に
// コードを挿入します。

//-->
<BODY>間にスクリプトを挿入する場合。
1
スクリプトを挿入した場所にカーソルを当てます。
2 メニューバーの「挿入」→一番下の「その他」→上部の「Sclipt]をクリック。
3
上記5と同じ画面ですが、上の窓を確認してください。今度は<HEAD>が無く、<BODY>の下に//左の・・・があるはずです。後は先と同じ作業です。
お疲れ様でした。

ページのTOP



Copyright (C) 2004 Web-Creation All Rights Reserved.