Top > デザインの変更 > QRコード

 

QRコード

フリーソフト
QRWindow
http://www.qrcode.org/index.html

URLを入力すると、自動的にQRコードを作成してくれる、とてもありがたいソフトを無料で配布して下さっています。

動作は
・Windows98/Me/2000/XP/Vistaで動作。
・NTT DoCoMo、au、vodafoneに対応。
・アドレス帳、Eメール、ブックマークに対応。
・カラーQRコードに対応。
・数秒間に数百枚のビットマップファイルを出力。

詳しく上記のページでご確認下さい。


というわけで、作成したQRコードを使って、レイアウト可能なブロックを作りたいと思います。

分かりやすくするため色をどぎつくしてあります。実際には白バックでフチ取りも目立たない色がよいかと・・

WEB管理画面>デザイン管理>ブロック設定
で、「新規ブロック作成」します。

 

出来上がったブロックは
WEB管理画面>デザイン管理> レイアウト設定
で、表示させたい場所にドラッグして移動します。

QRコード 例

パッチワークギルドQRコード
パッチワークギルド
モバイルサイト
QRコード

<div style="float:left;">
<table width="100%" border="5" bordercolor="#FF3300">
<tr>
<td bgcolor="#663399"><p align="center"> <a href="http://www.tokihouse.com/cube/"><img src="http://www.tokihouse.com/cube/image/mobile_qr.gif" alt="パッチワークギルドQRコード" style=" width="100" height="100" border="0"/><br></a>
パッチワークギルド<br>
モバイルサイト<br>
QRコード
</p>
</td>
</tr>
</table>


カラム巾一杯にテーブルを作り、その真ん中にQRコードと文字が入るようにしました。
文字が必要ないようでしたら

フチドリの色、太さ背景色を自由に指定
フチドリが入らない場合は border="1"  を削除して下さい。
ブルーの部分を画像の場所と、リンクさせたいURLに書き換えて下さい。
<br>は改行マークです。
<div style="float:left;">回り込み防止のため記述

パッチワークギルド<br>
モバイルサイト<br>
QRコード
</p>

この部分を削除して下さい。

バックを白(#FFFFFF)にしてボーダーを消すと、真ん中にQRコードが配置されているように見えます。

Top > デザインの変更 > QRコード