記事の詳細
コピペするだけ!WordPressでプラグインを使うことなくQRコードを貼り付ける方法
天候が不安定のため、どこへ行くにも折り畳み傘を持つようになりました、網干です。
今回は、指定したURLの「QRコード」を生成してページに張り付ける方法を記載します。
今まで私が書いてきた記事と同じように、ショートコード化することで固定ページにも使うことができます。
ショートコード系の関連記事は下記になります
今回のブログの見出しはコチラです!
QRコードとは?
「QRコード」とは、携帯端末にURLやメールアドレスを伝える際に広く使われている二次元コードです。
参考画像は下図になります。
最近は紙媒体の広告でよく見かける画像ですね。
上記の画像の写真を携帯電話で撮ると、弊社のホームページにアクセスできます。
ボタンにタッチする手間を省いてURLが入力できるので、非常に便利なコードになっています。
このQRコードをショートコードだけで張り付けてしまいましょう!
それでは早速「QRコード」を表示するプログラムを紹介します。
functions.phpにQRコード貼り付けのプログラムを組み込む
functions.phpに下記のコードを記述します。
1 2 3 4 5 6 7 8 9 |
// QRコード出力関数 function get_qrcode_tag($atts) { extract(shortcode_atts(array( 'url' => home_url('/'), 'size' => '150', ), $atts)); // イメージタグを返す return '<img src="https://chart.googleapis.com/chart?chs=' . $size . 'x' . $size . '&cht=qr&chl=' . $url . '&choe=UTF-8 " alt="QR Code"/>'; } |
コードの4行目で’url’ => ‘home_url(‘/’)’と指定しているのはサイトのアドレス、
コードの5行目で’size’ => ’150’と指定しているのは表示する画像のピクセルサイズになります。
コードの8行目でGoogle Chart APIのQRコード作成機能を使用してQRコードを作成しています。
上記のコードを実行すると、サイトのホームURLのQRコードを150×150pxの画像で表示できます。
ショートコード化して使ってみる
QRコード作成関数の下に、下記コードを追加します。
1 2 3 4 5 6 |
// QRコード作成関数 function get_qrcode_tag($atts) { ~~略~~ } // 呼び出しの指定 add_shortcode('qrcode', 'get_qrcode_tag'); |
上記のコードを加えることで、固定ページでは下記のコードを記述するだけでQRコードを表示できます。
1 |
[qrcode] |
実際のWordPressの固定ページの編集画面だとこんな感じです。
このように表示されます。
これで、どのページにもQRコードを表示させることが可能になりました。
指定したURLとサイズでQRコードを表示させる
今回作成したQRコード作成関数は、呼び出し側で「URL」と「画像のサイズ」を指定することができます。
例えば、この記事のURLのQRコードを300×300pxの画像で表示したい場合は下記のように指定します。
1 |
[qrcode url="https://incloop.com/プラグインを使うことなくqrコードを貼り付ける/" size="300"] |
上記の指定をすると、デフォルトのパラメータを上記のパラメータに置換して関数を実行します。
C言語からプログラムの道に入った自分としては、なかなか理解しづらい指定の仕方です…
実際のWordPressの固定ページの編集画面だとこんな感じです。
最後に
いかがでしたか?
上記のコードを知るまでは、QRコードは別のサイト様で作成してから貼り付けるようにしていましたが、
そういった手間が無くなりました。
また、今まではページのURLが変わったときにQRコードの画像の貼り替え作業が必要だったのですが、
URLを変更するだけで対処できるようになったので非常に楽になりました。
今回紹介したプログラムの参考にさせていただいたサイト様は下記になります。
・http://kachibito.net/wordpress/useful-shortcode.html
・http://allabout.co.jp/gm/gc/24013/
ではまた!
コメント
この記事へのトラックバックはありません。
この記事へのコメントはありません。