Submit business contact information to the Merchant Center - Lite Version

[jconroy]

From August 2nd, the Merchant Center will require additional contact information to be submitted during MC setup.

We’ll need to adjust the MC onboarding flow to account for this.

Link to internal design explorations

pbIy4N-1JA-p2

Link to Figma file below.

We'll start with the Lite version of the flow until phone verification is available.

Technical

Start with the Lite version of the flow until phone verification is available.

API related notes.

1. You should use Accounts.BusinessInformation to set phone numbers (deadline August 2nd).
2. Accounts.BusinessInformation doesn't have a separate country code field, this is inconsistent with the Merchant Center UI. You can include the country code within the phoneNumber field, e.g. format = "+[country_code][phone_number]".
3. In case merchants need to manually verify the phone number (this is the case if the merchant has been flagged for any SPAM policies), the merchant will need to do so within the Merchant Center UI for now as the phone verification API is still under development.

Frontend development tasks

• Clean up all TODO comments by searching TODO: [lite-contact-info]

Shared components

• Phone number card
  • Load phone number from API
  • Integrate with libphonenumber-js
  • Callback with phone number data to the consumer side
• Store address card
  • Load and reload address data from API

MC setup

• Change it to have four steps
• Integrate phone number and store address cards
• Move pre-launch checklist to step 4
• Verify form data and set the disabled states for next/submit buttons
• Integrate the form data with backend APIs
  • Handle the case that users already have store address and (verified) phone number from Google Merchant Center side

Settings

• Detect if it needs to show the no contact info notice or preview contact info on the main settings page
• Integrate phone number and store address cards
• Create a new sub-page to add contact information
• Verify form data and set the disabled state for the submit button
• Integrate with backend APIs

Backend development tasks

• API to allow frontend to retrieve the phone number
• API to allow frontend to retrieve address (might simply be available via wp-data already)
• API/Method/s to allow frontend to submit phone number and address to Google (initial onboarding when settings are saved)
• Backend edits for adding an additional step to onboarding... here and here
• Display issue under issues to resolve to existing users with no verified contact info
• Add inbox note to sites of existing users with no verified contact info

Figma link

https://mc.a8c.com/pb/29d12/

Event tracking

• Add event when phone number is added or edited - need to be able to track even when phone number is initially added vs already existing on an account
• Add event when clicking the edit store address button

[jconroy]

Added link to figma file - this is ready to start work on as a priority. There may be some final minor tweaks in the next few days but is ok to start.

[eason9487]

Users can set their business information at Google's Merchant Center console as well, and the phone number is able to verify there. Maybe we need to consider the case of user had finished the setup? Otherwise, we might override the verified phone number. 🤔

[j111q]

Are we able to detect during onboarding that they already have a verified number in GMC's console?

[layoutd]

Are we able to detect during onboarding that they already have a verified number in GMC's console?

It looks like the accounts.get endpoint returns a phone number value if it's been verified:
https://developers.google.com/shopping-content/reference/rest/v2.1/accounts/get

So we could detect a verified number during setup.

[layoutd]

So we could detect a verified number during setup.

To clarify, it looks like from the Merchant Center UI, you can only save a phone number by verifying it, but from the API you can save a phone number without verifying it. If a phone number is detected for the Merchant Center account, there are two options:

• Request confirmation to overwrite (similar to Site URL), or
• Assume that it's verified.

[j111q]

Got it. Added this screen in Figma:

So IF we detect a verified number, then we show the word "Verified" under the number.
If the user clicks "Edit", they are led to the same experience as New user.

Also, IF we detect a business address already in GMC, we should ignore it and populate the store address with the one we have in WooCommerce. The reason is because, let's not make them jump around editing things in different platforms. If they edit their address in WooCommerce settings, and it's different from whatever they put in GMC, we should override what's in GMC.

[eason9487]

Hey @j111q, there are some requirements might not be met.

1. The Verified state of phone number in the setup flow
   • According to Add Merchant Center phone number controller #896 (comment), we don't know if the phone number was verified nor was set from where.
   • Assume a user's number is +1 201-555-0123, and
     • If user had set and verified it via Google Merchant Center, the data got from API would be +12015550123
     • If user set it via the setup flow, the data got from API would be +12015550123
   • Both are the same. So we might not be able to show the Verified state correctly.
2. The phone number in settings page
   • According to Add Merchant Center phone number controller #896 (comment), if user updates their phone number via GLA settings page again, it might override the verified number and lose the country call code at Google Merchant Center side.

---

Possible options:

• For 1.
  • Show the phone number input field only. And update via API only if user change it during setup flow.
• For 2.
  • Prompt user to update their phone number only if the phone number is not set yet; Otherwise, hide the phone number from the settings page.
• For both
  • Ask Google side for more data? Such as verified state and country (calling) code.

[j111q]

Got it. 👍

Let's remove the "Verified" label completely for the Lite version then.
So if you already set it up through GMC, you will see this:

If you click edit, it will look like this, where the country code is empty (you have to fill it again):

If they put in a new number, we override their old verified number with this new, unverified number.

We want to allow users to edit the phone number anytime in their setting page just in case they change their number, or change admin owner, etc.

Let me know if that works.

[eason9487]

@j111q

If you click edit, it will look like this, where the country code is empty (you have to fill it again)

Could it be filled with existed country code and phone number? Then it would have consistency with the settings page.

If they put in a new number, we override their old verified number with this new, unverified number.

We want to allow users to edit the phone number anytime in their setting page just in case they change their number, or change admin owner, etc.

Supposed all uses whose number is unverified would be asked to complete the verification after the full version eventually. I think it's ok.

[j111q]

Could it be filled with existed country code and phone number? Then it would have consistency with the settings page.

Oh yes please, if we can do that, let's please do that!

[eason9487]

📝 Note for backend dev - Please let me know if we have a more proper constant for the new step:

google-listings-and-ads/js/src/setup-mc/setup-stepper/stepNameKeyMap.js

Lines 2 to 6 in 3adc30a

	accounts: '1',
	target_audience: '2',
	shipping_and_taxes: '3',
	// TODO: [lite-contact-info] double-check this key with backend dev.
	store_requirements: '4',

[jconroy]

Nice work all, I think we just need to land #928

[eason9487]

📝 Dev note: bug fixes (#936, #937, #938) have to be merged before release.

[tomalec]

We discussed on Slack with @ecgan that even though the track events description in the original issue state

Add event when phone number is added or edited - need to be able to track even when phone number…

not

Add event when phone number is added or edited, plus we need to be able to track the event when phone number…

It would be valuable to add another event. And track when the page is loaded with or without the phone number. So we could, track merchants leaving the setup/form as providing the phone number has a hurdle for them.

All phone-related events will be covered by #945