Skip to content

Create About Page for 7.1 #12845

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.

Sign up for GitHub

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

Open
joedolson wants to merge 14 commits into
base: trunk
Choose a base branch
from
Open

Create About Page for 7.1 #12845

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
8e4bad3
Create About Page for 7.1
joedolson Aug 4, 2026
1fc216d
Update headers & add RTL versions.
joedolson Aug 4, 2026
4449139
One text adjustment, fix entities.
joedolson Aug 5, 2026
5aacc29
Add a subtle shadow on mobile to fix contrast issue
joedolson Aug 5, 2026
fa83fb5
Update src/wp-admin/about.php
joedolson Aug 5, 2026
8393e64
Update src/wp-admin/about.php
joedolson Aug 5, 2026
db7e8fd
Update assets
joedolson Aug 5, 2026
dfca3d7
update notes feature
joedolson Aug 5, 2026
a46e422
Merge remote-tracking branch 'upstream/trunk' into about-7.1
joedolson Aug 8, 2026
9929849
Update src/wp-admin/about.php
joedolson Aug 8, 2026
a8d753c
Merge branch 'about-7.1' of https://github.com/joedolson/wordpress-de…
joedolson Aug 8, 2026
8293951
Update text, add alt for badge, request from CDN
joedolson Aug 8, 2026
13be7e5
Switch images back to local until CDN updated
joedolson Aug 8, 2026
235d058
Remove unused code. Alt text was only used for the logo badge, remove…
joedolson Aug 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 23 additions & 23 deletions src/wp-admin/about.php
View file
Open in desktop
Comment thread
joedolson marked this conversation as resolved.
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
$title = _x( 'About', 'page title' );

list( $display_version ) = explode( '-', wp_get_wp_version() );
$display_major_version = '7.0';
$display_major_version = '7.1';

