Creating EAN13 Barcode from number fields

I have been trying to create EAN13 Barcode from number fields, but without success. With some fonts in the CSS i can create barcodes, but these are not read by a scanner. Has anyone done this or know how to do it? It will be appreciated big!

Hi

I have often used Integromat to create Barcodes and store them back into Knack as Images - and their Barcode module does do EAN13. Here is a screenshot of a typical ‘Scenario’:

Hope this helps!

Julian

2 Likes

Dear Julian,

Thank you very much. It seems to work here too. But the only problem is that it creates barcode only for one record. How can I set it to create barcode for all records? Thank you in advance.

I always create barcodes by adding a class in the CSS to handle the barcode font/size etc. I then use javascript to add the class to the desired field. This solution will display the barcodes in the Knack application, but will not have them stored as an image anywhere. It also doesn’t require any third party connections.

Here’s an example of how I am doing it with my barcodes:

BE SURE TO CHANGE TO YOUR FONT TYPE AND CHANGE YOUR VIEW_ID AND FIELD ID

CSS

@font-face {
    font-family: 'Libre Barcode 39';
    font-style: normal;
    font-weight: 400;
    src: local('Libre Barcode 39 Regular'), local('LibreBarcode39-Regular'), url(https://fonts.gstatic.com/s/librebarcode39/v10/-nFnOHM08vwC6h8Li1eQnP_AHzI2G_Bx0g.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  }

.barcode39-with-label{
    font-family: 'Libre Barcode 39 Text', cursive;
    font-size: 3.5em;
    user-select: none;
}

JavaScript

//change your field id
const addBarcode = () => {
  const barcodeField = 'field_xx';
  Knack.$(`.${barcodeField}`).addClass('barcode39-with-label')
}

//change your view to a specific view key or 'any'
$(document).on('knack-view-render.view_xx', function(event, view, data) {
  addBarcode();
});
2 Likes

Hi Naim

Not sure if you prefer to have the barcodes as images or use the css method - but you can easily get Integromat to read multiple records (with the Search Records module) and then update them.

Integromat is a fantastic sidekick to Knack - effectively providing a no code programming tool. This seems appropriate to me after all we have all chosen Knack because we don’t want to code.

I have quite a few articles about this at www.onlinedatabase.expert

Julian

1 Like

wow ! love this for its simplicity :pray:

Thank you very much. I have done this, but unfortunately this doesn’t work either.