ホームへ
メール
ヘルプ（素材FAQ）
初めてさんはこちらから（案内所）

メインコンテンツ

案内所

素材

テンプレート

素材FAQ

オーダー

掲示板

リンク

タグ辞書

ホーム




素材ＦＡＱ

* windows xpで説明しています。
・素材の保存のしかた（持ち帰りかた）
・素材を保存したいけど、「gif」でなく「bmp」で保存されてしまう
・壁紙の設置のしかた
・バナーの文字入れのしかた
・テーブルの作り方
・ロールオーバーの作り方
・一括ダウンロード（圧縮ファイル）
・インラインフレームの作り方
・自分のサイトで素材が表示されない　



素材の保存のしかた（持ち帰りかた）
  1. 保存したい素材画像にカーソルを合わせる
  2. マウスの右をクリック
  3. 「名前を付けて画像を保存」をクリック
  4. ファイル名を付けて「保存」ボタンをクリック

  • ＊素材を保存してもサーバーにアップ（転送）しないと表示されませんのでご注意！
  • サーバーへのアップのしかたは、googleやyahooなどで検索してみてください。
  • 「FTP、転送、ホームページ」などの語句で検索すれば、見つかると思いますよ。
↑トップへ戻る

素材を保存したいけど、「gif」でなく「bmp」で保存されてしまう
  • 上の「素材の保存のしかた」のとおり行なったけど、bmpに変わってしまう場合
    「スタート」→「コントロールパネル」→「インターネットオプション」→「ファイルの削除」を実行します。
    「ファイルの削除」でも無理なら「履歴のクリア」も実行してみてください。

↑トップへ戻る

壁紙の設置のしかた
  • タグの入力方法↓ご自分のページのソースに入力します。
    <body background="画像ファイル名"></body>
    backgroundは文字通り背景を表します。
    "画像ファイル名"は保存した素材の画像ファイル名をいれてください。
↑トップへ戻る

