{"id":1310,"date":"2020-01-30T22:24:07","date_gmt":"2020-01-30T22:24:07","guid":{"rendered":"http:\/\/www.appsgeyser.com\/blog\/?p=1310"},"modified":"2021-10-27T09:21:05","modified_gmt":"2021-10-27T09:21:05","slug":"put-your-apps-qr-code-on-your-website","status":"publish","type":"post","link":"https:\/\/appsgeyser.com\/blog\/put-your-apps-qr-code-on-your-website\/","title":{"rendered":"Put Your App&#8217;s QR Code on Your Website"},"content":{"rendered":"\n<p>Before I start, I just want to point out that putting a QR code on a website is only useful if the content provided for mobile is somehow different from the content on the website. Think that your reader is already on your site. They don&#8217;t really need help getting to the site. On the other hand, if you have an app, and you want your website users to take your app on the go, then giving them the code on their screen can be helpful.<\/p>\n\n\n\n<p>Remember that if they&#8217;re viewing the site on their phone, the QR code can&#8217;t be scanned! To avoid this problem, turn the QR code into a link to the site it links to. That way, clicking on the QR code will give users nearly the same experience as scanning the QR code. (I&#8217;ll explain how to do this in steps 8 and 9, below)<\/p>\n\n\n\n<p>Let me explain how to do this. There are a few ways of doing it. I&#8217;m going to use the easiest one. The instructions I&#8217;m giving here are for Blogger specifically, but the idea is similar for any type of website.<\/p>\n\n\n\n<p>1. Go to your <a href=\"https:\/\/appsgeyser.com\/dashboard\/\">AppsGeyser Dashboard<\/a>.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-1-go-to-appsgeyser-dashboard.jpg\"><img  width=\"600\" height=\"567\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-1-go-to-appsgeyser-dashboard.jpg\" alt=\"go to appsgeyser dashboard\" class=\"wp-image-1311\" title=\"step 1 - go to appsgeyser dashboard\"\/><\/a><\/figure><\/div>\n\n\n\n<p>2. Click <strong>Test Your App<\/strong><\/p>\n\n\n\n<p>3. Go to the QR code on this page and hover on it with your mouse, then click the right mouse button.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-3-right-click-on-the-QR-code.jpg\"><img  width=\"600\" height=\"550\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-3-right-click-on-the-QR-code.jpg\" alt=\"right-click on the QR code\" class=\"wp-image-1312\" title=\"step 3 - right-click on the QR code\"\/><\/a><\/figure><\/div>\n\n\n\n<p>4. Select <strong>Save Image As<\/strong>. Remember where you save the image. Do not close the Dashboard. You&#8217;ll need it later.<\/p>\n\n\n\n<p>5. Now, go to your site, and insert an image. For example, with Blogger, you&#8217;ll want to go to the <strong>Design <\/strong>tab, <strong>Add a Gadget<\/strong>, and choose <strong>Picture.<\/strong><\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-5-in-blogger-add-a-picture-to-your-template.jpg\"><img  width=\"600\" height=\"378\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-5-in-blogger-add-a-picture-to-your-template.jpg\" alt=\"in blogger add a picture to your template\" class=\"wp-image-1313\" title=\"step 5 - in blogger add a picture to your template\"\/><\/a><\/figure><\/div>\n\n\n\n<p>6. Blogger gives you a picture form.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-6-picture-form.jpg\"><img  width=\"510\" height=\"600\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-6-picture-form.jpg\" alt=\"blogger picture form - add your app qr code here\" class=\"wp-image-1314\" title=\"step 6 - picture form\"\/><\/a><\/figure><\/div>\n\n\n\n<p>7. In the blank where it says <strong>From Your Computer<\/strong>, browse and add the new picture.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/Step-7-configure-picture.jpg\"><img  width=\"506\" height=\"600\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/Step-7-configure-picture.jpg\" alt=\"add a picture to blog app template\" class=\"wp-image-1315\" title=\"Step 7 - add the picture\"\/><\/a><\/figure><\/div>\n\n\n\n<p>8. Go back to where you were with your app. The address bar should read http:\/\/www.appsgeyser.com\/getwidget\/******** (where the stars are the name of your app). Highlight the address bar, and use Ctrl-C to copy the address.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-8-copy-the-address.jpg\"><img  width=\"600\" height=\"26\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-8-copy-the-address.jpg\" alt=\"URL Browser App\" class=\"wp-image-1316\" title=\"step 8- copy the address\"\/><\/a><\/figure><\/div>\n\n\n\n<p>9. Use Ctrl-V to paste into the <strong>Configure Image <\/strong>function in Blogger, in the space marked <strong>Link<\/strong>. You might also want to give the image a name and a caption, but that&#8217;s a matter of personal choice.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-9-paste-the-link-address-in.jpg\"><img  width=\"586\" height=\"695\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/step-9-paste-the-link-address-in.jpg\" alt=\"paste the link address into blogger\" class=\"wp-image-1317\" title=\"step 9 - paste the link address into blogger\"\/><\/a><\/figure><\/div>\n\n\n\n<p>10. Save. Now your QR code will appear on your site, and anyone wishing to go mobile from your site can scan it, while anyone who browses in on a mobile browser can get to the download link easily by pressing on the QR code!<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><a href=\"https:\/\/appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/Step-10-done.jpg\"><img  width=\"550\" height=\"533\" src=\"data:image\/gif,GIF89a%01%00%01%00%80%00%00%00%00%00%FF%FF%FF%21%F9%04%01%00%00%00%00%2C%00%00%00%00%01%00%01%00%00%02%01D%00%3B\" data-layzr=\"http:\/\/www.appsgeyser.com\/blog\/wp-content\/uploads\/2012\/01\/Step-10-done.jpg\" alt=\"Your AppsGeyser QR code is now on your site!\" class=\"wp-image-1318\" title=\"Step 10 - Your AppsGeyser QR code is now on your site!\"\/><\/a><\/figure><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Before I start, I just want to point out that putting a QR code on a website is only useful if the content provided for mobile is somehow different from the content on the website. Think that your reader is already on your site. They don&#8217;t really need help getting to the site. On the other hand, if you have an app, and you want your website users to take your app on the go, then giving them the code on their screen can be helpful. Remember that if they&#8217;re viewing the site on their phone, the QR code can&#8217;t <\/p>\n","protected":false},"author":2,"featured_media":1311,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[703,702],"tags":[],"_links":{"self":[{"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/posts\/1310"}],"collection":[{"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/comments?post=1310"}],"version-history":[{"count":18,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/posts\/1310\/revisions"}],"predecessor-version":[{"id":13399,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/posts\/1310\/revisions\/13399"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/media\/1311"}],"wp:attachment":[{"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/media?parent=1310"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/categories?post=1310"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/appsgeyser.com\/blog\/wp-json\/wp\/v2\/tags?post=1310"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}