Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Get started page UX improvements: add features card #1440

Merged

Conversation

ianlin
Copy link
Member

@ianlin ianlin commented Apr 22, 2022

Changes proposed in this Pull Request:

Part of #1392, this PR adds the benefits card to the new get started page.

Design for desktop: eQ9O4m2flzrcAiDMXkOW0m-fi-7350%3A121114
Design for mobile: eQ9O4m2flzrcAiDMXkOW0m-fi-7476%3A122839

Screenshots:

Desktop

Screenshot 2022-04-22 at 17 47 20

Mobile

Screenshot 2022-04-22 at 17 47 53

Detailed test instructions:

  1. Go to GLA's get started page: https://domain.test/wp-admin/admin.php?page=wc-admin&path=%2Fgoogle%2Fstart
  2. Check the third card of the get started page, the UI should align with the design.

Testing for Tracking Events

  1. Open your console and run localStorage.setItem('debug', 'wc-admin*').
  2. Enable verbose mode in dev tool's console.
  3. Go to GLA's get started page: https://domain.test/wp-admin/admin.php?page=wc-admin&path=%2Fgoogle%2Fstart
  4. Click on the first Learn More, it should open a new tab to https://woocommerce.com/document/google-listings-and-ads/#google-smart-shopping-campaigns. From the dev console you should see an event is sent with link_id = get-started-features-free-listing-learn-more.
  5. Click on the second Learn More, it should open a new tab to https://woocommerce.com/document/google-listings-and-ads/#google-smart-shopping-campaigns. From the dev console you should see an event is sent with link_id = get-started-features-google-ads-learn-more.
  6. Click on the third Learn More, it should open a new tab to https://woocommerce.com/document/google-listings-and-ads/#getting-started-with-campaign-analytics. From the dev console you should see an event is sent with link_id = get-started-features-dashboard-learn-more.

Changelog entry

Update - Add the features card for UX improvements on get started page.

@ianlin ianlin added the type: enhancement The issue is a request for an enhancement. label Apr 22, 2022
@ianlin ianlin requested a review from a team April 22, 2022 10:01
@ianlin ianlin self-assigned this Apr 22, 2022
js/src/get-started-page/features-card/index.js Outdated Show resolved Hide resolved
js/src/get-started-page/features-card/index.js Outdated Show resolved Hide resolved
js/src/get-started-page/features-card/index.js Outdated Show resolved Hide resolved
js/src/get-started-page/features-card/index.scss Outdated Show resolved Hide resolved
@ianlin ianlin requested a review from eason9487 April 27, 2022 09:06
@ianlin
Copy link
Member Author

ianlin commented Apr 27, 2022

Thanks for the review @eason9487, the PR is ready for the next round of the review.

Copy link
Member

@eason9487 eason9487 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the changes! Tested locally, and it works as expected. LGTM.

@ianlin ianlin merged commit 2568fe6 into feature/1392-ux-improvements-on-get-started-page Apr 27, 2022
@ianlin ianlin deleted the add/1392-features-card branch April 27, 2022 09:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
type: enhancement The issue is a request for an enhancement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants