QR Link Field

QR Link Field provides a field that stores a link and displays it as a QR code. Visitors can scan the code with a phone, click it, or download it to print. The same QR code display can also be used on Drupal core's Link fields, so you can add QR codes to links you already have.

QR codes are generated on your own server as inline SVG. No URL is ever sent to a third-party service, so codes work on intranets and offline sites, and your visitors' browsing is not shared with anyone.

Typical uses

• Event, product or location pages that are also printed as posters or flyers
• Linking printed material to a sign-up form, survey or download page
• Letting visitors move a page from a desktop screen to their phone

Features

• QR Link field type: stores an internal path such as /contact or an http/https address. A missing https:// is added automatically, and invalid values, such as javascript: or protocol-relative links, are rejected.
• QR code formatter, for QR Link fields and core Link fields, with settings for:
  • size, error correction level (L, M, Q or H) and margin
  • foreground and background colors, to match your brand
  • linking the code to its URL, optionally opening in a new window
  • a caption below the code, and showing the URL as text for printed pages
  • a Download QR code link that saves the code as an SVG file, which prints sharply at any size
• Scannable internal links: internal paths are encoded as full absolute URLs.
• Accessible and responsive: every code has a text alternative naming its URL, and it shrinks to fit narrow screens.
• Themeable: output uses the qr-link-field.html.twig template and a small CSS file.

Requirements

• Drupal 10.3 or later, or Drupal 11
• The chillerlan/php-qrcode library, version 5.0.5 or later. Composer installs it automatically. It needs no GD or Imagick extension.

Installation

Install with Composer, so the QR code library is installed too. For further information, see Installing Drupal Modules.

composer require drupal/qr_link_field
drush pm:enable qr_link_field

Configuration

1. Add a field of type QR Link at Structure » Content types » [type] » Manage fields. To show an existing Link field as a QR code instead, skip this step.
2. On Manage display, choose the QR code format for the field and adjust its settings with the gear icon.
3. Optionally, change the input placeholder on Manage form display.

Support

Report bugs and request features in the issue queue.