バナーの文字入れのしかた
  • windows付属のペイントで、説明します。
  1. ペイント画面を出します。　(　「スタート」→「すべてのプログラム」→「アクセサリ」→「ペイント」　）
  2. 「ファイル」をクリックし「開く」→画像(バナー)を選び→「開く」
  3. キャンバスに画像が出るので文字を入れます。
  4. 文字を入れたら「ファイル」→「名前を付けて保存」→名前をつけて「保存」◇うまく出来ない方はこちらで文字入れしますよ。詳しくはオーダーまで。。。
↑トップへ戻る

テーブルの作り方
←基本は縦３横３の表に画像を貼り付けます。
←表の枠・罫線・セル余白は全て０（無し）にします。
　　出来上がり。
  • タグでの入力方法
<TABLE border="0" cellpadding="0" cellspacing="0">
<TR>
<TD><IMG src="左上の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
<TD><IMG src="中上の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
<TD><IMG src="右上の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
</TR>
<TR>
<TD><IMG src="左中の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
<TD>●</TD>
<TD><IMG src="右中の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
</TR>
<TR>
<TD><IMG src="左下の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
<TD><IMG src="中下の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
<TD><IMG src="右下の画像名" width="画像の幅" height="画像の高さ" border="0"></TD>
</TR>
</TABLE>
●＝ここは表の真ん中部分です。文章や、写真など入れてください。
↓　上の葉っぱのテーブルのタグです。
右クリック「すべて選択」→右クリック「コピー」→ソースに貼り付ける。
  • <body>から</body>の間に入れます。
  • 画像を保存してから使ってくださいね。
↑トップへ戻る

ロールオーバーの作り方
  • 画像に変化をつけたい時などに使います。←カーソルを乗せてみてください。

    【ロールオーバーの基本】
    2枚の画像を使います。（ここではとを使っています。）

  • タグでの入力方法
<A href="リンク先URL">
<img src="最初に表示する画像名"
; onmouseover="this.src='カーソルが乗った時に表示する画像名'"
; onmouseout="this.src='カーソルが離れた時に表示する画像名'">
</A>
↓　上のメールのロールオーバータグです。＊２００６　２月１０日訂正　
右クリック「すべて選択」→右クリック「コピー」→ソースに貼り付ける。
  • <body>から</body>の間に入れます。
  • 画像を保存してから使ってくださいね。（画像を保存して、サーバーにアップしないとないと表示されませんよ。）
↑トップへ戻る

一括ダウンロード
  • ボタンやテーブルなど画像数が多い素材は、一括でダウンロード出来るように
    zipというファイルに圧縮して保存してあります。
    ここでは一括ダウンロードと解凍のしかたを説明します。

  1. まず「一括ダウンロード」をクリックしてみてください。
  2. するとファイルを「開く」か「保存」か聞いてきますので「保存」を選び、
    ファイル名を付けてください。
    （保存する場所は、他の素材を保存してある場所と同じ場所に指定しましょう。）
    　【次に保存したzipファイルを解凍します。解凍ソフト＋Lhacaの場合】
  3. 保存したzipファイルのアイコンを＋Lhacaのアイコンへドラッグすれば
    解凍できます。
  • 解凍ソフトをお持ちでない方はコチラ→＋Lhaca（フリーソフト）で取得できます。
↑トップへ戻る

インラインフレームの作り方
  • インラインフレームとは、ページの中に他のページを表示する場合に使うフレームです。（アイフレームとも言います。）
    ここでは、画像テーブル（表）を使ったインラインフレームの設置の手順を説明します。
    サンプル

  1. まず、テーブルを作ります。縦横３つのテーブルを作ります。
    （解りやすいように枠と数字をつけています。）
１ ２ ３
４ ５ ６
７ ８ ９

  1. 真ん中の５の部分にインラインフレームを設置します。 　
    （５の部分のソースに<IFRAME src="ooooxxx〜></IFRAME>を入れる。）
１ ２ ３
４ ５ ６
７ ８ ９

  1. 真ん中の５以外１から９の部分に画像を入れます。
    （上の方にあるテーブルの作り方と同じです。）

５

手順は以上です。
◆テーブルを使ったインラインフレームのソース
↓をコピーして画像部分とフレーム部分を変更して使ってください。
＊変更箇所
　<IMG src="画像ファイル名" width="画像の幅" height="画像の長さ" border="0">
<IFRAME src="ここに表示させたいページのＵＲＬをいれます。
　　"width="フレームの幅" height="フレームの長さ">
↑トップへ戻る

自分のサイトで素材が表示されない
  • 「自分のサイトで素材が表示されないのですが…。」というメールを時々いただきます。
    「素材の保存のしかた」をまず読んでみてください。

    ◆マウスの右をクリックして必ず「名前をつけて画像を保存」を選び保存します。（＊間違えて「コピー」を選ばないように…。）
    それからサーバーにアップします。（＊HTMLファイルと画像ファイルを同じフォルダーに入れておきましょう。）
    これで表示されるはずです。

    ◆あと、表示されない理由として、「直リンク」があります。（略して「直リン」ともいう）
    直リンクとは、自分のサイトで表示する画像を他サイト（他人のサイト）から直に表示させるというもので、サーバーに負担がかかるため、多くのサイトで禁止されています。
    私が借りているサーバーも直リン禁止で、直リンしていれば画像が表示されないようになっています。

    ◆直リンクしているか調べてみましょう。
    まず、あなたのサイトの画像にカーソルを合わせ、右クリックで「プロパティ」を選びます。アドレス（ＵＲＬ）の部分が「http://melly.gozaru.jp/ＯＯＯ.gif」となっていませんか？
    http://melly.gozaru.jp　は、素材屋めりーのサイトですので、このアドレスから始まっている画像は直リンしていることになります。
    もし、アドレスが　http://あなたのサイトアドレス…から始まっていればそれは直リンではありません。

    ◆直リンクについて詳しく知りたい。
    　←こちらで勉強しましょう。解りやすく説明してくれています。
↑トップへ戻る


↑トップへ戻る


↑トップへ戻る