Rich Snippets Structured Data PWA Studio for Magento Adobe Commerce

Compatible with Magento v2 Adobe Commerce - Open Source (CE), Commerce on-prem (EE), and Commerce on Cloud (ECE)!

Provides Apptrian Rich Snippets Structured Data extension functionality to PWA Studio. Requires both original (base) extension and GraphQL (add-on) extension to be installed. The Rich Snippets (Rich Results) are enhanced search results that provide additional information to searchers on the contents of the web page. Google and other search engines use structured data, contained within the HTML or Javascript of a web page to form these snippets. Apptrian Rich Snippets extension for Magento adds Google Rich Snippets Schema.org JSON-LD structured data to the product, category, contact, home, and CMS pages. Our extension allows your site to pass both Rich Results Test and Schema Markup Validator test, including the Rich Results > Merchant Listings test. The Rich Snippets structured data is also used by Pinterest, TikTok, and many others. There are dozens of options for customization. This extension provides your Magento site not only with social improvements but also has great SEO value. All of the snippets are generated automatically based on the data in your Magento database. Like all of our extensions, it is multistore compatible, works on any theme, it does not override nor overwrite anything. Functionality is injected via layout updates as Magento best practices recommend.

Compatible with PWA Studio (Venia) frontend without the need for any additional coding. It works out of the box.

Features

General Settings

• An easy way to enable or disable the extension.
• All data needed for Google Rich Snippets is parsed from Magento and Schema.org JSON-LD objects are generated automatically.
• Multiselect option to add Google Rich Snippets for the product, category, contact, home, and/or cms pages.
• Option to select the Author object type (Organization or Person).
• Option to type in Author Name (author.name).
• Option to type in Author URL (author.url).
• Option to select the Author Logo (author.logo).
• Option to select the Publisher object type (Organization or Person).
• Option to type in Publisher Name (publisher.name).
• Option to type in Publisher URL (publisher.url).
• Option to select the Publisher Logo (publisher.logo).

Breadcrumb (BreadcrumbList) Structured Data

• Multiselect option to add the Breadcrumb (BreadcrumbList) structured data for the product, category, contact, home, and/or cms pages.
• Option to enable multiple breadcrumb trails for a single page.
• Option to select behavior if the category or categories within the path are not active.
  • Enable All Regardless of Category Status
  • Disable Breadcrumb Item Only
  • Disable Entire Breadcrumb Trail

Category Page Structured Data

• Option to select the Category page object type (Article or WebPage).
• Option to type in the category attribute code you want to use for the name property.
• Option to type in the category attribute code you want to use for the description property.
• Option to type in the category attribute code to use for the image (ImageObject).
• Option to type in the additional structured data for the category pages.

CMS Page Structured Data

• Option to select the CMS page object type (Article or WebPage).
• Option to type in the CMS page attribute code you want to use for the name property.
• Option to type in the CMS page attribute code you want to use for the description property.
• Option to limit the number of images on the CMS pages schema.
• Option to type in the additional structured data for the CMS pages.

Contact Page Structured Data

• Option to type in the page handle (full action name) of your contact page.
• Option to type in the structured data for the contact page.

Home Page Structured Data

• Option to select the home page object type (Article, WebPage, or WebSite).
• Option to type in the home page attribute code you want to use for the name property.
• Option to type in the home page attribute code you want to use for the description property.
• Option to limit the number of images on the home page schema.
• Option to type in the additional structured data for the home page.

Product Page Structured Data

