HT QRCode Generator V2

View demo Need Support

Introduction

Thank you very much for choosing our plugin. We truly appreciate and really hope that you'll enjoy our plugin!


If you like this plugin, Please support us by rating us 5 stars..     

HT QRCode Generator - plugin you can generate wide custom and automatic site page URL QR code generator and use them for Elementor, widgets, and Shortcodes. The plugin does not depend on any external services, QR Codes are generated using JavaScript.

Plugin QR code features

  • Dynamic QR Codes.
  • Inner Shortcode Support.
  • QR Code Download and Print Option.
  • Custom QR Code Design.
  • Required Patterns that support dot style.
  • Support for Quiet Zone settings.
  • Support custom Position Pattern inner fill and outer border color.
  • Support custom Alignment Pattern inner fill and outer border color.
  • Support custom Timing Patterns vertical, horizontal color.
  • Support Logo images (including transparent PNG images).
  • Support Background Image.

QR Code Generator helps to generate code

  • Custom text/custom link.
  • Current page URL.
  • Mail to link/Email Message.
  • Calendar Event.
  • Contact Information.
  • Google Location.
  • Phone Number.
  • Phone SMS.
  • Skype Contact
  • WIFI Access

Styling Options:

  • Custom Logo
  • Custom background
  • Border color, width, height
  • Patten Outer / Inner Color
  • Aligment Outer / Inner Color
  • Custom Timing Style
  • Custom Dot Style
Need Support?
If you have any questions regarding to theme issues, please submit a ticket at http://hasthemes.com/contact-us/

System Requirements

  • Wordpress 4.0 or Higher
  • PHP version 7 or greater
  • MySQL version 5.6 or greater OR MariaDB version 10.0 or greater
Reference
Plugin Installation

To use this theme you must have a working version of Wordpress already installed. If you need help in installing wordpress follow the instruction here: https://codex.wordpress.org/Installing_WordPress

Plugin Installation

Please follow the screenshots below to install the plugin

Install plugin

Usage guide

After installing the plugin you will create a page and edit with Elementor.
Find the HT QR Code and Drag and Drop in the page.
QR Code Features
Chouse HT QR Code Layout
How to edit HT QR Code Style element Style.
Frontend demo

Wordpress Widget Setup Installation

Basic QR code contacts

QR code is the trademark for a type of matrix barcode first designed in 1994 for the automotive industry in Japan. A barcode is a machine-readable optical label that contains information about the item to which it is attached. Wikipedia

Frontend demo
Frontend demo

How to use WordPress shortcode

After install the plugin you will get use shortcode for wordpress pages.



Shortcode Parameters

[htqrcode title = "" sub_titel = "" html_tag = "" alignment = "" size = "" dot_scale = "" qr_level = "" logo = "" logo_size = "" logo_bg_color = "" logo_bg_transparent = "" qr_bg_image ="" qr_bg_opacity = "" qr_bg_autoColor = "" colordark = "" colorlight = "" po = "" pi = "" po_tl = "" pi_tl = "" po_tr = "" pi_tr = "" po_bl = "" pi_bl = "" ai = "" ao = "" timing = "" timing_h = "" timing_v = "" quietzone = "" quietzonecolor = "" print = "true" print_btn_txt="Print QR Code" download="true" download_btn_txt="true"][/htqrcode]

Parameters Details

