How To Build a Custom Barcode Application With Pic2Shop Pro & WordPress
If you’ve got a company database full of product data, connecting that data to a barcode system can be incredibly useful. Perhaps your warehouse workers need a quick way of looking up the product location, or maybe they need to quickly find out the purchase price for a full box and not by unit.
Whatever the situation, integrating barcode reading facilities can be an expensive and arduous task, but it doesn’t have to be. Today I’m going to show you how to use a $10 app and a custom database to pull product data onto your mobile device without expensive equipment.
This tutorial assumes a basic knowledge of PHP. I’ll also be bootstrapping the project with WordPress simply because I’ll then have a large sample set of data to work with from one of my own sites. In a real world scenario, connecting PHP to a custom database isn’t difficult.
You’ll also need a copy of Pic2Shop PRO Barcode scanner. This is available for iOS and Android for around $10. This app serves no other function that to scan something, and allow us to configure a URL to automatically receive and process that data.
Note: iCody is a similarly popular app and slightly cheaper, but only available on iOS. In the interests of making this as cross-compatible as possible, I chose pic2shop. The WordPress side would work just the same, but the URL format would need to be adjusted for other barcode apps.
Getting Started: The Data
The system I’ll be setting up today will scan the barcode from a physical boardgame, and fetch the relevant review from my iPad board games review site. The first step then is to simply scan the barcode numbers from a variety of board games and add the numbers as custom fields to the relevant reviews. In a real world scenario, you’d probably already have this data in your database from a Point of Sale system.
I’ll be ignoring the format and simply using the content of the barcode. In this case 0655132002387 for the game San Juan. As you can see, the app is pretty basic and unconfigured at this point, so scanning the code simply outputs the data on the screen.
Copy this into a custom field to populate our database:
Processing: The Web App
To process the data, create a new PHP page in the root directory and call it barcode.php. Let’s just test for now with this:
require_once(‘wp-blog-header.php’); // ensures we can use WordPress functions and db access
In the scanner app, configure the Lookup URL as: http://YOUR_SITE_URL.COM/barcode.php?code=CODE
You needn’t enable GPS locations. The CODE bit will be replaced with the actual code read by the barcode reader app. The output should be something like this:
Great, that should be working. The next step is to fetch a post associated with that meta ID, then fetch the user to it. Use the following code, which assumes the custom field you used was called “barcode”.
<?php require_once('wp-blog-header.php'); // ensures we can use WordPress functions and db access //print_r($_REQUEST); query_posts( array( 'post_type' => 'post', 'meta_key'=> 'barcode', 'meta_value' => $_REQUEST['code'], 'meta_compare' => '=' ) ); // query for posts with specific meta value if (have_posts()) : while (have_posts()) : the_post(); $url = get_permalink() ; echo $_REQUEST['code']; echo $url; echo get_post_meta(get_the_ID(),'barcode',true);//wp_redirect($url ); exit; endwhile; else : echo 'No entry for game '.$_REQUEST["code"].' exists yet'; endif; ?>
That really couldn’t have been simpler. Here’s a quick demo of the app working. You can download the completed PHP file from here which includes the adjustments made in further work below.
Further Work: Automatic configuration
Typing this URL onto hundreds of devices for your workers is going to be rather laborious, so we can use the automatic configuration built into the app by simply getting them to visit a specific URL. The URL in my case is:
Adjust as neccessary, but note the slight change from the : character to %3A – the rest is simple to understand. In my case, I’ve made this link available to anyone who visits the barcode.php without specifying an actual barcode. They would simply visit the link in their browser, click the link, and it would launch the barcode app on their device if it’s been installed.
I hope you agree this was really quite easy. You don’t need expesnive portable scanners if you already have a mobile device with a camera, and integrating it into an existing database system is easy too with a little PHP.
Do you think you could make use of this in your small business? Let us know in the comments.