• Product pages are done as Product objects.
• Option to type in the Product attribute code you want to use for the name property.
• Option to type in the Product attribute code you want to use for the description property.
• Option to limit the number of images on Product pages schema.
• Products will use a full-size primary image.
• Option for product Rating Normalization. Enabling this option will convert the product rating to the default Google rating (0 to 5) instead of (0 to 100).
• Option to type the attribute code you want to use for the brand property.
• Option to type default text for the brand property value. (It is used if an attribute is empty.)
• Option to type the attribute code you want to use for the availability property. (If left empty determination will be made based on the default Magento getIsInStock() method.)
• Option to match availability values to defined ones: BackOrder, Discontinued, InStock, InStoreOnly, LimitedAvailability, OnlineOnly, OutOfStock, PreOrder, PreSale, and SoldOut.
• Option to type the attribute code you want to use for the category property.
• Option to type default category for the category property value. (It is used if an attribute is empty.)
• Option to type the attribute code you want to use for the condition property.
• Option to match condition values to defined ones: NewCondition, RefurbishedCondition, UsedCondition, and DamagedCondition.
• Option to type the attribute code you want to use for the gtin (Global Trade Item Number) property.
• Option to type the attribute code you want to use for the gtin8 (Global Trade Item Number) property.
• Option to type the attribute code you want to use for the gtin12 (Global Trade Item Number) property.
• Option to type the attribute code you want to use for the gtin13 (Global Trade Item Number) property.
• Option to type the attribute code you want to use for the gtin14 (Global Trade Item Number) property.
• Option to type the attribute code you want to use for the manufacturer property.
• Option to type the attribute code you want to use for the mpn property.
• Option to type the attribute code you want to use for the productID property.
• Option to type the attribute code you want to use for the sku property.
• Option to type the attribute code you want to use for the depth property.
• Option to type the attribute code you want to use for the width property.
• Option to type the attribute code you want to use for the height property.
• Option to type the allowed units for product dimensions.
• Option to type the default unit for product dimensions.
• Option to type the attribute code you want to use for the weight property.
• Option to type the allowed units for product weight.
• Option to type the default unit for product weight.
• Option to use offers.price property.
• Option to use offers.priceSpecification object.
• Options to select which product type should use minPrice and maxPrice properties. (Separate option for bundle, configurable, downloadable, grouped, simple, and virtual.)
• Options to use minPrice and maxPrice properties only if minimum and maximum prices are different. (Separate option for bundle, configurable, downloadable, grouped, simple, and virtual.)
• Option to format price value as a string with zeros (Example: 7.00).
• Option to type price precision (number of decimal places).
• Option to type the attribute code you want to use for the priceValidUntil property.
• Option to type default text for the priceValidUntil property value. (It is used if an attribute is empty.)
• Option for additional properties to attributes mapping. Example: color=color|pattern=pattern. As you can see the format is simple property1=attribute1|property2=attribute2 The property and Magento product attribute are connected by = sign and pairs are separated by | sign.
• Option to enable shippingDetails and select standard shippingDetails or advanced shippingDetails.
• Standard shippingDetails
  • Option to type the attribute code you want to use for the handlingTime.minValue property.
  • Option to type default value for the handlingTime.minValue property value. (It is used if an attribute is empty.)
  • Option to type the attribute code you want to use for the handlingTime.maxValue property.
  • Option to type default value for the handlingTime.maxValue property value. (It is used if an attribute is empty.)
  • Option to type value for the handlingTime.unitCode property.
  • Option to type the attribute code you want to use for the transitTime.minValue property.
  • Option to type default value for the transitTime.minValue property value. (It is used if an attribute is empty.)
  • Option to type the attribute code you want to use for the transitTime.maxValue property.
  • Option to type default value for the transitTime.maxValue property value. (It is used if an attribute is empty.)
  • Option to type value for the transitTime.unitCode property.
  • Option to type value for the shippingDestination.addressCountry property.
  • Option to type the attribute code you want to use for the shippingRate property.
  • Option to type default value for the shippingRate property value. (It is used if an attribute is empty.)
  • Option to use shippingRate.maxValue instead of shippingRate.value property.
• Advanced shippingDetails
  • Option to type the attribute code you want to use for the shippingDetails property.
  • Option to type default value for the shippingDetails property value. (It is used if an attribute is empty.)