$release_notes_url = sprintf(
/* translators: %s: WordPress version number. */
Expand Down Expand Up @@ -62,67 +62,67 @@

<div class="about__section">
<div class="column is-left-padding-zero is-right-padding-zero">
<h2><?php _e( 'Welcome to WordPress 7.0' ); ?></h2>
<p class="is-subheading"><?php _e( 'WordPress 7.0 introduces the foundation for AI across the platform, letting you connect your preferred provider and put it to work across your site. Edit more simply by dropping in layouts and swapping content without diving into blocks. The navigation overlay now taps into the full potential of blocks, and reviewing historical changes is easier with a visual comparison.' ); ?></p>
<h2><?php _e( 'Welcome to WordPress 7.1' ); ?></h2>
<p class="is-subheading"><?php _e( "WordPress 7.1 makes it easier to style, edit, and collaborate. Style how blocks look across screen sizes and how they respond to hover, focus, and active states, all without writing custom CSS. A new media editor brings cropping, rotation, and metadata editing together in one streamlined workflow. Notes now support rich text and @mentions, and the admin bar now travels with you into the Site Editor and block editor, so the tools you rely on stay with you wherever you're working." ); ?></p>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<h3><?php _e( 'Design your navigation overlay' ); ?></h3>
<h3><?php _e( 'Apply responsive styles' ); ?></h3>
<p>
<strong><?php _e( 'A dedicated canvas for your menu.' ); ?></strong><br />
<?php _e( 'Build the menu overlay you want visitors to see. Go beyond a simple list of links: add columns, increase the font size, and align everything to your liking. Start from a pre-built template, or design your own from scratch.' ); ?>
<strong><?php _e( 'Style content your way, on every screen.' ); ?></strong><br />
<?php _e( 'WordPress 7.1 takes a major step toward built-in responsive design. Set how a block looks at different screen sizes directly in the editor, for both Global Styles and individual blocks, all without writing custom CSS.' ); ?>
</p>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-01.webp" alt="" height="436" width="436" />
<img src="./images/about-feature-01.webp" alt="" height="436" width="436" />
Comment thread
joedolson marked this conversation as resolved.
Outdated
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-02.webp" alt="" height="436" width="436" />
<img src="./images/about-feature-02.webp" alt="" height="436" width="436" />
</div>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<h3><?php _e( 'AI foundations' ); ?></h3>
<h3><?php _e( 'Admin bar, now in every editor' ); ?></h3>
<p>
<strong><?php _e( 'A centralized hub for your connections.' ); ?></strong><br />
<?php _e( 'The Connectors screen introduces a single hub for managing a range of external service integrations, including AI providers. Opt in by connecting your preferred AI provider, then put it to work across your site. The optional AI plugin adds a growing set of tools directly into the editor: create titles and excerpts, generate and edit images, and suggest alt text. Any plugin that needs to connect to an outside service can tap into this standardized connection management system, making it easy for users and developers alike.' ); ?>
<strong><?php _e( 'Consistent navigation, from dashboard to editor.' ); ?></strong><br />
<?php _e( 'The WordPress admin bar now stays with you as you move into the Site Editor and block editor, so you stay oriented as you move between the Site Editor and block editor. Admin bar also receives a small UI visual improvement.' ); ?>
Comment thread
joedolson marked this conversation as resolved.
Outdated
</p>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<h3><?php _e( 'Visual revisions' ); ?></h3>
<h3><?php _e( 'A new way to crop' ); ?></h3>
<p>
<strong><?php _e( 'Scrub through every version of your page.' ); ?></strong><br />
<?php _e( 'Review your post&#8217;s revision history with a timeline slider and see exactly what changed in the document with visual markers, block by block. Find the version you want and restore it in one click.' ); ?>
<strong><?php _e( 'One dedicated workflow for editing your images.' ); ?></strong><br />
<?php _e( 'A new media editor modal replaces the old inline cropping tool, bringing freeform and aspect-ratio cropping, flip, precise rotation, and metadata editing together in a single streamlined workflow. The familiar Crop button still gets you there, now opening a dedicated space to crop, rotate, and adjust images before publishing.' ); ?>
Comment thread
joedolson marked this conversation as resolved.
Outdated
</p>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-03.webp" alt="" height="436" width="436" />
<img src="./images/about-feature-03.webp" alt="" height="436" width="436" />
</div>
</div>
</div>

<div class="about__section has-2-columns">
<div class="column is-vertically-aligned-center is-left-padding-zero">
<div class="about__image">
<img src="https://s.w.org/images/core/7.0/about-feature-04.webp" alt="" height="436" width="436" />
<img src="./images/about-feature-04.webp" alt="" height="436" width="436" />
</div>
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero">
<h3><?php _e( 'A simpler way to build with patterns' ); ?></h3>
<h3><?php _e( 'Inline notes with mentions and rich text' ); ?></h3>
<p>
<strong><?php _e( 'Patterns as single blocks.' ); ?></strong><br />
<?php _e( 'Drop a pattern onto your page and it behaves like one block, so you don’t have to hunt through nested blocks for the element you want to change. Swap the text and images, adjust styles from the inspector, and keep moving. For any advanced edits, a single click to "edit pattern" gives you access to all available tools.' ); ?>
<strong><?php _e( 'More ways to leave feedback.' ); ?></strong><br />
<?php _e( 'Notes now support rich text and @mentions. Add bold, italic, code, and links so feedback reads clearly. Type "@" to pull up a list of collaborators and tag the right person directly. Leave a note on a specific text selection instead of an entire block. Start more than one conversation on the same block. Collapse long notes to keep the margin tidy.' ); ?>
</p>
</div>
</div>
Expand All @@ -137,8 +137,8 @@
<path fill="#1e1e1e" fill-rule="evenodd" d="M4.91 27.75C4.91 17.395 13.455 9 24 9s19.091 8.395 19.091 18.75c0 3.909-1.22 7.542-3.305 10.548l-.488.702H8.702l-.488-.702A18.438 18.438 0 0 1 4.91 27.75ZM24 12.214c-8.736 0-15.818 6.956-15.818 15.536 0 2.943.832 5.692 2.277 8.036h27.082a15.25 15.25 0 0 0 2.277-8.036c0-8.58-7.082-15.536-15.818-15.536Z" clip-rule="evenodd"/>
</svg>
</div>
<h3><?php _e( 'Performance' ); ?></h3>
<p><?php _e( 'WordPress 7.0 improves the accuracy of image loading prioritization, preventing hidden images in navigation overlays or interactive blocks from degrading the loading of critical resources. On-demand block stylesheet loading in classic themes is more reliable, and the ability is added for scripts to depend on script modules to reduce render-blocking.' ); ?></p>
<h3><?php _e( 'Improved Media Handling' ); ?></h3>
Comment thread
joedolson marked this conversation as resolved.
Outdated
<p><?php _e( 'Image compression, resizing, and thumbnail generation now happen in the browser, via a WebAssembly build of libvips, so large uploads won’t hit PHP memory limits or time out on shared hosts. This also frees up server CPU and memory, while producing smaller files for visitors media handling includes built-in support for AVIF, HEIC and HDR gain maps.' ); ?></p>
Comment thread
joedolson marked this conversation as resolved.
Outdated
</div>
<div class="column is-right-padding-zero">
<div class="about__image">
Expand All @@ -147,7 +147,7 @@
</svg>
</div>
<h3><?php _e( 'Accessibility' ); ?></h3>
<p><?php _e( 'WordPress continues to polish accessibility across WordPress Core and Gutenberg, advancing the goals to meet accessibility standards. WordPress 7.0 includes fixes across the platform, improving media management, usability for voice control, and improvements to color contrast with the new admin color scheme. The editor ships with new blocks and improvements to editor navigation and interaction.' ); ?></p>
<p><?php _e( 'WordPress 7.1 adds a "mark as decorative" toggle for the Image block, so decorative images can be hidden from screen readers, and the new admin bar and media editor modal have been built and reviewed with accessibility in mind. Work also continues on the post list tables and media library, as identified priorities in previous releases.' ); ?></p>
Comment thread
joedolson marked this conversation as resolved.
Outdated
</div>
</div>

Expand Down Expand Up @@ -177,7 +177,7 @@

<div class="about__section has-3-columns">
<div class="column about__image is-vertically-aligned-top is-left-padding-zero">
<img src="<?php echo esc_url( admin_url( 'images/about-release-badge.svg?ver=7.0' ) ); ?>" alt="" height="280" width="280" />
<img src="<?php echo esc_url( admin_url( 'images/about-release-badge.svg?ver=7.1' ) ); ?>" alt="" height="280" width="280" />
Comment thread
joedolson marked this conversation as resolved.
Outdated
</div>
<div class="column is-vertically-aligned-center is-right-padding-zero" style="grid-column-end:span 2">
<h3>
Expand Down
4 changes: 0 additions & 4 deletions src/wp-admin/contribute.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,10 +24,6 @@
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'Get Involved' ); ?>
Expand Down
4 changes: 0 additions & 4 deletions src/wp-admin/credits.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,6 @@
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'Contributors' ); ?>
Expand Down
31 changes: 16 additions & 15 deletions src/wp-admin/css/about.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,8 @@