Shortcode option Description Example
alignment QR Code alignment [htqrcode alignment = "center"]
qrcode QR Code Text here [htqrcode qrcode = "QR Code Text"]
size QR Code Size [htqrcode size = "300"]
dot_scale QR Code Dot Scale ( Size 0.1 to 1 ) [htqrcode alignment = "1"]
qr_level Code reading labels ( L, M, Q, H ) [htqrcode qr_level = "H"]
logo QR Code logo [htqrcode logo = "https://example.com/logo.png"]
logo_size Logo Size [htqrcode logo_size = "60"]
logo_bg_color Logo Background Color [htqrcode logo_bg_color = "#FFFFFF"]
logo_bg_transparent Logo Background transparent or not (true/false) [htqrcode logo_bg_transparent = "true"]
qr_bg_image QR code Background Image [htqrcode qr_bg_image = "https://example.com/background-image.png"]
qr_bg_opacity QR Code Background Image Opacity ( 0.1 to 1 ) [htqrcode qr_bg_opacity = "0.7"]
qr_bg_autoColor QR Code BG dot Auto Color Enable or Disable [htqrcode qr_bg_autoColor = "true"]
colordark QR Code QR Dot Color [htqrcode colordark = "#000000"]
colorlight QR Code Background Color [htqrcode colorlight = "#FFFFFF"]
po QR Code Pattern Outer Global Color [htqrcode po = "#e1622f"]
pi QR Code Pattern Inner Global Color [htqrcode pi = "#aa5b71"]
po_tl QR Code Pattern Outer Top Left Color [htqrcode po_tl = "#e1622f"]
pi_tl QR Code Pattern Inner Top Left Color [htqrcode pi_tl = "#b7d28d"]
po_tr Pattern Outer Top Right Color [htqrcode po_tr = "#aa5b71"]
pi_tr Pattern Inner Top Right Color [htqrcode pi_tr = "#c17e61"]
po_bl Pattern Outer Bottom Color [htqrcode po_bl = "#c17e61"]
pi_bl Pattern Inner Bottom Color [htqrcode pi_bl = "#c17e61"]
ao Aligment Outer Color [htqrcode ao = "#7D26CD"]
ai Aligment Inner Color [htqrcode ai = "#27408B"]
timing Timing Global Color [htqrcode timing = "#111111"]
timing_h Timing Horizontal Color [htqrcode timing_h = "#ff6600"]
timing_v Timing Vertical Color [htqrcode timing_v = "#cc0033"]
quietzone Boder/Zone Pixels [htqrcode quietzone = "30" quietzonecolor="#00CED1"]
quietzonecolor Boder/Zone Color [htqrcode quietzone="30" quietzonecolor="#00CED1"]
print Print Button Enable [htqrcode print = "true"]
print_btn_txt Print Button Text [htqrcode print_btn_txt = "Print QR Code"]
download Download Button Enable [htqrcode download = "true"]
download_btn_txt Download Button Text [htqrcode download_btn_txt = "Download"]

QR Code Print Option for Elementor






QR Code Download Option for Elementor






QR Code Print and Download Widgets Option

Auto Generate current page Installation for elementor

QR Code Calendar Event Format

QR Code
Event Format
Explanation

BEGIN:VEVENT
SUMMARY:HasTech Annual Tour 2020
DTSTART:20200120T110000Z
DTEND:20200124T170000Z
LOCATION:HasTech IT LTD
DESCRIPTION:Floor. 4 House. 15, Block C Banasree Main Rd, Dhaka
END:VEVENT

BEGIN:VEVENT
SUMMARY: Titel
DTSTART: Year-Month-DateTHours-Minutes-SecondsZ
DTEND: Year-Month-DateTHours-Minutes-Seconds Z
LOCATION: Location
DESCRIPTION: Description
END:VEVENT

QR Code Contact Information

QR Code
Contact info Format
Explanation

BEGIN:VCARD
VERSION:3.0
N:Md Aslam Hasib
ORG:HasTech
TITLE:Managing Director
TEL:01319401143
URL:https://hasthemes.com/
EMAIL:contact@hastechit.com
ADR:Rampura\, Dhaka Dhaka
NOTE:Contact information
END:VCARD

BEGIN:VCARD
VERSION:3.0
N: Name
ORG: Company
TITLE: Titel
TEL: Phone Number
URL: Site URL
EMAIL: Email
ADR: Address
NOTE: Memo/Note
END:VCARD

Contact Information Installation for elementor

QR Code E-mail

QR Code
E-mail Format
Explanation

mailto:contact@hastechit.com

mailto: Email Address

Email Setup Installation for elementor

QR Code Geo Location

QR Code
Geo Location Format
Explanation

geo:23.7634909,90.4311671?q=HasTech IT LTD

geo: Latitude, Longitude ?q= Query

Video Installation for elementor

QR Code Phone Number

QR Code
Phone Number Format
Explanation

tel:+8801319401143

tel: Phone Number

Video Installation for elementor

QR Code SMS

QR Code
SMS Format
Explanation

smsto:+8801319401143:Hi HasTech, How are you?

smsto: Phone Number: Message

Video Installation for elementor

QR Code Text

QR Code
Text Format
Explanation

HasTech IT LTD
Address: Floor. 4 House. 15, Block C
(Opposite to D Block Central Mosque),
Banasree Main Rd, Dhaka.

