Welcome dashboard widget: Add heading to identify what the cards are about

Open Beginner friendly
#79,321 4 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
68/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Quiet
Tech stack
javascript
Domain
accessibility, frontend

Research direction

Enable the dashboard experiment and open the Welcome Dashboard widget at wp-admin/admin.php?page=dashboard-wp-admin to observe the three cards. Locate the widget implementation from the dashboard experiment entry point, add a visible H3 before the cards, and verify that the heading identifies the section without disrupting the existing links or layout.

Written by the indexing model from the issue text.

Description

[Focus] Accessibility (a11y) [Type] Bug
Description

See related https://github.com/WordPress/gutenberg/issues/79240 and https://github.com/WordPress/gutenberg/issues/79313

Headings should be used to clearly identify what a section of content is about.

The Welcome Dashboard widget shows by default:

  • A 'Welcome to WordPress!' big text *note: it's not a heading)
  • A link 'Learn more about the 7.1 version.'
  • Three cards:
    • Author rich content with blocks and patterns, with a link to Add a new page.
    • Start customizing, with a link to Open the Customizer.
    • Discover a new way to build your site, with a link to Learn about block themes.

These 3 cards are basically a mix of pointers to WordPress features and resources to the documentation.

It would be good to add a visible H3 heading before the 3 cards to clearly tell users what this section of content is about.

Screenshot:

Image
Step-by-step reproduction instructions
  • Enable the dashboard experiment on WP Admin > Gutenberg > Experiments.
  • Go to http://localhost:8889/wp-admin/admin.php?page=dashboard-wp-admin
  • Observe the Welcome widget at the top of the page.
  • Observe the 3 cards within the Welcome widget do not have any heading before them.
Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.
  • Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
  • Yes
Please confirm which theme type you used for testing.
  • Block
  • Classic
  • Hybrid (e.g. classic with theme.json)
  • Not sure
Dominant language
JavaScript
Stars
11.8k
Forks
4.9k
Avg merge
1d 22h
Merged PRs (30d)
560

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from WordPress/gutenberg

All issues in WordPress/gutenberg

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.