画像を使ったページ例

a:20851 t:1 y:3

QHMページで画像を利用したパターン・・・

リンクのマニュアルページは、ＱＨＭプロのメンバー用サイトです。マニュアルを見るには、北研クラブへの登録が必要です。

patern1　添付で画像貼り付ける

画像を表示させたい場所にカーソルを置いて、下方ツールバーのクリップボタンをクリックし、画像の元ファイルをページに添付してください。（元画像のサイズ（横巾）が５5０pxより大きい場合は、画面からはみ出してしまいますので、サイズ調整をしてから添付してください。

画像のサイズ調整は？

私が利用している画像縮小ツール（フリーツール）を紹介します。
必要な方はこちらをクリック　⇒　
こちらから、縮小専用フリーソフトがダウンロードできます（無料）。

縮小専用

patern2　クリックすると拡大。ダウンロードも可

こんなこともできますよ～！

写真	コメント	ダウンロード
	画像をクリックすると拡大しますが、同じウィンドウに表示されているので、「戻る」をクリックしてください
	画像をクリックすると拡大します。ただし、ウィンドウを閉じると、そのままこのサイトも閉じてしまうので、ブラウザの戻るボタンを使用してください。
	拡大画像のターゲットウィンドウを別ウィンドウに指定する方法は、patern3へ
	ここにコメントが書けます
	コメントの改行は自動ですから、改行コードは入れなくても大丈夫です。

★無料版をお使いの方へ

記述方法は、
①編集モードの下方ツールバーから’表’ボタンをクリックする
②画像を表示させたい表の中に（｜　　｜の間に）カーソルを置いて
　下方ツールバーのクリップボタンをクリックして、画像の元ファイルを
　添付してください。（元画像のサイズが５５０pxより大きい場合は、
　簡単アップローダーのプラグイン導入をお勧めします。
③表内に記述されているwikiコードを下記のように書きなおしてください。

＆ref(＊＊＊＊,,50%,画像の説明など);

※　＊＊＊＊は画像のファイル名、５０％というのは、元画像のサムネイル表示のパーセントです。

コードを直接記述する場合は、必ず半角で記述してくださいね。

■ダウンロードボタンの作り方
QHMマニュアルへ>

★無料版をご利用の方へ
①ｆｔｐソフトを使って、QHMがインストールされている同じ階層にpubという名前のフォルダをつくってください。
②pubフォルダの中に、ダウンロード対象のファイルをアップロードしてください。
③ダウンロードボタンを作るページを編集モードにして、ボタンを表示させたい場所に、下記のように記述してください。

＆dlbutton(pub/＊＊＊＊）；
＊＊＊＊はファイルの名前です。

patern3　画像のポップアップ表示。

画像をクリックすると、ポップアップで表示されます。

マニュアルはこちら→ＱＨＭプロマニュアルへ

★無料版ご利用の方へ

簡単画像アップローダーとlightbox2のプラグイン導入が必要です。

記述方法は、

&lightbox2(swfu/d/auto_＊＊＊,画像の説明,group)
＊＊＊は画像ファイル名です。

patern4　画像のスライドショー。

QHMプロのマニュアルはこちらから

★無料版をご利用の方へ
記述方法はこちら。。

#slideshow(400,false,5){{
ｈｔｔｐから始まる画像のフルパス,画像の説明1
ｈｔｔｐから始まる画像のフルパス,画像の説明２
ｈｔｔｐから始まる画像のフルパス,画像の説明３
ｈｔｔｐから始まる画像のフルパス,画像の説明４
・・・・・・・・・・・・つづく
}}

patern5　画像をリンクボタンにする。

画像にリンクをつけることができます。
（バナーなどの貼りつけの際に利用できます。）

①’おまじない’を使う方法

例

書き方はこちら　↓↓↓

[[&attachref(＊＊＊,nolink,画像の説明);>★★★]] 
＊＊＊は画像名を記述。
★★★は内部リンクの場合は、ページ名を記述。
        外部リンクの場合はリンク先ＵＲＬを記述。

patern6　画像をロールオーバーさせる方法。

画像をポイントした時に、別の画像に表示させる方法の紹介です。
クリックするとHOME（トップページ）へジャンプします。

例

書き方は、D++さんのサイトで見つけました。
↓↓↓
http://dpura.web6.jp/dc/index.php?html1_1

通常は、javascriptを使用するかCSSで編集するのが一般的なのですが、QHMでは、画像のパスの記述が結構面倒なので、この小技はスゴイです。

上の書き方の変形で、クリックしたら画像が変わる方法見つけました。

コードはこちら↓↓↓

#html{{
<img src="http://あなたのドメイン/swfu/d/最初に表示する画像の名前"  onclick="this .src='http://あなたのドメイン/swfu/d/クリック後に表示する画像の名前'" />
}}

※ポイントは、画像は、簡単アップローダーでアップロードしておいてください。
（ページへの添付では、表示できないかも・・・）
そして、img src=""の""の中には、画像のプルパスを記述するとうまくいくようです。

■QHMは本当に奥が深いです。さらに研究してもっと簡単で面白い表示方法見つけたいと思います。

時間があったらまた、のぞいてみてください。

QHMナビのトップへ

このページに関するコメントはこちらへ
　↓　↓　↓

選択肢	投票
役に立った	21
まあまあかな？	1
問題外	3

ブログを書くように更新できるWebサイトをQHMで簡単に作れます。