.about__container {
/* Section backgrounds */
--background: #ebe8e5;
--subtle-background: #ebe8e5;
--background: #3858e9;
--subtle-background: #f4f4f4;

/* Main text color */
--text: #1e1e1e;
Expand Down Expand Up @@ -531,7 +531,7 @@
margin: calc(var(--gap) / 2) var(--gap);
height: 0;
border: none;
border-top: 4px solid var(--accent-3);
border-top: 6px solid var(--accent-3);
}

.about__container hr.is-small {
Expand Down Expand Up @@ -596,48 +596,49 @@
padding-right: 26rem; /* Space for the background image. */
min-height: clamp(10rem, 25vw, 18.75rem);
border-radius: var(--border-radius);
background-image: url( "../images/about-header-default.webp?ver=20260514" );
background-image: url( "../images/about-header-default.webp?ver=20260804" );
background-repeat: no-repeat;
background-position: right center;
background-size: cover;
background-color: var(--background);
color: var(--text-light);
margin-bottom: .25rem;
}

.credits-php .about__header {
background-image: url( "../images/about-header-credits.webp?ver=20260514" );
background-image: url( "../images/about-header-credits.webp?ver=20260804" );
}

.freedoms-php .about__header {
background-image: url( "../images/about-header-freedoms.webp?ver=20260514" );
background-image: url( "../images/about-header-freedoms.webp?ver=20260804" );
}

