Barcode in confirmation email

Has anyone added ticket barcodes to your order confirmation emails? Our sales department wants to be able to send confirmation emails with the barcodes embedded in the email and before I try to reinvent the wheel thought I'd throw it out here.

If you have, would you be willing to share your confirmation with me?

Thanks,

Melissa

  • Don't have any sample code for you but I had thought about this for a while and for us what I couldn't reconcile came down to one thing: overcoming the batch requirements of WP_PRINT_TICKETS.

    Two methods I can think of:

    • Use a session key associated with the batch currently locking the order
      • Does this pose issues for the client keeping track of state?
    • Use a method to call the order's sli's asynchronously upon image load, showing an error until the order is unlocked
      • Is this insecure?
      • Does it pose other risks like excessive locks on orders, is it too aggressive?
      • Is it any better than providing a link in the email

    What we finally did do at FTC was switch to a login-based ticket PAHT process. Our box office goes in the night of the show and batch prints any unprinted tickets so they are available in will call, ready to go.

  • Hi Melissa,

    Did you ever find a solution on this?  I'm also curious if there's a way to batch email tickets with N-Scan barcodes the same way you can batch print tickets.  

    Thanks,

    Chuck

  • I'm also very curious about this. We are just starting with NScan and our Ticketing team would love this!

    Kelly

  • I never got it working, it turns out it was a little beyond my technical expertise.

  • Just throwing this out there. With V14s HTML Templates, something like this may feasible. https://www.limilabs.com/barcode. We plan on getting into this in the near future as well.

  • Update: I believe that the issues I originally mentioned still exist but there may be some easily obtainable solutions.

    The order number, which is readily available to the email templates, will scan using NScan V6's Group Entry. While this may not be as intuitive as giving all ticket numbers it offers options to print a scan-able code in an email. Using group entry for order confirmation emails may actually be ideal, in any case, as multiple barcodes on a single page tends to get a bit confusing for scanning staff/volunteers.

    Beyond this the order number, being reasonably short, should be able to fit within a standard V1 QR code with pretty high ECC. This is ideal as HTML tables may be capable of generating a QR code using a 21x21 grid thus removing any of potential of images not printing/being downloaded. Seeing as HTML would be already required to embed images this would seem the ideal method for embedding a barcode.

  • Example/Fiddle of HTML Table based QR Code (utilizing a modified, non canvas version of https://github.com/davidshimjs/qrcodejs)

    jsfiddle.net/.../

  • I'm resurrecting this dead thread because I have a simple & quick solution using the new Email Templates in v15.

    So check it out, this is so easy you'll kick yourself. There are a ton of free Barcode API services out there, one of my favorites is Barcodes4Me.
    Familiarize yourself with the API, but basically, as long as you have a number, a string, whatever kind of data you want, you can generate a barcode into an image.

    For example,

    Order Number 123456

    Becomes the URL string:
    barcodes4.me/barcode/c128b/123456.png

    Which, when rendered as an image:

    Easy.

    Now, using the variables available to us in the HTML Templates section of the Ticketing Setup in Tessitura, we can generate an image right there in the template using the same method. Just replace the number in the URL with the variable for the order number (or whatever piece of data you want).

    In the top of the Template, create a Variable (this is using the Order ID):

    var barcodeImageUrl = "barcodes4.me/barcode/c128b/123456.png" + Model.OrderProductView.Id + ".png";

    (Please note, you'll need to designate http:// before your url)
    Find where in the template you want to add the barcode, and create an HTML Img tag using the variable you just created as a src attribute:

    <img src=@barcodeImageString />

    Bam.
    Barcode in the Order Confirmation.

    Be sure to follow any attribution rules/pricing for whatever Barcode Service you end up using.

    Additionally, if you're more web savy, you could even create your own Barcode API and run it off of your own server using something like JsBarcode.

    Happy Coding!

  • Thank you Cody.  You are aptly named!

    I'll give it a burl ;)

  • So I know I am resurrecting and old thread here, but I wanted to add this in case someone bumps into this thread, and also to have some questions answered..

    So there is a built-in way to generate 2d barcodes in the HTML template using the Model.GetQRCode function.  You can see an example of this used in the mobile ticket ticket template now included in Tessitura 15.1.

    However I wanted to find a way to generate 1D barcodes.   I have been able to do it the following way directly in the HTML template, without using any external web services, however it does require a modification to the web.config file in your REST service layer to include the barcode library you need (which is already distributed with the rest service layer code).

    To make the barcode library DLL available to the RAZOR templates, you have to add the following key inside the <razorEngineConfiguration> section in the web.config of the Tessitura Service:

    <razorEngineDependency key="BarcodeLib.Barcode" />

    1) So your   <razorEngineConfiguration> section should look something like this:

    <razorEngineConfiguration>
         <razorEngineDependency key="System.Web.Mvc" />
         <razorEngineDependency key="Tessitura.Services.Common.Client" />
         <razorEngineDependency key="Tessitura.Service.Client" />
         <razorEngineDependency key="Newtonsoft.Json" />
         <razorEngineDependency key="System.Xml.Linq" />
         <razorEngineDependency key="BarcodeLib.Barcode" />
    </razorEngineConfiguration>

    2) Include the following function in your HTML template's functions block:

    string generateBarCode (string barCodeData)
    {
         BarcodeLib.Barcode.Linear.Linear qrc = new BarcodeLib.Barcode.Linear.Linear();
         qrc.Data = barCodeData;
         return Convert.ToBase64String(qrc.drawBarcodeAsBytes());
    }

    3) In your HTML code you can call the function like this (replacing the string parameter with whatever text you want to encode):

    <img src="data:image/png;base64,  @generateBarCode("200190152629480969")" alt="BarCodeImage" />

     

    .... So simple 
    .... So easy
    .... So elegant

    ... HOWEVER ...  (<---- I would have made this a larger font if I could have)

     

    This means modifying the web.config in your service layer, which poses 2 problems or issues:

    1) For self hosted installations, you must remember to go back and manually modify your web.config each time you update Tessitura or your template will break.

    2) For RAMP installations, since you would not have direct control over the REST service layer, you would have to get Tessitura to do this modification for you, and then they would still have issue #1 to deal with.

    So, I have these questions:

    1) Can Tessitura please just include this library in the future (as I have done here), as a standard out-of-the-box feature for Tessitura so barcodes will be available to the templates in the first place?  That would solve everything and we wouldn't even need to ask the next two questions.

    2) Is Tessitura willing to make this modification to RAMP hosted environments, where 1-d bar codes are needed?

    3) Is there some sort of method I could use with TIM, to embed this change as part of the upgrade process that can be carried over in the .config import, so I wouldn't potentially break my templates each time I upgrade??

    ... Or is there another way to do this??

    Anyhow, I hope this helps someone else that is looking to embed barcodes in their templates.

  • Howard-

    This likely won't work reliably.

    https://www.campaignmonitor.com/css/color-background/data-uri-background-image/

    Data URI's are an issue for email clients. Ultimately you have two barriers here:

    1. Will the client accept the data uri
    2. Will the client display images by default


    The core idea behind encoding the 2D barcode into a table was seen as a solution to these problems. Tables are well supported in email and will likely be rendered properly despite any interference images, embedding/data uri's introduce.

    If you'd like more detail here just let me know and I'll try to answer any questions you might have about email quirks and such.

  • I see what you mean....   If that is the case then I should really avoid inline images like that..

    For now, we have need to stick with 1d barcodes (since we are using 1d barcode scanners)...

    I also see how the QR code generated by the template (via Model.GetQRCode) is based on an HTML table...   Is there a similar solution for 1d bar codes??

    Other than that, I suppose the only solution would be to host the barcode image generator externally and just have the HTML reference the barcode externally??

  • I'm unaware of any other software for 1D barcodes. I suppose it could be done but we're already talking bleeding edge usecases with the QRCode (I'm damn surprised they picked up from this post and implemented it)

    If you want to use 1D barcodes I would just suggest setting up an endpoint to generate them. You could also pre-generate them and host them statically if you wanted to, there's only a couple thousand that would need to be created for the OrderIDs. <img src="endpoint.com/12345" />, simple as that.

    You will still need to contend with the default image-viewing, But honestly, just print the OrderID next to the barcode at that point.

  • Ya I think we are just going to end up generating the image and referencing that in an email...  Its really too bad that you can't embed them as that would be an ideal solution, but as you pointed out many email clients just won't display it...  

    I also found some methods to generate 1-d barcodes in HTML (like the 2d QR codes are being generated), however I found that some email clients (notably outlook) were truncating the barcodes...  It turns out that Outlook has a limit to how many columns a table can support (Outlook limits it to 63 columns).   With 1-d barcodes you would usually need more than 63 columns, so outlook will break the HTML barcodes too...  QR codes also would fail in that case, but usually you can keep the QR code from taking up more than 63 columns since you have the whole other 2nd dimension to encode stuff in...

    Anyhow, just generating images with a web host is the only real solution here I think...  And sadly, when emailed, many will not display unless the end user has their client set to download the images..