Custom QR code Generator [New Plugin by EzCode]

Hi no-coders!
We’ve launched our new plugin

qr_code_logo_plugin Branded QR code generator

Generate unique branded QR code

Change the color of the main background, pattern or the squares, add your logo and set a background.

Example:
example_qr

More examples

  • Cross-browser support for QR code generation based on HTML5 Canvas and Table

  • Change pattern(dots) size

  • Padding Zone

  • Custom Squares fill and border color

  • Custom Timing Patterns vertical, horizontal color

  • Logo images (including transparent PNG images)

  • Background Image

  • Change the main background and pattern color

  • Unique feature for bubble, Live Preview, see all the changes directly in the app editor inside the plugin element, no need to refresh the page to see the result on every change.
    Live preview example:
    qr_editor

The QR code image will be available in Base64 format in the “QR code Base64” state.

The plugin can be initialized from workflow using the “Generate QR” action or automatically when page loads (set Yes in the “Autorun” field)

Recommendation

Don’t overcomplicate the QR code with too bright background image, too tiny pattern or a logo that covers too much, test it with a QR reader before going to production.


Market: https://bubble.io/plugin/branded-qr-code-generator-1593424363527x208447447620911100

Demo: https://ezcodepluginsdemo.bubbleapps.io/branded_qr

ez_logo EzCode.co
All plugins: https://bit.ly/3il0JcG
All templates: https://bit.ly/3dJVb7J
Twitter: https://twitter.com/ezcode_official

4 Likes

I am interested in utilizing QR codes for some different features in my app, but completely lost on how to implement them.

If I wanted to generate a QR code that would open a specific link in my app, is that link what I enter into the ‘text’ portion of this plugin?

Also, is there a way to get my app generate a QR code for a specific user. My use case is that a user clicks a button ‘Get Coupon’ which will create a coupon for them to download to bring to a retailer either as a printed version or a PNG to save on their phone.

I’d like for the retailer to be able to scan the QR code to get access to the users account details for follow up marketing.

1 Like

Exactly, you put the link in the text field and that’s it.

Yes of course, the text field is dynamic so, let’s say for example that your Users database have a field named Coupon, so in the text field you could set, “Current user coupon”
There are tons of different ways to do it since the text field is dynamic as I said.

We plan to implement the scan feature in the next plugin update.


If you have any other questions or would like any help with your app, feel free to contact us https://ezcode.co/contact_us

3 Likes

Hiya.
I just subscribed to the Branded QR Generator but can’t figure out how to create a QR code for a logged-in user for a specific page URL in my app.
To be more clear, I am working on a market place app and I would like each of my vendors to be able to create QR codes to any page in their shops. This way, users can scan the printed QR codes and be taken to the specified page in the vendor’s page.

Could you explain how to get this done please?
Cheers

Hi,
the text field in the plugin settings is dynamic so it can be different for each user.
For example if your vendors have different urls you could set something like
Current vendor url or This url, it depends on what logic do you have for your pages.

Screenshot 2020-08-03 at 22.47.01

Hope it will helps.

If you have any other questions, feel free to ask and we will try to help you.

1 Like

Hello.
Thanks for the quick reply.

I tried using the ‘this URL’ instruction for the QR code before initially contacting you, but scanning the QR code only takes you to a random Google search result page for articles titled ‘this URL’.
Clearly I am doing something wrong.
Also, the QR code does not show up when I click on the Preview Page.

Also there is no option/logic to set a ‘current user’s url’ as suggested.

That was just an example of implementation with different logic in bubbles database, it can be done in different ways.

I’m assuming that you are scanning it in the editor? The dynamic value of “this url” is available on the preview mode only, this is how bubble works.

This was a bug with element styles, we’ve pushed an update that will fix that.
Please update to the latest version.

I have the latest version installed and there is still no QR code showing up in the preview mode. If no QR code in the preview mode then I can’t test if the ‘this url’ logic works.
Also, it would have been really cool if you could show a step by step guide on how I can achieve what I need to achieve since you have mentioned several times that there are various ways to achieve my intended use.

Looks like the update is not available immediately , the current version is 1.1.1.
Check later if the update appears.
For now you can use the Base64 state and display it in a image element as we did it in our demo

Screenshot 2020-08-04 at 13.59.42
See it in the editor

I was talking about different ways to do this logic in Bubble, so it is not related to the plugin but to Bubble development. There are different free and paid tutorials to learn more about bubble.

@ezdev
Hi,
I have problem with generate the QR code 198 characters. Nothing show, other QR code generator still work on this.

Hi,
our plugin supports up to 191 characters, we will push an update today that will increase the limit to 194 characters.
Unfortunately we can’t make it up to 198 because of the library that we use(It may change in the future updates).

If you are using long urls, we would suggest to use short link services.

Regards, Andrew from EzCode

Hi,
Thank you, 194 characters did help (a little), I’m generating QR code for payment gateway, and the standard QR ~200 characters.
I shorten the order info from “payment for the order xxxxxxxxx” to “paying ABC” so it work now. will be happier if it reaches 200 characters :).

1 Like

Hey @ezdev,

First, many thanks for this plugin, I bought it, it’s amazing ! QR code generation is fast, and customization is really of interest !

I’m still quite noob with Bubble, so now I have generated my QR code as a base64 image in a data type field, how can I allow my users to download this QR code as an image ? I tried using the Navigation / open external site action 'using the image filed’s Url, but it does not work, nothing happened…

Many thanks for your help or advice !
And again, for this amazing and very useful plugin !

Christophe HK

1 Like

Hi,
thanks, glad that you like it!

Actually that’s a good idea,so we’ve just added this feature in a new action called Download QR Code

Please update the plugin to the latest version 1.1.3 and then you could use this action.

Regards, Andrew from EzCode team!

2 Likes

Wow, more than fast !!! And it works like a charm !

Huge thanks Andrew / @ezdev !!

1 Like

Hello, I am using the app for some branded qr code generation, but can not get the background feature working. I need a qr code image with a small logo below the qr code.

Any help please ?

Hi,
Maybe something is wrong with the image, try to do it in our demo page, does it work there? If it does, then something is wrongly set up in your app, you can send us a link to your app and we’ll take a look.

For those who are having errors regarding cross-origin, we have fixed it.
Please update the plugin to the latest version.

Hi!
I try to make the Plugin but get everytime I run Generate QR Branded QR the workflow gives the following error
TypeError a.data.int is not function at eval

Download is not even reacting.

Hi!
When you run it from workflow, is the plugin element visible on the page?
You can send us a link in PM and we’ll take a closer look.