個別記事のページです

2015年9月14日(月)
このエントリーをはてなブックマークに追加

ホームページのQRコードを表示する

パソコンでいろんなホームページを見ているときに
ちょっと出かけ先で確認したい時は
スマホや携帯で見るときがありますよね。

QRコードのあるページ

そんなとき、最近ではソーシャルボタン(SNSなどのFacebook, twitter, LINE)で共有したりしますが
QRコードがあるとSNSがなくとも手軽に
スマホや携帯で見ることができます!

ホームページにQRコードを掲載する方法を説明します。
(HTMLの知識が少し必要です)


下記のコードをお持ちのホームページのhtmlに記載してください。
----------------------------
<img src="https://chart.googleapis.com/chart?cht=qr&chs=横幅x縦幅&chco=色&chl=ホームページのURL" alt="URLの説明" />
----------------------------
※altは任意です
※日本語の個所5個所はお好きなものを設定してください

例えば、弊社のホームページのQRコードだとこんな感じです。
ホームページ制作F

<img src="https://chart.googleapis.com/chart?cht=qr&chs=200x200&chco=000000&chl=https://www.web-f.net/" alt="ホームページ制作F" />

・横幅 200
・縦幅 200
・色(カラーコード) 000000 (黒)
・ホームページのURL https://www.web-f.net/
・URLの説明 ホームページ制作F
を設定しました!
この1行でQRコードが設置できます!

これはGoogleが提供している「Google APIs」というサービスを使っています。
※Googleへの登録はいりません。

☆応用編☆
wordpressでも同様にこのコードが使えます。
特定の、投稿ページ・固定ページの記事のみに表示する場合は、上記の方法で、テキストにて記載してください。
投稿・固定記事すべてに付ける場合は、「外観」→「テーマの編集」でshingle.phpなどに下記コードを記載してください。
----------------------------
<img src="https://chart.googleapis.com/chart?cht=qr&chs=200x200&chco=000000&chl=<?php the_permalink(); ?>" alt=<?php the_title(); ?>">
----------------------------

みなさんも是非設置してページの紹介に役立ててくださいね!

書籍の内容と遜色のないPDFを無料プレゼントしております。
売れてる人しか知らない!売れるホームページの10の常識
過度な営業は一切しておりません。
お問合せ