How to Add QR Code to your Post in WordPress

Now you can Add QR Code to your Post as there are many plugins can do that work but i will tell short and simple code that will not require plugin. QR Code (Quick Response Code) is a type of matrix barcode (or two-dimensional bar code). You will get know About Go HERE http://en.wikipedia.org/wiki/QR_code. It can be read by any phone having application of QR/Bar Code Reader. You can Generate Own QR COde Go Here

In This We Use jQuery & its plugin qrcode(by larsjung) to generate QR Code dynamically by getting Current URL.
Just Follow the Steps:-

  • First login to your WordPress
  • Then go to Appearance -> Editor
  • Then Select Single Post or single.php from Sidebar
  • Then search for div class=”entry” by press Ctrl+F & paste it.
  • Then Under div you will find ‘<?php the_content(…’ it end with ?> if you didn’t find any of those then search for content keyword then within code you will find for keyword content.
  • IF you want to Place QR Code Before Post Content then Paste Below Code Above that code(i.e. content) or wanna After the Content then Paste After that code(i.e. content).
  • Code:-

 HTML |  copy code |? 
01
02
<div id="qrresult"></div>
03
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
04
<script type="text/javascript" src="http://tools.aashuzone.com/cdn/jqueryqrcode.js"></script>
05
<script type="text/javascript">
06
$(function(){
07
url = $(location).attr('href');$('#qrresult').css('padding','2em');
08
$('#qrresult').before('<b><i>QR CODE of <a href="'+url+'">'+url+'</a></i></b> <br/>');
09
$('#qrresult').qrcode({
10
		width: 150,
11
		height: 150,
12
		color: 'black',
13
		text: url});
14
});
15
</script>
16

  • You can Replace QR CODE[8th line] to Your Text[or HTML] that appear before QR Code.

  • Just Paste and Click on Update
  • Now Check It Will Shown at Every Single Post After/Before the Content.
  • You can Use this Code Anywhere[Blogger, WordPress, Other Website] and it will automatically generate QR Code of that URL and shown to you!
  • If you require Any related to finding or setting up according to your theme then Please Comment or Contact

Short URL: http://is.gd/ulICYU
QR Code For This Post:

Filed Under: BloggingJavaScriptTricksWordpress

Tags:


About the Author: I [Arshpreet Wadehra] am a Engineering Student of Computer Science. I also have interest in Web Designing. Have Good knowledge of Computer Language C++, PHP, jQuery, HTML5, CSS3. Still learning new languages. I like to share knowledge with others, so i create this Blog.

RSSComments (0)

Trackback URL

Leave a Reply




If you want a picture to show with your comment, go get a Gravatar.

Free Web Hosting