.privacy-php .about__header {
background-image: url( "../images/about-header-privacy.webp?ver=20260514" );
background-image: url( "../images/about-header-privacy.webp?ver=20260804" );
}

.contribute-php .about__header {
background-image: url( "../images/about-header-get-involved.webp?ver=20260514" );
background-image: url( "../images/about-header-get-involved.webp?ver=20260804" );
}

[dir="rtl"] .about__header {
background-image: url( "../images/about-header-default-rtl.webp?ver=20260514" );
background-image: url( "../images/about-header-default-rtl.webp?ver=20260804" );
}

[dir="rtl"] .credits-php .about__header {
background-image: url( "../images/about-header-credits-rtl.webp?ver=20260514" );
background-image: url( "../images/about-header-credits-rtl.webp?ver=20260804" );
}

[dir="rtl"] .freedoms-php .about__header {
background-image: url( "../images/about-header-freedoms-rtl.webp?ver=20260514" );
background-image: url( "../images/about-header-freedoms-rtl.webp?ver=20260804" );
}

[dir="rtl"] .privacy-php .about__header {
background-image: url( "../images/about-header-privacy-rtl.webp?ver=20260514" );
background-image: url( "../images/about-header-privacy-rtl.webp?ver=20260804" );
}

[dir="rtl"] .contribute-php .about__header {
background-image: url( "../images/about-header-get-involved-rtl.webp?ver=20260514" );
background-image: url( "../images/about-header-get-involved-rtl.webp?ver=20260804" );
}

.about__header-image {
Expand All @@ -657,7 +658,7 @@
font-size: clamp(2rem, 20vw - 9rem, 4rem);
line-height: 1;
font-weight: 600;
color: var(--text);
color: var(--text-light);
}

.about-php .about__header-title h1,
Expand All @@ -676,7 +677,7 @@
padding: 0;
font-size: 1.6rem;
line-height: 1.15;
color: var(--text);
color: var(--text-light);
}

.about__header-navigation {
Expand Down
4 changes: 0 additions & 4 deletions src/wp-admin/freedoms.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,10 +30,6 @@
<div class="wrap about__container">

<div class="about__header">
<div class="about__header-image">
<img src="<?php echo esc_url( admin_url( 'images/about-release-logo.svg?ver=7.0' ) ); ?>" alt="<?php echo esc_attr( $header_alt_text ); ?>" />
</div>

<div class="about__header-title">
<h1>
<?php _e( 'The Four Freedoms' ); ?>
Expand Down
Binary file added src/wp-admin/images/about-feature-01.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-02.webp
View file
Open in desktop
Comment thread
joedolson marked this conversation as resolved.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-03.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/wp-admin/images/about-feature-04.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-credits-rtl.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-credits.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-default-rtl.webp
View file
Open in desktop

@t-hamano t-hamano Aug 7, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Do we need to flip this image as well?

@joedolson joedolson Aug 7, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Technically, the abstract 7.1 wouldn't make sense flipped, and @marko-srb adjusted the image so it would work either way. I don't have a strong opinion, and would prefer that somebody natively in an RTL language make that call...

Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-default.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-freedoms-rtl.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-freedoms.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-get-involved-rtl.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-get-involved.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-privacy-rtl.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/wp-admin/images/about-header-privacy.webp
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading