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

画像を使ったページ例

Add to Google
a:16397 t:4 y:1

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

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


patern1 添付で画像貼り付ける

QHMマニュアルはこちらから

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

画像のサイズ調整は?

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

縮小専用



nolink,こんにちは nolink,ねむいよ~ nolink,ふわふわ大好き! 


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


こんなこともできますよ~!

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


★無料版をお使いの方へ

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

&ref(****,,50%,画像の説明など);

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

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



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

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

&dlbutton(pub/****);
****はファイルの名前です。


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

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

マニュアルはこちら→QHMプロマニュアルへ

画像の説明 画像の説明

画像の説明 画像の説明

★無料版ご利用の方へ

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

記述方法は、

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


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



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

画像の説明1 画像の説明2 画像の説明3 画像の説明4

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

#slideshow(400,false,5){{
httpから始まる画像のフルパス,画像の説明1
httpから始まる画像のフルパス,画像の説明2
httpから始まる画像のフルパス,画像の説明3
httpから始まる画像のフルパス,画像の説明4
・・・・・・・・・・・・つづく
}}

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

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

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

画像の説明 画像の説明 画像の説明 画像の説明 画像の説明


書き方はこちら ↓↓↓

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


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は本当に奥が深いです。さらに研究してもっと簡単で面白い表示方法見つけたいと思います。

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

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

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