Title: AR Button – AR Product Preview &amp; Configurator
Author: arbutton
Published: <strong>Agosti 10, 2026</strong>
Last modified: Agosti 11, 2026

---

Tafuta vijalizi

![](https://ps.w.org/arbutton/assets/banner-772x250.png?rev=3641189)

![](https://ps.w.org/arbutton/assets/icon-256x256.png?rev=3641189)

# AR Button – AR Product Preview & Configurator

 By [arbutton](https://profiles.wordpress.org/arbutton/)

[Pakua](https://downloads.wordpress.org/plugin/arbutton.1.0.8.zip)

 * [Details](https://sw.wordpress.org/plugins/arbutton/#description)
 * [Reviews](https://sw.wordpress.org/plugins/arbutton/#reviews)
 *  [Installation](https://sw.wordpress.org/plugins/arbutton/#installation)
 * [Development](https://sw.wordpress.org/plugins/arbutton/#developers)

 [Saidia](https://wordpress.org/support/plugin/arbutton/)

## Maelezo

AR Button adds a 3D product viewer and augmented reality preview to any WordPress
site. Your customers tap the button, point their phone camera at a wall or floor,
and see the product at true scale in their own space — directly in the mobile browser,
no app download required.

**Free to start:** the Starter plan includes 100 AR previews per month, no credit
card required.

**From flat print products to configurable 3D objects:** posters, framed art, canvas
prints, wallpaper, tiles, flooring, carpets, wall decals, doors, fences, garden 
houses, carports, packaging, signage, rollups, business cards, flyers and more. 
Use it on WooCommerce product pages, Elementor layouts, Gutenberg pages, or any 
WordPress page with a shortcode.

#### AR Product Preview & Configurator

For simple products (posters, prints, rollups), AR Button works as a true-to-scale
preview — customers see the exact product on their wall before ordering. For configurable
products (tiles, doors, fences, garden houses, carports), enable the built-in AR
controls and it becomes a full product configurator — your customers can change 
colors, frame styles, materials, dimensions and finishes interactively, and see 
every change live in augmented reality.

#### Why AR Button?

 * **Reduce returns** — customers see the real size and how it looks in their room
   before ordering
 * **Increase conversions** — interactive AR previews keep visitors engaged and 
   build buying confidence
 * **No app needed** — runs 100% in the mobile browser (iOS Safari, Android Chrome)
 * **No file upload** — images are loaded via URL, nothing is uploaded to any server
 * **100% GDPR-compliant** — fully client-side, no personal data collected or processed
 * **One-click WooCommerce** — enable auto-embed on all product pages with a single
   checkbox

#### How It Works

 1. Install the plugin and enter your free API key
 2. Choose where the AR button appears (after Add to Cart, in the product summary, 
    or anywhere via shortcode)
 3. The plugin automatically uses your product image — no manual setup per product
 4. Customers tap the button, point their camera, and see the product at real scale
    on their wall

On desktop, a QR code is shown so customers can instantly open the AR preview on
their phone.

#### Four Ways to Place the Button

 * **WooCommerce auto-embed** — one checkbox, every product page gets an AR button
   automatically
 * **Gutenberg block** — drag and drop the AR Button block into any page or post
 * **Elementor widget** — full AR Button widget with all options in the Elementor
   editor
 * **Shortcode** — `[arbutton]` works anywhere, with full attribute control

#### Built for Developers

AR Button is a native Web Component (`<ar-button>`). Every product attribute — size,
color, frame style, texture, finish — is controlled via DOM attributes and can be
changed dynamically in real time. Six WordPress filters let you extend templates,
image sources, and loader URLs without touching plugin code.

#### Product Templates

Pre-configured product types for one-click setup:

 * **Poster** — flat prints, photos, art prints
 * **Framed image** — framed art with customizable frame color, material, finish,
   passepartout and glass
 * **Door** — interior and exterior doors with placement pane
 * **Rollup** — banner stands and rollup displays
 * **Business card** — front and back preview
 * **Flyer / Folder** — brochures and folders
 * **Packaging** — product boxes and packaging

#### Automatic Image Sources

No need to set images manually. The plugin resolves the product image automatically
from:

 * WooCommerce main product image
 * WooCommerce gallery (first or last image)
 * WordPress featured image
 * Custom field (post meta)
 * ACF image field

#### Full Styling Control

Match the AR button to your shop design. All colors (primary, hover, active), border
radius, border width, and text size are configurable from the admin panel — or override
per button via shortcode attributes.

#### Who Is This For?

 * **Print shops & online printers** — posters, canvas prints, photo products, business
   cards, flyers
 * **Art galleries & frame shops** — framed art, canvas, limited editions
 * **Home & interior retailers** — wallpaper, tiles, flooring, carpets, wall decals
 * **Outdoor & construction** — doors, garden fences, garden houses, carports, signage
 * **Trade show & display** — rollups, banners, booth graphics, exhibition displays
 * **Packaging & merchandise** — product boxes, custom merch, promotional items
 * **Any e-commerce shop** — WooCommerce, or any WordPress site with product images

AR Button works on any WordPress site. WooCommerce integration is built in but optional.
The AR Button Web Component also works with Shopify, Shopware, Magento, Webflow 
and plain HTML (outside of this plugin).

#### Links

 * [Website & Live Demo](https://www.ar-button.com)
 * [Documentation](https://api.ar-button.com/v1/readme/README.md)
 * [Get your free API key](https://www.ar-button.com/#pricing)
 * [Support](https://sw.wordpress.org/plugins/arbutton/peter@ar-button.com?output_format=md)

### External services

This plugin relies on the AR Button service (provided by the plugin author) to display
augmented reality product previews. Without these external resources, the AR button
cannot load or run.

#### CDN (cdn.ar-button.com)

The plugin loads the AR Button JavaScript loaders from `https://cdn.ar-button.com`
whenever an AR Button is rendered on the front end (or previewed in the admin settings).
These scripts are required to register the `<ar-button>` / `<ar-button-controls>`
web components and start the AR experience.

When the scripts are requested, the visitor’s browser performs a normal HTTPS request
to the CDN (standard request metadata such as IP address and User-Agent may be processed
by the CDN for delivery and security). No WordPress site content or customer account
data is uploaded by the plugin for this request.

Service provider: AR Button
 Terms of service: https://www.ar-button.com/terms/ 
Privacy policy: https://www.ar-button.com/privacy-policy/

#### API (api.ar-button.com)

After the loaders are loaded, the AR Button scripts connect to `https://api.ar-button.
com` to validate the configured Public Key and to provide AR preview functionality(
including product image URLs and product configuration attributes such as dimensions,
colors, and template settings that are set on the button).

This happens when a visitor views a page that contains an AR Button and interacts
with / opens the AR preview. The Public Key configured in the plugin settings is
included so the service can identify the site account and apply plan limits.

Service provider: AR Button
 Terms of service: https://www.ar-button.com/terms/ 
Privacy policy: https://www.ar-button.com/privacy-policy/

## Screenshots

[⌊AR Product Preview and Configurator — customers preview products on their wall
and configure frame, print, finish and mat color in real time⌉⌊AR Product Preview
and Configurator — customers preview products on their wall and configure frame,
print, finish and mat color in real time⌉[

AR Product Preview and Configurator — customers preview products on their wall and
configure frame, print, finish and mat color in real time

[⌊Digital Twin AR Viewer — place a true-to-scale digital twin of any room or space
in augmented reality⌉⌊Digital Twin AR Viewer — place a true-to-scale digital twin
of any room or space in augmented reality⌉[

Digital Twin AR Viewer — place a true-to-scale digital twin of any room or space
in augmented reality

[⌊Garden House AR Configurator — customers choose type, roof style and wall cladding,
then see the result live in AR⌉⌊Garden House AR Configurator — customers choose 
type, roof style and wall cladding, then see the result live in AR⌉[

Garden House AR Configurator — customers choose type, roof style and wall cladding,
then see the result live in AR

[⌊Solar Carport AR Configurator — configure modules, colors, materials, dimensions
and offsets with live AR feedback⌉⌊Solar Carport AR Configurator — configure modules,
colors, materials, dimensions and offsets with live AR feedback⌉[

Solar Carport AR Configurator — configure modules, colors, materials, dimensions
and offsets with live AR feedback

[⌊Textile and Clothing AR Preview — preview fabrics and clothing items in augmented
reality⌉⌊Textile and Clothing AR Preview — preview fabrics and clothing items in
augmented reality⌉[

Textile and Clothing AR Preview — preview fabrics and clothing items in augmented
reality

[⌊AR Quick Look on iOS — framed art viewed as a 3D object, rotatable and zoomable
on any surface⌉⌊AR Quick Look on iOS — framed art viewed as a 3D object, rotatable
and zoomable on any surface⌉[

AR Quick Look on iOS — framed art viewed as a 3D object, rotatable and zoomable 
on any surface

[⌊Live AR Wall Preview — a framed art print placed on a real wall using the phone
camera⌉⌊Live AR Wall Preview — a framed art print placed on a real wall using the
phone camera⌉[

Live AR Wall Preview — a framed art print placed on a real wall using the phone 
camera

[⌊Wall Panel in AR — a wall-mounted panel placed at true scale on a real wall⌉⌊Wall
Panel in AR — a wall-mounted panel placed at true scale on a real wall⌉[

Wall Panel in AR — a wall-mounted panel placed at true scale on a real wall

[⌊Rollup Display in 3D — banner stands and rollup displays rendered in a realistic
environment⌉⌊Rollup Display in 3D — banner stands and rollup displays rendered in
a realistic environment⌉[

Rollup Display in 3D — banner stands and rollup displays rendered in a realistic
environment

[⌊Print Products in 3D — business cards, flyers, folders and rollups displayed together⌉⌊
Print Products in 3D — business cards, flyers, folders and rollups displayed together⌉[

Print Products in 3D — business cards, flyers, folders and rollups displayed together

## Bloku

Kijalizi hiki kinawezesha bloku 1.

 *   AR Button Displays an AR Button for 3D / augmented reality product previews.

## Installation

 1. Upload the `arbutton` folder to `/wp-content/plugins/`, or install directly from
    the WordPress plugin directory
 2. Activate the plugin through the **Plugins** menu
 3. Go to **AR Button** in the sidebar and enter your Public Key (get a free one at
    [ar-button.com](https://www.ar-button.com/#pricing))
 4. For WooCommerce: enable **Show button automatically on product pages** in the WooCommerce
    section

That’s it. Every product page now has an AR preview button.

## FAQ

### Do my customers need to download an app?

No. AR Button works directly in the mobile browser. Your customers tap the button
on your product page and the AR preview opens instantly — no download, no setup,
no friction.

### Is it free?

The Starter plan is free — 100 AR previews per month, no credit card required. Paid
plans start at €49/month. Get your free API key at [ar-button.com](https://www.ar-button.com/#pricing).

### Does it work with WooCommerce?

Yes. Enable the WooCommerce auto-embed with one checkbox and every product page 
gets an AR button automatically. The plugin uses the product’s main image (or gallery
image) — no manual configuration needed per product.

### Which devices support AR?

AR preview works on iPhones (iOS 12+, Safari) and Android phones (ARCore-capable,
Chrome). On desktop browsers, a QR code is shown so users can scan and open the 
preview on their phone.

### Is it GDPR-compliant?

Yes, 100%. AR Button runs entirely client-side in the browser. No personal data 
is collected, stored or sent to any server. No cookies, no tracking, no server-side
processing.

### Can I customize the button styling?

Yes. All colors (primary, secondary, text, border, hover, active states), border
radius, border width, text size and button label are configurable from the admin
panel. You can also override any attribute per button via shortcode.

### Does it work with Elementor?

Yes. AR Button includes a dedicated Elementor widget with all options. It also works
as a Gutenberg block and as a shortcode.

### What image formats are supported?

JPG, PNG, TIFF, PDF, WebP, GIF, BMP, TGA and SVG. The image URL must be publicly
accessible.

### Can I use it for products other than posters?

Yes. AR Button supports posters, framed images, canvas prints, rollups, business
cards, flyers, folders, packaging, doors and more. Each product type has a pre-configured
template with appropriate 3D settings.

### How accurate is the AR preview?

True to scale. If you set a product to 60×90cm, it appears at exactly 60×90cm in
the customer’s room. This helps customers judge size, color and placement before
buying.

## Reviews

![](https://secure.gravatar.com/avatar/5d98988ae7dd913a5f6831313cd6a08df63ba393a6a82d6d9c467bf7b216f675?
s=60&d=retro&r=g)

### 󠀁[Customers finally get the size right](https://wordpress.org/support/topic/customers-finally-get-the-size-right/)󠁿

 [petpod2026](https://profiles.wordpress.org/petpod2026/) Agosti 11, 2026

When selling framed art prints, people constantly ask whether a piece would fit 
above their sofa. With AR button on your product page, they just hold it up against
their own wall themselves, and setting it up takes only ten minutes.

 [ Soma maoni yote 1 ](https://wordpress.org/support/plugin/arbutton/reviews/)

## Wachangiaji & Wasanidi

“AR Button – AR Product Preview & Configurator” is open source software. The following
people have contributed to this plugin.

Contributors

 *   [ arbutton ](https://profiles.wordpress.org/arbutton/)

[Translate “AR Button – AR Product Preview & Configurator” into your language.](https://translate.wordpress.org/projects/wp-plugins/arbutton)

### Interested in development?

[Browse the code](https://plugins.trac.wordpress.org/browser/arbutton/), check out
the [SVN repository](https://plugins.svn.wordpress.org/arbutton/), or subscribe 
to the [development log](https://plugins.trac.wordpress.org/log/arbutton/) by [RSS](https://plugins.trac.wordpress.org/log/arbutton/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.0.8

 * Reworded product list intro (garden houses, carports and doors are 3D objects,
   not front-image products)

#### 1.0.7

 * Updated plugin directory presentation (readme, tags, YouTube video)
 * Added directory screenshots

#### 1.0.6

 * Restored languages folder for Domain Path header
 * Avoided Plugin Check false positive on image source context key

#### 1.0.5

 * Removed WordPress.org directory banner/icon assets from the plugin package
 * Documented CDN and API external services in readme.txt with terms and privacy
   links

#### 1.0.4

 * Removed hidden `.gitkeep` file that failed WordPress.org automated checks

#### 1.0.3

 * Plugin URI and Author URI now point to different pages (WordPress.org requirement)

#### 1.0.2

 * Shortcode uses prefixed tag `[arbutton]` (no unprefixed `ar_button`)
 * Confirmed unique `arbutton`/`ARBUTTON_` prefix across plugin APIs
 * Admin menu icon uses base64 SVG data URI so WordPress can match the color scheme

#### 1.0.1

 * Consistent `arbutton` prefix for classes, constants, options, hooks, and settings
   IDs
 * Shortcode renamed to `[arbutton]` (replaces `ar_button`)
 * Text domain aligned to slug `arbutton`

#### 1.0.0

 * Initial release
 * Admin settings page with full styling control (colors, border, text size)
 * Automatic image source resolution (WooCommerce, featured image, ACF, custom fields)
 * Product behavior defaults (3D viewer, zoom, drag icon, placing pane)
 * Product templates: poster, framed image, door, rollup, business card, flyer, 
   folder, packaging
 * WooCommerce auto-embed with configurable hook position
 * Gutenberg block with automatic image and template selection
 * Elementor widget with full attribute support
 * Shortcode `[arbutton]` with all attributes
 * Developer filters for templates, image sources and loader URLs
 * Lightweight: no admin bloat, no upsell notices, no tracking

## Meta

 *  Version **1.0.8**
 *  Last updated **1 saa zilizopita**
 *  Active installations **Chini ya 10**
 *  WordPress version ** 5.8 au juu **
 *  Tested up to **7.0.3**
 *  PHP version ** 7.4 au juu **
 *  Language
 * [English (US)](https://wordpress.org/plugins/arbutton/)
 * Tags
 * [3d](https://sw.wordpress.org/plugins/tags/3d/)[Augmented Reality](https://sw.wordpress.org/plugins/tags/augmented-reality/)
   [Product Configurator](https://sw.wordpress.org/plugins/tags/product-configurator/)
   [product-preview](https://sw.wordpress.org/plugins/tags/product-preview/)[woocommerce](https://sw.wordpress.org/plugins/tags/woocommerce/)
 *  [Advanced View](https://sw.wordpress.org/plugins/arbutton/advanced/)

## Ratings

 5 out of 5 stars.

 *  [  1 5-star review     ](https://wordpress.org/support/plugin/arbutton/reviews/?filter=5)
 *  [  0 4-star reviews     ](https://wordpress.org/support/plugin/arbutton/reviews/?filter=4)
 *  [  0 3-star reviews     ](https://wordpress.org/support/plugin/arbutton/reviews/?filter=3)
 *  [  0 2-star reviews     ](https://wordpress.org/support/plugin/arbutton/reviews/?filter=2)
 *  [  0 1-star reviews     ](https://wordpress.org/support/plugin/arbutton/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/arbutton/reviews/#new-post)

[See all reviews](https://wordpress.org/support/plugin/arbutton/reviews/)

## Contributors

 *   [ arbutton ](https://profiles.wordpress.org/arbutton/)

## Saidia

Got something to say? Need help?

 [Angalia Baraza ya Usaidizi](https://wordpress.org/support/plugin/arbutton/)