Your Text

Text Setup Installation for Elementor

QR Code URL

QR Code
URL Format
Explanation

https://hasthemes.com/

Your URL

URL Setup Installation for Elementor

QR WIFI Access

QR Code
WIFI Access Format
Explanation

WIFI:S:TP-Link;T:WPA;P:87654123;H:true;;

WIFI:S:SSID;T:Network Type;P:WIFI Password;H:SSID: Hidden or not;;

Wifi Setup Installation for Elementor

QR Code Skype Call

QR Code
Skype Call Format
Explanation

skype:hastech

skype: Skype Username

Skype Setup Installation for Elementor

Basic QR code contacts

After install the plugin you will get a menu called "HashBars" from there you can add notification bars

You can add notification by clicking "Add New Notification" submenu then place the title, content and the position where you want to show the notification. Then publish the notification and it will appear on your site

Frontend demo

QR code Setting Style1: Normal

QR code Manual Setting

QR Code Dot Scale: 1
QR Dot Color: "#000000"
Background Color: #ffffff"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#000000" colorlight="#ffffff"]
OR
[htqrcode colordark="#000000" colorlight="#ffffff"]Your Text here...[/htqrcode]

QR code Setting Style2: Color

QR code Setting

QR Code Dot Scale: 1
QR Dot Color: "#473C8B"
Background Color: #FFFACD"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#473C8B" colorlight="#FFFACD"]
OR
[htqrcode colordark="#473C8B" colorlight="#FFFACD"]Your Text here...[/htqrcode]

QR code Setting Style3: DotScale

QR code Setting

QR Code Dot Scale: 0.4
QR Dot Color: "#000000"
Background Color: #ffffff"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#000000" colorlight="#ffffff" dot_scale="0.4"]
OR
[htqrcode colordark="#000000" colorlight="#ffffff" dot_scale="0.4"]Your Text here...[/htqrcode]

QR code Setting Style4: Position Color + Alignment Color

QR code Setting

QR Code Dot Scale: 0.4
QR Dot Color: "#000000"
Background Color: #ffffff"
Pattern Outer Global Color: #269926"
Pattern Inner Global Color: #BF3030"
Aligment Outer Color: "#B03060"
Aligment Inner Color: "#009ACD"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#000000" colorlight="#ffffff" dot_scale="0.4" po="#269926" pi="#BF3030" ao="#B03060" ai="#009ACD"]
OR
[htqrcode colordark="#000000" colorlight="#ffffff" dot_scale="0.4" po="#269926" pi="#BF3030" ao="#B03060" ai="#009ACD"]Your Text here...[/htqrcode]

QR code Setting Style5: Position Color + DotScale

QR code Setting

QR Code Dot Scale: 0.4
QR Dot Color: "#000000"
Background Color: "#ffffff"
Pattern Inner Global Color: "#f55066"
Pattern Outer Top Left Color: "#aa5b71"
Pattern Inner Top Left Color: "#b7d28d"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#000000" colorlight="#ffffff" dot_scale="0.4" pi="#BF3030" po_tl="#aa5b71" pi_tl="#b7d28d"]
OR
[htqrcode colordark="#000000" colorlight="#ffffff" dot_scale="0.4" pi="#BF3030" po_tl="#aa5b71" pi_tl="#b7d28d"]Your Text here...[/htqrcode]

QR code Setting Style6: Timing + DotScale

QR code Setting

QR Code Dot Scale: 0.4
QR Dot Color: "#000000"
Background Color: "#ffffff"
Timing Global Color: "#e1622f"
Timing Vertical Color: #00C12B"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." colordark="#000000" colorlight="#ffffff" dot_scale="0.4" pi="#BF3030" po_tl="#aa5b71" pi_tl="#b7d28d"]
OR
[htqrcode colordark="#000000" colorlight="#ffffff" dot_scale="0.4" pi="#BF3030" po_tl="#aa5b71" pi_tl="#b7d28d"]Your Text here...[/htqrcode]

QR code Setting Style7: BackgroundImage

QR code Setting

QR Code Dot Scale: 1
Background Image: Please Add Background Image.
Background Image Opacity: 1
Background Auto Color: "false"
QR Dot Color: "#000000"
Background Color: "#ffffff"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="1" dot_scale="1" colordark="#000000" colorlight="#ffffff"]
OR
[htqrcode qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="1" dot_scale="1" colordark="#000000" colorlight="#ffffff"]Your Text here...[/htqrcode]

