現在開いているURLのQRコードを自動生成。ブロックで配置する。
ただし商品詳細ページでは、ブロック配置ではなく、テンプレートをインクルードする。
1 下記より、jQueryプラグイン「jquery.MyQRCode.js」をダウンロードし、■html/js/jquery.myqrcodeフォルダに置く。
http://www.kfsoft.info/MyQRCode/demo.php
(1) デフォルトでは、下記設定になっている。(jquery.MyQRCode.jsに記述あり)
//default values jQuery.fn.MyQRCode.defaults = { encoding:"UTF-8", content: window.location, size:"150x150" };
(2) オプションをscriptで記述することで変更する。
<script type="text/javascript"> $(function(){ $("#qrcode").MyQRCode({ size:"111x111" }); }); </script>
(3) QRコード化するデータ
「content: window.location」は、現在開いているページ。
固定するのであれば、「content:’PHP & JavaScript Room\nhttp://○○○.com/’」
(4) 画像サイズ
サイズ指定を行っても、QRコード自体の大きさがピクセル単位で変わるのではなく、周りの余白が調整されて、全体として指定したサイズになる。
さらに、定かではないが、QRコード化したデータの量でQRコード自体の大きさが変わるようである。
下記の範囲内では、QRコード自体の大きさは変わらなかった。ただし、これもQRコードのデータ量によるのかも・・・。(下図参照)
実際、トップページと商品一覧ページに表示した際、大きさが変わった。
size:”111×111″~size:”147×147″
size:”80×80″~size:”110×110