Follow Jeroen Steeman on Twitter Connect to Jeroen Steeman on LinkedIn Follow Jeroen Steeman on Facebook

Iframe QR Code Generator

Put a QR code generator in your website with just one line of code

It doesn't get easier than this. We published our QR Code API to enable the creation of a 'white label' QR code generator, making it appear as if the QR codes are generated by your website. Webmasters and developers of popular blogging and content management systems indicated that it was sitll a bit to complex for them and was it possible to make it easier.

The solution QR4 came up with is a highly configurable QR code generator that lives in an 'iframe' on any page in your website and can be activated with one simple 'copy and paste' line of code.

<iframe width="600" height="300" src="http://www.qr4.nl/igen.aspx?key=MYKEYVALUE" frameborder="0"></iframe>

Copy the iframe line above and paste it into HTML page, anywhere in the 'body', remember to replace the MYKEYVALUE with a valid key that you can get at the QR Code API key generator. If you already have a key for the API it will work for the iframe generator as well.

The Iframe QR code Generator should look like this in your web page
Iframe QR Code Generator Screenshot

Iframe configuration

Nearly all presentation elements of the generator can be managed if required. Without any additional parameters the generator will function as show above, but lets hae a look at what we can change to suit us and our website.

NOTE: All paramters are optional, parameters can be appended as needed in no particular order. In the examples below replace MTKEYVALUE with your key.

Parameter Description
CSS You can control fonts, colours, spacing and size of elements by directing the generator to your own CSS style sheet for presentation. We recommend you download the default stylesheet file, adapt it as needed and point the generator to your new CSS file on your server.
Parameter: css
Value: url to css to use
Example: http://www.qr4.nl/igen.aspx?key=MYKEYVALUE&css=http://www.mysite.com/mycss.css

Title text You can change the title or header text of generator to suit you. Referencing it in the request but supplying no text will make it dissapear.
Parameter: title
Value: any text string. May also be sent with no value. Example: http://www.qr4.nl/igen.aspx?key=MYKEYVALUE&title=My Simple QR Generator

Button text Determine the text of the 'Generate' button. Make your QR code generator local or global for different languages.
Parameter: but
Value: any text string. May not be empty.
Example: http://www.qr4.nl/igen.aspx?key=MYKEYVALUE&but=Create QR Code

Text under QR code Determine the text instruction under the QR code once it is generated and displayed to the user.
Parameter: fot
Value: any text string. May be left empty.
Example: http://www.qr4.nl/igen.aspx?key=MYKEYVALUE&fot=Click to show

You can add all the parameters you want to the request at the same time. Example: <iframe src="http://www.qr4.nl/igen.aspx?key=MYKEYVALUE&css=http://www.qr4.nl/test.css&title=My Simple QR Generator&but=Create QR Code&fot=Click to show" ></iframe>

Working Iframe Example

And should produce a QR generator in your iframe that looks like the example above.

Note: All error messages are in English, if anyone has the need to have these translatable, let us know.

This iframe QR code generator is intended for free personal, educational and demonstration use only. Please do not implement it commercially.

QR4 is maintained by - Geleenhof 42, 5655 AH Eindhoven - Tel: +31 (0)6 130 33 743