Please Enter your logo URL here qr_bg_image=""

QR code Setting Style8: Auto Color + BackgroundImage + DotScale

QR code Setting

QR Code Dot Scale: 0.5
Background Image: Please Add Background Image.
Background Image Opacity: 1
Background Auto Color: "true"
QR Dot Color: "#000000"
Background Color: "#ffffff"
Pattern Inner Global Color: "#f55066"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" dot_scale="0.5" qr_bg_opacity="1" qr_bg_autoColor=true colordark="#000000" colorlight="#ffffff" po="#f55066"]
OR
[htqrcode qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" dot_scale="0.5" qr_bg_opacity="1" qr_bg_autoColor=true colordark="#000000" colorlight="#ffffff" po="#f55066"]Your Text here...[/htqrcode]

Please Enter your logo URL here qr_bg_image=""

QR code Setting Style9: Auto Color + BackgroundImage + DotScale

QR code Setting

QR Code Dot Scale: 0.5
Logo: Please Add Company logo.
Background Image: Please Add Background Image.
Background Image Opacity: 0.3
Background Auto Color: "true"
QR Dot Color: "#000000"
Background Color: "#ffffff"
Pattern Inner Global Color: "#f55066"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="55" dot_scale="0.5" qr_bg_autoColor=true colordark="#000000" colorlight="#ffffff" pi="#f55066"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="55" dot_scale="0.5" qr_bg_autoColor=true colordark="#000000" colorlight="#ffffff" pi="#f55066"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""

QR code Setting Style10: Logo + quietZoneColor

QR code Setting

QR Code Dot Scale: 1
Logo: Please Add Your Logo.
Logo Background Color: "#ffffff"
Logo Background Transparent: "false"
Background Image: Please Add Background Image.
Background Image Opacity: 1
Background Auto Color: "false"
QR Dot Color: "#000000"
Background Color: "#ffffff"
QR Code Border/Zone: 10
QR Code Border/Zone Color: "#00CED1"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="1" qr_bg_autoColor="false" dot_scale="1" colordark="#000000" colorlight="#ffffff" quietzone="10" quietzonecolor="#00CED1"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="1" qr_bg_autoColor="false" dot_scale="1" colordark="#000000" colorlight="#ffffff" quietzone="10" quietzonecolor="#00CED1"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""
Please Enter your Background image URL here qr_bg_image=""

QR code Setting Style11: Logo + DotScale

QR code Setting

QR Dot Color: "#000000"
Background Color: "#ffffff"
QR Code Dot Scale: 0.5
Logo: Please Add Your Logo.
Logo Background Color: "ffffff"
Background Transparent: "true"
Background Image Opacity: 1
Background Auto Color: "false"
Timing Vertical Color: "#00B2EE"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_opacity="1" colordark="#000000" colorlight="#ffffff" qr_bg_autoColor="false" dot_scale="0.5" timing_v="#00B2EE"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_opacity="1" colordark="#000000" colorlight="#ffffff" qr_bg_autoColor="false" dot_scale="0.5" timing_v="#00B2EE"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""

QR code Setting Style12: Logo + Colorful Style 1

QR code Setting

QR Dot Color: "#27408B"
Background Color: "#FFF8DC"
QR Code Dot Scale: 0.5
Logo: Please Add Your Logo.
Logo Background Color: "ffffff"
Background Image Opacity: 1
Background Auto Color: "false"
Pattern Outer Global Color: "#e1622f"
Pattern Inner Global Color: "#aa5b71"
Pattern Inner Top Left Color: "#b7d28d"
Pattern Outer Top Right Color: "#aa5b71"
Pattern Inner Top Right Color: "#c17e61"
Timing Horizontal Color: #ff6600"
Timing Vertical Color: #cc0033"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_opacity="1" colordark="#27408B" colorlight="#FFF8DC" qr_bg_autoColor="true" dot_scale="0.5" po="#e1622f" pi="#aa5b71" pi_tl="#b7d28d" po_tr="#aa5b71" pi_tr="#c17e61" timing_h="#ff6600" timing_v="#cc0033"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="50" logo_bg_color="#ffffff" logo_bg_transparent="true" qr_bg_opacity="1" colordark="#27408B" colorlight="#FFF8DC" qr_bg_autoColor="true" dot_scale="0.5" po="#e1622f" pi="#aa5b71" pi_tl="#b7d28d" po_tr="#aa5b71" pi_tr="#c17e61" timing_h="#ff6600" timing_v="#cc0033"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""

QR code Setting Style13: Logo + Colorful Style 2

QR code Setting

QR Dot Color: "#000000"
Background Color: "#FFFACD"
QR Code Dot Scale: 0.5
Logo: Please Add Your Logo.
Logo Background Color: "#FFFACD"
Background Transparent: "false"
Background Image Opacity: 1
Background Auto Color: "false"
Pattern Outer Global Color: "#e1622f"
Pattern Inner Global Color: "#aa5b71"
Pattern Outer Top Left Color: "#aa5b71"
Pattern Inner Top Left Color: "#b7d28d"
Pattern Inner Top Right Color: "#c17e61"
Aligment Outer Color: "#27408B"
Aligment Inner Color: "#7D26CD"
Timing Horizontal Color: #ff6600"
Timing Vertical Color: #cc0033"

QR code Shortcode

[htqrcode qrcode = "Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="54" logo_bg_color="#FFFACD" logo_bg_transparent="false" qr_bg_opacity="1" colordark="#27408B" colorlight="#FFF8DC" qr_bg_autoColor="true" dot_scale="0.5" po="#e1622f" pi="#aa5b71" pi_tl="#b7d28d" po_tr="#aa5b71" pi_tr="#c17e61" timing_h="#ff6600" timing_v="#cc0033"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="54" logo_bg_color="#FFFACD" logo_bg_transparent="false" qr_bg_opacity="1" colordark="#27408B" colorlight="#FFF8DC" qr_bg_autoColor="true" dot_scale="0.5" po="#e1622f" pi="#aa5b71" pi_tl="#b7d28d" po_tr="#aa5b71" pi_tr="#c17e61" timing_h="#ff6600" timing_v="#cc0033"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""

QR code Setting Style14: QuietZone + Logo + Background

QR code Setting

QR Dot Color: "#27408B"
Background Color: "#ffffff"
QR Code Dot Scale: 0.5
Logo: Please Add Your Logo.
Logo Background Color: "#FFF8DC"
Logo Background Transparent: "false"
Background Image: Please Add Background Image.
Background Image Opacity: 0.3
Background Auto Color: "true"
Pattern Outer Global Color: "#e1622f"
Pattern Inner Global Color: "#aa5b71"
Pattern Outer Top Left Color: "#aa5b71"
Pattern Inner Top Left Color: "#b7d28d"
Pattern Inner Top Right Color: "#c17e61"
Aligment Outer Color: "#27408B"
Aligment Inner Color: "#7D26CD"
Timing Horizontal Color: #ff6600"
Timing Vertical Color: #cc0033"

QR code Shortcode

[htqrcode qrcode="Your Text here..." logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="54" logo_bg_color="#FFF8DC" logo_bg_transparent="false" qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="0.3" colordark="#000000" colorlight="#ffffff" dot_scale ="0.7" qr_bg_opacity="0.1" qr_bg_autocolor="false" po="#e1622f" pi="#aa5b71" po_tl="#aa5b71" pi_tl="#b7d28d" pi_tr="#c17e61" ao="#27408B" ai="#7D26CD" timing_h ="#ff6600" timing_v ="#cc0033" quietzone="30" quietzonecolor="#00CED1"]
OR
[htqrcode logo="https://plugindemo.hasthemes.com/yourLogoHere.png" logo_size="54" logo_bg_color="#FFF8DC" logo_bg_transparent="false" qr_bg_image="https://plugindemo.hasthemes.com/yourBackroundImageHere.png" qr_bg_opacity="0.3" colordark="#000000" colorlight="#ffffff" dot_scale ="0.7" qr_bg_opacity="0.1" qr_bg_autocolor="false" po="#e1622f" pi="#aa5b71" po_tl="#aa5b71" pi_tl="#b7d28d" pi_tr="#c17e61" ao="#27408B" ai="#7D26CD" timing_h ="#ff6600" timing_v ="#cc0033" quietzone="30" quietzonecolor="#00CED1"]Your Text here...[/htqrcode]

Please Enter your logo URL here logo=""
Please Enter your Background Image URL here qr_bg_image=""