(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.data-privacy-src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-PF5R8F7');

Knowledge Base

How to Use Webify

What Is Webify?

Webify allows you to display web-formatted content in-app when plain text is not enough. Webify can also be used with contextual variables for customizing the response an app user sees after a scan.

You can show HTML directly using standard W3C HTML tags. CodeREADr will render your HTML within the application just like a web page. If you are using an on-device database, you can load a full HTML page from a URL using the cURL tag. However, the cURL tag is not supported for online database services or postback services at this time.

NOTE: Because the cURL tags are not supported for online database services or postback services, for those options you must return full HTML tags only. If you have any questions, please feel free to contact us.

How Does Webify Work?

The basic syntax of a Webify URL can contain one or multiple of the following:

  • One cURL tag containing one URL
  • And/or one HTML tag
  • And/or plain text anywhere outside of the cURL and HTML tags

NOTE: The cURL and/or HTML tag must be properly opened and closed or the app will treat it as plain text.

How Does Webify Look?

Webify in Service Description

Input

App Result: Description

HTML Description

Webify in Response Text (via Validation Pattern)

Input

HTML Pattern

App Result: Scan Response

app scan

Webify in Response Text (via Database)

Input

HTML Response

App Result: Response Text (as shown in Lookup)

app database display

Note 1: For HTML to render properly, please use:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Note 2: You can use tools like ChatGPT to help you with HTML code. Further, you can use online tools like Code Beautify to preview your HTML script.  When asking ChatGPT to generate the script, be sure to include the appropriate tags:

Full-Screen In-App Window or Browser

If you want the app user to have the option to tap a button to view web content, the URL can open in its own full-screen window from a webify container if you include a prefix. In both cases, the app user can seamlessly continue scanning after closing the window or browser.

The codereadr:_blank: prefix will attempt to open it in-app but in a full view window.

The codereadr:browser: prefix will open it in the device’s default browser app (i.e. Chrome or Safari).

Combination and Hierarchy of Syntax

In the event you provide more than one format ( cURL tag, HTML tag and plain text), the app will only display one of the three based on the following precedence:

  1. cURL – the first choice when present
  2. HTML – the second choice when present
  3. Plain text – the third choice is plain text and is displayed when curl and HTML are both not available

Templates for HTML Response Screen

You can include the full HTML code in every field of a database or you can use a template. Using a template will substantially cut down the size of your database and make it easier to implement/change while achieving the same results.

Customize Response Labels and Colors

An added feature to customize the response to a scan, on the Advanced step you can customize the screen’s labels and colors (scan response) to best fit your intended response to the app user.

Web Content as a Service

In addition to the typical recording and validation Services offered, you can also create a Web-View-Only Service with our Webify feature. Webify will present to the app user an image (such as your logo) or Web page or a specific image or Web page if using contextual variables. Any of these contextual variables can be used:

__USER_ID__

__USERNAME__

__SERVICE_ID__