Search: improve upgrade/feature messaging

[gibrown]

Fixes #9747

Makes changes to the upgrade messages. The exact language was iterated on a bit in Automattic/wp-calypso#27059 and this PR has them matching. Similar to that PR I also moved the site search settings further down on the page.

The changes affect the UI in the Jetpack dashboard:

• Main at a glance page wording changed a little bit when not upgraded
• On the Settings->Traffic page the wording changed a lot both when activated and not

Screenshots of the new upgrade wording:

[jetpackbot]

	Warnings
⚠️	"Testing instructions" are missing for this PR. Please add some
⚠️	"Proposed changelog entry" is missing for this PR. Please include any meaningful changes

This is automated check which relies on PULL_REQUEST_TEMPLATE.We encourage you to follow that template as it helps Jetpack maintainers do their job. If you think 'Testing instructions' or 'Proposed changelog entry' are not needed for your PR - please explain why you think so. Thanks for cooperation 🤖

Generated by 🚫 dangerJS

[joanrho]

@gibrown LGTM, but I just pushed some changes to the labels and descriptive text so we refer to it as Jetpack Search more explicitly. Here are screenshots of my changes:

^ you'll notice that I missed the header label text (dops-section-header__label-text) under the Traffic tab of Settings. I didn't want to mess around too much with renaming any files, so I'll leave that last one for you to do.

[jeherve]

Do we want do update the messaging in the prompt in the Plans page while we are at it?

We could also look at the widget's description:

[jeherve]

This seems to work. I just have a small comment about one of the links.

Also, not something we can fix in Jetpack but I'll mention it since it is somewhat related: the 2 "get started" buttons on the upgrade page we link to (https://jetpack.com/features/design/elasticsearch-powered-search/) from the upgrade prompts in the traffic settings once your site is connected don't actually do anything. They just link to the #get-started anchor on the page.

I ended up scrolling down to the bottom of the page to click on the "Get Search in Jetpack Professional" button, but that wasn't a successful flow either. It led me to a connect page, although my site is already connected. Since the previous Jetpack.com landing page had my site URL as a query string in the URL, I at least would expect my site to be pre-filled here. Here is the URL:

https://wordpress.com/jetpack/connect/pro?cta_id=btn-singlefeature-jpsearch-02&cta_from=features_design_elasticsearch_powered_search

As it is, it is quite difficult to upgrade.
For reference, I was using a Jurassic Ninja site that was running this branch, and that I had just connected to WordPress.com a few minutes earlier. I also had purchased a Premium plan for it.

[jeherve]

Should we link to the customization support page here? https://jetpack.com/support/search/customize-search/

[joanrho]

@jeherve agree that both the Plans page and widget description should both be updated. Thanks for catching those!

You bring up a great point about the upgrade experience from that jetpack.com page—ideally we'd be able to detect that you were logged in to WPcom and then take you to the Calypso checkout page for the upgrade from Prem to Pro at https://wordpress.com/checkout/SITEURL/professional?site=SITEURL. Is this possible to do from that CTA button? cc @jeffgolenski @sirreal @tyxla for their thoughts on this

[sirreal]

@joanrho That certainly sounds possible, but I'm not familiar with the Jetpack site and how much work might be involved. I took a quick look at the site and it doesn't appear to be a trivial change. @jeffgolenski is probably better equipped to answer that bit.

[gibrown]

@jeherve good call on the plans page. Fixed. I'm merging this in.