• Option to enable hasMerchantReturnPolicy and select standard hasMerchantReturnPolicy or advanced hasMerchantReturnPolicy.
• Standard hasMerchantReturnPolicy
  • Option to type value for the applicableCountry property.
  • Option to select a value for the returnPolicyCategory property. (MerchantReturnFiniteReturnWindow, MerchantReturnNotPermitted, or MerchantReturnUnlimitedWindow)
  • Option to type value for the merchantReturnDays property.
  • Option to select a value for the returnMethod property. (Disable returnMethod, ReturnAtKiosk, ReturnByMail, or ReturnInStore)
  • Option to select a value for the returnFees property. (Disable returnFees, or FreeReturn)
  • Option to type the attribute code you want to use for the returnShippingFeesAmount property.
  • Option to type default value for the returnShippingFeesAmount property value. (It is used if an attribute is empty.)
• Advanced hasMerchantReturnPolicy
  • Option to type the attribute code you want to use for the hasMerchantReturnPolicy property.
  • Option to type default value for the hasMerchantReturnPolicy property value. (It is used if an attribute is empty.)
• Option to type in the additional structured data for the product pages.

Installation Instructions

This extension is not a standalone extension. It is an add-on extension. Requires both original (base) extension and GraphQL (add-on) extension. Please do not attempt to install it before the required extensions. Once you installed both the original (base) extension and GraphQL (add-on) extension, you may proceed.

There are several ways you can install any Magento extension. Our extension is no different. We will show you three ways to install the extension, but you must not mix them. Choose one and stick to it.

If you do not know how to install an extension or you wish a professional to do it for you, we offer an additional installation service for a small fee.

Installation via file uploading
(If you purchased the extension on our site)

Step 1. Backend installation instructions

If you purchased the extension on our site, unpack the .zip file from /Magento2/InstallByUploadingFiles/ directory inside your Magento root.
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

php bin/magento module:enable --clear-static-content Apptrian_RichSnippetsPwaStudio

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Step 2. PWA Studio installation instructions

From your PWA Studio parent directory, create the extensions/@apptrian directory and copy the JavaScript module (React package) available in the pwa-studio/@apptrian directory. (You can get it from /path/to/MAGENTO_ROOT/app/code/Apptrian/RichSnippetsPwaStudio/pwa-studio/@apptrian, or if you do not have access to this directory, it is also in a .zip file you downloaded in Step 1.)

mkdir -p extensions/@apptrian
cp -r /path/to/package/@apptrian/rich-snippets-pwa-studio extensions/@apptrian/rich-snippets-pwa-studio

Then, go to your PWA Studio root directory.

cd your-pwa-studio

Edit the package.json file in your-pwa-studio directory and add @apptrian to the trusted-vendors array. (It is usually near the end of the file.)

{
    ...
    "pwa-studio": {
        "targets": {
          "intercept": "./local-intercept.js"
        },
        "trusted-vendors": [
          "@apptrian"
        ]
    }
}

If you do not have the trusted-vendors array, add it exactly as presented above. If you already have the trusted-vendors array, add @apptrian at the end of it.

Add the extension to your project with yarn or npm, depending on which one you are using.

If you are using yarn

yarn add file:../extensions/@apptrian/rich-snippets-pwa-studio

If you are using npm

npm install -f ../extensions/@apptrian/rich-snippets-pwa-studio

Installation via Composer
(If you purchased the extension on our site)

Step 1. Backend installation instructions

If you purchased the extension on our site and you want to install the extension via composer public and private keys. (To find your public and private keys, login to your Apptrian.com customer account and look at the My Downloadable Products section.)
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

composer config --auth http-basic.packages.apptrian.com $PUBLIC_KEY $PRIVATE_KEY

composer config repositories.apptrian-rich-snippets-pwa-studio composer https://packages.apptrian.com/rich-snippets-pwa-studio/

composer require apptrian/rich-snippets-pwa-studio

php bin/magento module:enable --clear-static-content Apptrian_RichSnippetsPwaStudio

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Step 2. PWA Studio installation instructions

From your PWA Studio parent directory, create the extensions/@apptrian directory and copy the JavaScript module (React package) available in the pwa-studio/@apptrian directory. (You can get it from /path/to/MAGENTO_ROOT/vendor/apptrian/rich-snippets-pwa-studio/pwa-studio/@apptrian, or if you do not have access to this directory, it is also in a .zip file you can download from your account on our site in the My Downloadable Products section.)

mkdir -p extensions/@apptrian
cp -r /path/to/package/@apptrian/rich-snippets-pwa-studio extensions/@apptrian/rich-snippets-pwa-studio

Then, go to your PWA Studio root directory.

cd your-pwa-studio

Edit the package.json file in your-pwa-studio directory and add @apptrian to the trusted-vendors array. (It is usually near the end of the file.)

{
    ...
    "pwa-studio": {
        "targets": {
          "intercept": "./local-intercept.js"
        },
        "trusted-vendors": [
          "@apptrian"
        ]
    }
}

If you do not have the trusted-vendors array, add it exactly as presented above. If you already have the trusted-vendors array, add @apptrian at the end of it.

Add the extension to your project with yarn or npm, depending on which one you are using.

If you are using yarn

yarn add file:../extensions/@apptrian/rich-snippets-pwa-studio

If you are using npm

npm install -f ../extensions/@apptrian/rich-snippets-pwa-studio

Installation via Composer
(If you purchased the extension on Adobe Commerce Marketplace)

Step 1. Backend installation instructions

If you purchased the extension on Adobe Commerce Marketplace then you must use Composer. Adobe Commerce Marketplace does not allow extension downloads.
- Run the following commands on the Magento root directory:

php bin/magento maintenance:enable

composer require apptrian/rich-snippets-pwa-studio

php bin/magento module:enable --clear-static-content Apptrian_RichSnippetsPwaStudio

php bin/magento setup:upgrade

php bin/magento cache:flush

php bin/magento setup:static-content:deploy

php bin/magento maintenance:disable

php bin/magento cache:flush

Please make sure your Magento public and private keys are in your Magento root auth.json file. Usually, people install Magento with one Adobe Commerce Marketplace account (public and private keys) and then purchase an extension with another Adobe Commerce Marketplace account (different public and private keys). Check the Adobe Commerce Marketplace account you used to purchase the extension and make sure its public and private keys are in the Magento root auth.json file. WARNING! If you already have keys there, be very careful because maybe some other extensions are purchased with another Adobe Commerce Marketplace account.

Step 2. PWA Studio installation instructions

From your PWA Studio parent directory, create the extensions/@apptrian directory and copy the JavaScript module (React package) available in the pwa-studio/@apptrian directory. (You can get it from /path/to/MAGENTO_ROOT/vendor/apptrian/rich-snippets-pwa-studio/pwa-studio/@apptrian, or if you do not have access to this directory, use composer to download the package to your computer. If you get stuck, use the contact form on our site and provide your order number and full name as it is on order, and we will provide you with further instructions.)

mkdir -p extensions/@apptrian
cp -r /path/to/package/@apptrian/rich-snippets-pwa-studio extensions/@apptrian/rich-snippets-pwa-studio

Then, go to your PWA Studio root directory.

cd your-pwa-studio

Edit the package.json file in your-pwa-studio directory and add @apptrian to the trusted-vendors array. (It is usually near the end of the file.)

{
    ...
    "pwa-studio": {
        "targets": {
          "intercept": "./local-intercept.js"
        },
        "trusted-vendors": [
          "@apptrian"
        ]
    }
}

If you do not have the trusted-vendors array, add it exactly as presented above. If you already have the trusted-vendors array, add @apptrian at the end of it.

Add the extension to your project with yarn or npm, depending on which one you are using.

If you are using yarn

yarn add file:../extensions/@apptrian/rich-snippets-pwa-studio

If you are using npm

npm install -f ../extensions/@apptrian/rich-snippets-pwa-studio

Configuration

Our extension works out of the box. If you want to configure it differently log to your Magento Admin and go to:

Stores > Configuration > Apptrian Extensions > Rich Snippets Structured Data

There are more than several options for customization. They are all self-explanatory and have comments and tooltips.

After changing options make sure you refresh your Magento cache.

FAQ

Q: Does the extension work with multi-store setups?
A: Yes, it does work with multi-store setups. It functions in the same way as the core Magento modules, and it is fully automated.