WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
03/01/2023 04:28:52 PM (2 years ago)
Author:
ryelle
Message:

Help/About: Update the About page for 6.2.

This is the start of the WordPress 6.2 about page, introducing new content and a first pass of the new style.

Props laurlittle, jpantani, richtabor, audrasjb.
See #57477.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-admin/about.php

    r55350 r55449  
    2727                        /* translators: %s: Version number. */
    2828                        __( 'WordPress %s' ),
    29                         $display_version
     29                        str_replace( '.', '<span>.</span>', $display_version )
    3030                    );
    3131                    ?>
    … …  
    5454                    ?>
    5555                </h2>
    56                 <p class="is-subheading">
    57                     <?php _e( 'This page highlights some of the most significant changes to the product since the May 2022 release of WordPress 6.0. You will also find resources for developers and anyone seeking a deeper understanding of WordPress.' ); ?>
     56                <p class="is-subheading aligncenter">
     57                    <?php
     58                    printf(
     59                        /* translators: 1: Count of enhancements, 2: Count of bug fixes. */
     60                        __( 'WordPress 6.2 includes more than %1$s enhancements and %2$s bug fixes. This page highlights the latest features since the November 2022 release of WordPress 6.1. From quick highlights to developer resources, there&#8217;s a lot to explore.' ),
     61                        292, // Enhancements.
     62                        394 // Bug fixes.
     63                    );
     64                    ?>
    5865                </p>
    5966            </div>
    … …  
    6269        <div class="about__section has-2-columns">
    6370            <div class="column">
    64                 <div class="about__image" style="background-color:#353535;">
    65                     <img src="https://s.w.org/images/core/6.1/about-61-style-variations.webp" alt="" />
    66                 </div>
    67             </div>
    68             <div class="column is-vertically-aligned-center">
    69                 <h3><?php _e( 'A new default theme powered by 10 distinct style variations' ); ?></h3>
    70                 <p>
    71                     <?php
    72                     printf(
    73                         /* translators: 1: Variation announcement post URL, 2: Accessibility-ready handbook page. */
    74                         __( 'Building on the foundational elements in the 5.9 and 6.0 releases for block themes and style variations, the new default theme, Twenty Twenty-Three, includes <a href="%1$s">10 different styles</a> and is &#147;<a href="%2$s">Accessibility Ready</a>&#148;.' ),
    75                         'https://make.wordpress.org/design/2022/09/07/tt3-default-theme-announcing-style-variation-selections/',
    76                         'https://make.wordpress.org/themes/handbook/review/accessibility/'
    77                     );
    78                     ?>
    79                 </p>
    80             </div>
    81         </div>
    82 
    83         <div class="about__section has-2-columns">
    84             <div class="column is-vertically-aligned-center">
    85                 <h3><?php _e( 'A better creator experience with refined and additional templates' ); ?></h3>
    86                 <p>
    87                     <?php
    88                     printf(
    89                         /* translators: 1: Link to template options dev note, 2: Link to template creation dev note. */
    90                         __( '<a href="%1$s">New templates</a> include a custom template for posts and pages in the Site Editor. Search-and-replace tools speed up the design of <a href="%2$s">template parts</a>.' ),
    91                         'https://make.wordpress.org/core/2022/07/21/core-editor-improvement-deeper-customization-with-more-template-options/',
    92                         'https://make.wordpress.org/core/2022/08/25/core-editor-improvement-refining-the-template-creation-experience/'
    93                     );
    94                     ?>
    95                 </p>
    96             </div>
    97             <div class="column">
    98                 <div class="about__image has-subtle-background-color">
    99                     <img src="https://s.w.org/images/core/6.1/about-61-templates.webp" alt="" />
    100                 </div>
    101             </div>
    102         </div>
    103 
    104         <div class="about__section has-2-columns">
    105             <div class="column">
    106                 <div class="about__image has-subtle-background-color">
    107                     <img src="https://s.w.org/images/core/6.1/about-61-design-tools.webp" alt="" />
    108                 </div>
    109             </div>
    110             <div class="column is-vertically-aligned-center">
    111                 <h3><?php _e( 'More consistency and control across design tools' ); ?></h3>
    112                 <p>
    113                     <?php
    114                     printf(
    115                         /* translators: %s: Link to layout support refactor dev note. */
    116                         __( 'Upgrades to the <a href="%s">controls for design elements and blocks</a> make the layout and site-building process more consistent, complete, and intuitive.' ),
    117                         'https://make.wordpress.org/core/2022/10/11/roster-of-design-tools-per-block/'
    118                     );
    119                     ?>
    120                 </p>
    121             </div>
    122         </div>
    123 
    124         <div class="about__section has-2-columns">
    125             <div class="column is-vertically-aligned-center">
    126                 <h3><?php _e( 'Menus just got easier to create and manage' ); ?></h3>
    127                 <p>
    128                     <?php
    129                     printf(
    130                         /* translators: %s: Link to navigation block fallback dev note. */
    131                         __( '<a href="%s">New fallback options</a> in the navigation block mean you can edit the menu that’s open; no searching needed. Plus, the controls for choosing and working on menus have their own place in the block settings. The mobile menu system also gets an upgrade with new features, including different icon options, to make the menu yours.' ),
    132                         'https://make.wordpress.org/core/2022/09/27/navigation-block-fallback-behavior-in-wp-6-1-dev-note/'
    133                     );
    134                     ?>
    135                 </p>
    136             </div>
    137             <div class="column">
    138                 <div class="about__image has-subtle-background-color">
    139                     <img src="https://s.w.org/images/core/6.1/about-61-navigation.webp" alt="" />
    140                 </div>
    141             </div>
    142         </div>
    143 
    144         <div class="about__section has-2-columns">
    145             <div class="column">
    146                 <div class="about__image has-accent-background-color">
    147                     <img src="https://s.w.org/images/core/6.1/about-61-document-settings.webp" alt="" />
    148                 </div>
    149                 <h3><?php _e( 'Improved layout and visualization of document settings' ); ?></h3>
    150                 <p><?php _e( 'A cleaner, better-organized display helps you easily view and manage important post and page settings, especially the template picker and scheduler.' ); ?></p>
    151             </div>
    152             <div class="column">
    153                 <div class="about__image has-accent-background-color">
    154                     <img src="https://s.w.org/images/core/6.1/about-61-lock.webp" alt="" />
    155                 </div>
    156                 <h3><?php _e( 'One-click lock settings for all inner blocks' ); ?></h3>
    157                 <p><?php _e( 'When locking blocks, a new toggle lets you apply your lock settings to all the blocks in a containing block like the group, cover, and column blocks.' ); ?></p>
     71                <div class="about__image">
     72                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     73                </div>
     74            </div>
     75            <div class="column is-vertically-aligned-center">
     76                <h3><?php _e( 'Explore and edit your site from the Site Editor' ); ?></h3>
     77                <p><?php _e( 'An updated interface gives you more control over your site editing experience. Browse through full previews of your templates and template parts, then jump into editing your site from wherever you choose.' ); ?></p>
     78            </div>
     79        </div>
     80
     81        <div class="about__section has-2-columns">
     82            <div class="column is-vertically-aligned-center">
     83                <h3><?php _e( 'Manage your menu in more ways with the Navigation block' ); ?></h3>
     84                <p><?php _e( 'A new sidebar experience makes it easier to edit your site&#8217;s navigation. Add, remove, and reorder menu items faster—no matter how complex your menus are.' ); ?></p>
     85            </div>
     86            <div class="column">
     87                <div class="about__image">
     88                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     89                </div>
     90            </div>
     91        </div>
     92
     93        <div class="about__section has-2-columns">
     94            <div class="column">
     95                <div class="about__image">
     96                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     97                </div>
     98            </div>
     99            <div class="column is-vertically-aligned-center">
     100                <h3><?php _e( 'Discover a smoother experience for the Block Inserter' ); ?></h3>
     101                <p><?php _e( 'A refreshed design gives you more visibility and easier access to the content you need. Use the Media tab to drag and drop content from your existing Media Library quickly. Find patterns faster with a split view that lets you navigate categories and see previews all at once.' ); ?></p>
     102            </div>
     103        </div>
     104
     105        <div class="about__section has-2-columns">
     106            <div class="column is-vertically-aligned-center">
     107                <h3><?php _e( 'Find the controls you want when you need them' ); ?></h3>
     108                <p><?php _e( 'Your block settings sidebar is better organized with tabs for Settings and Styles. So the tools you need are easy to identify and access.' ); ?></p>
     109            </div>
     110            <div class="column">
     111                <div class="about__image">
     112                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     113                </div>
     114            </div>
     115        </div>
     116
     117        <div class="about__section has-2-columns">
     118            <div class="column">
     119                <div class="about__image">
     120                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     121                </div>
     122                <h3><?php _e( 'Build faster with headers and footers for block themes' ); ?></h3>
     123                <p><?php _e( 'Discover a new collection of header and footer patterns to choose from. Use them with any block theme as a quick, high-quality starting point for your site&#8217;s templates.' ); ?></p>
     124            </div>
     125            <div class="column">
     126                <div class="about__image">
     127                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     128                </div>
     129                <h3><?php _e( 'Explore Openverse media right from the Editor' ); ?></h3>
     130                <p><?php _e( 'Openverse&#8217;s library catalogs over 600 million free, openly licensed stock images and audio—and now it&#8217;s directly integrated into the Editor.' ); ?></p>
     131            </div>
     132        </div>
     133
     134        <div class="about__section has-2-columns">
     135            <div class="column">
     136                <div class="about__image">
     137                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     138                </div>
     139                <h3><?php _e( 'Focus on writing with Distraction Free mode' ); ?></h3>
     140                <p><?php _e( 'For those times you want to be alone with your ideas. You can now hide all your panels and controls, leaving you free to bring your content to life.' ); ?></p>
     141            </div>
     142            <div class="column">
     143                <div class="about__image">
     144                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     145                </div>
     146                <h3><?php _e( 'Experience the Site Editor, now out of beta' ); ?></h3>
     147                <p><?php _e( 'Stable and ready for you to dive in and explore: 6.2 is your personal invitation to discover what the next generation of WordPress—and Block themes—can do.' ); ?></p>
    158148            </div>
    159149        </div>
    … …  
    161151        <div class="about__section has-3-columns">
    162152            <div class="column">
    163                 <div class="column about__image is-edge-to-edge has-accent-background-color">
    164                     <img src="https://s.w.org/images/core/6.1/about-61-sub-feature-1.webp" alt="" />
    165                 </div>
    166                 <h3 class="is-smaller-heading"><?php _e( 'Improved block placeholders' ); ?></h3>
    167                 <p><?php _e( 'Various blocks have improved placeholders that reflect customization options to help you design your site and its content. For example, the Image block placeholder displays custom borders and duotone filters even before selecting an image.' ); ?></p>
    168             </div>
    169             <div class="column">
    170                 <div class="column about__image is-edge-to-edge has-accent-background-color">
    171                     <img src="https://s.w.org/images/core/6.1/about-61-sub-feature-2.webp" alt="" />
    172                 </div>
    173                 <h3 class="is-smaller-heading"><?php _e( 'Compose richer lists and quotes with inner blocks' ); ?></h3>
    174                 <p><?php _e( 'The List and Quote blocks now support inner blocks, allowing for more flexible and rich compositions like adding headings inside your Quote blocks.' ); ?></p>
    175             </div>
    176             <div class="column">
    177                 <div class="column about__image is-edge-to-edge has-accent-background-color">
    178                     <img src="https://s.w.org/images/core/6.1/about-61-sub-feature-3.webp" alt="" />
    179                 </div>
    180                 <h3 class="is-smaller-heading"><?php _e( 'More responsive text with fluid typography' ); ?></h3>
    181                 <p>
    182                     <?php
    183                     printf(
    184                         /* translators: %s: Link to fluid typography demo. */
    185                         __( '<a href="%s">Fluid typography</a> lets you define font sizes that adapt for easy reading in any screen size.' ),
    186                         'https://make.wordpress.org/core/2022/10/03/fluid-font-sizes-in-wordpress-6-1/'
    187                     );
    188                     ?>
    189                 </p>
    190             </div>
    191         </div>
    192 
    193         <hr />
    194 
    195         <div class="about__section has-2-columns">
    196             <div class="column">
    197                 <div class="about__image">
    198                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    199                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    200                         <path fill-rule="evenodd" clip-rule="evenodd" d="M29.25 18.75v2.5h1.5v-2.5h2.5v-1.5h-2.5v-2.5h-1.5v2.5h-2.5v1.5h2.5zm-6.5-1.5h-6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-6h-1.5v6a.5.5 0 0 1-.5.5h-12a.5.5 0 0 1-.5-.5v-12a.5.5 0 0 1 .5-.5h6v-1.5z" fill="#fff"/>
    201                     </svg>
    202                 </div>
    203                 <h3 class="is-smaller-heading"><?php _e( 'Add starter patterns to any post type' ); ?></h3>
    204                 <p><?php _e( 'In WordPress 6.0, when you created a new page, you would see suggested patterns so you did not have to start with a blank page. In 6.1, you will also see the starter patterns modal when you create a new instance of any post type.' ); ?></p>
    205             </div>
    206             <div class="column">
    207                 <div class="about__image">
    208                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    209                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    210                         <path fill-rule="evenodd" clip-rule="evenodd" d="M29.99 23.16a4.628 4.628 0 1 1-9.257 0 4.628 4.628 0 0 1 9.257 0zm1.5 0a6.128 6.128 0 0 1-10.252 4.535l-3.74 3.273-.988-1.13 3.75-3.28a6.128 6.128 0 1 1 11.23-3.397z" fill="#fff"/>
    211                     </svg>
    212                 </div>
    213                 <h3 class="is-smaller-heading"><?php _e( 'Find block themes faster' ); ?></h3>
    214                 <p>
    215                     <?php
    216                     printf(
    217                         /* translators: %s: Link to Block Themes on WordPress.org. */
    218                         __( 'The Themes Directory has <a href="%s">a filter for block themes</a>, and a pattern preview gives a better sense of what the theme might look like while exploring different themes and patterns.' ),
    219                         esc_url( __( 'https://wordpress.org/themes/tags/full-site-editing/' ) )
    220                     );
    221                     ?>
    222                 </p>
    223             </div>
    224         </div>
    225 
    226         <div class="about__section has-2-columns">
    227             <div class="column">
    228                 <div class="about__image">
    229                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    230                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    231                         <path fill-rule="evenodd" clip-rule="evenodd" d="M22.29 16.836a1 1 0 0 1 .986-.836h1.306a1 1 0 0 1 .986.836l.244 1.466c.788.26 1.503.679 2.108 1.218l1.393-.522a1 1 0 0 1 1.217.437l.653 1.13a1 1 0 0 1-.23 1.273l-1.148.944a6.025 6.025 0 0 1 0 2.435l1.148.946a1 1 0 0 1 .23 1.272l-.652 1.13a1 1 0 0 1-1.217.437l-1.394-.522c-.605.54-1.32.958-2.108 1.218l-.244 1.466a1 1 0 0 1-.986.836h-1.306a1 1 0 0 1-.987-.836l-.244-1.466a5.994 5.994 0 0 1-2.108-1.218l-1.394.522a1 1 0 0 1-1.216-.436l-.653-1.131a1 1 0 0 1 .23-1.272l1.148-.946a6.028 6.028 0 0 1 0-2.435l-1.147-.944a1 1 0 0 1-.23-1.273l.652-1.13a1 1 0 0 1 1.217-.437l1.393.522a5.996 5.996 0 0 1 2.108-1.218l.244-1.466zM26.928 24a3 3 0 1 1-6 0 3 3 0 0 1 6 0z" fill="#fff"/>
    232                     </svg>
    233                 </div>
    234                 <h3 class="is-smaller-heading"><?php _e( 'Keep your Site Editor settings for later' ); ?></h3>
    235                 <p>
    236                     <?php
    237                     printf(
    238                         /* translators: %s: Link to block editor preferences dev note. */
    239                         __( 'Site Editor settings are now <a href="%s">persistent for each user</a>. This means your settings will now be consistent across browsers and devices.' ),
    240                         'https://make.wordpress.org/core/2022/10/10/changes-to-block-editor-preferences-in-wordpress-6-1/'
    241                     );
    242                     ?>
    243                 </p>
    244             </div>
    245             <div class="column">
    246                 <div class="about__image">
    247                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    248                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    249                         <path fill-rule="evenodd" clip-rule="evenodd" d="M31 24a7 7 0 0 1-7 7V17a7 7 0 0 1 7 7zm-7-8a8 8 0 1 1 0 16 8 8 0 0 1 0-16z" fill="#fff"/>
    250                     </svg>
    251                 </div>
    252                 <h3 class="is-smaller-heading"><?php _e( 'A streamlined style system' ); ?></h3>
    253                 <p>
    254                     <?php
    255                     printf(
    256                         /* translators: %s: Link style engine dev note. */
    257                         __( 'The CSS rules for margin, padding, typography, colors, and borders within the <a href="%s">styles engine</a> are now all in one place, reducing time spent on layout-specific tasks and helps to generate semantic class names.' ),
    258                         'https://make.wordpress.org/core/2022/10/10/block-styles-generation-style-engine/'
    259                     );
    260                     ?>
    261                 </p>
    262             </div>
    263         </div>
    264 
    265         <div class="about__section has-2-columns">
    266             <div class="column">
    267                 <div class="about__image">
    268                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    269                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    270                         <path d="M24 18.285a1.58 1.58 0 0 1-1.159-.484 1.58 1.58 0 0 1-.484-1.159c0-.45.162-.836.484-1.158A1.58 1.58 0 0 1 24 15c.45 0 .836.161 1.159.484.322.322.483.708.483 1.158 0 .45-.16.837-.483 1.16a1.581 1.581 0 0 1-1.16.483zM21.592 33V21.008a44.174 44.174 0 0 1-2.958-.316 28.99 28.99 0 0 1-2.734-.517l.337-1.35c1.275.3 2.543.514 3.803.641 1.26.128 2.58.191 3.96.191s2.7-.063 3.96-.19a29.603 29.603 0 0 0 3.802-.642l.338 1.35c-.87.21-1.781.383-2.734.517-.952.136-1.939.24-2.959.316V33h-1.35v-5.85h-2.115V33h-1.35z" fill="#fff"/>
    271                     </svg>
    272                 </div>
    273                 <h3 class="is-smaller-heading"><?php _e( 'Improved admin and editor accessibility' ); ?></h3>
    274                 <p>
    275                     <?php
    276                     printf(
    277                         /* translators: %s: Link to accessibility improvements dev note. */
    278                         __( 'More than 40 improvements in accessibility include resolving focus loss problems in the editor, improving form labels and audible messages, making alternative text easier to edit, and fixing the sub-menu overlap in the expanded admin side navigation at smaller screen sizes and higher zoom levels. Learn more about <a href="%s">accessibility in WordPress</a>.' ),
    279                         'https://make.wordpress.org/core/2022/10/11/wordpress-6-1-accessibility-improvements/'
    280                     );
    281                     ?>
    282                 </p>
    283             </div>
    284             <div class="column">
    285                 <div class="about__image">
    286                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    287                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    288                         <path fill-rule="evenodd" clip-rule="evenodd" d="M23.019 25.517l-4.258 4.385-.718-.697 4.212-4.337-5.752-.025.005-1 5.826.025-3.997-4.116.717-.696 3.952 4.07-.03-5.623 1-.005.03 5.567 3.894-4.01.717.697-4.007 4.126 6.046.026-.005 1-5.942-.025 4.201 4.326-.717.697-4.174-4.298.032 6.048-1 .006-.032-6.14z" fill="#fff"/>
    289                     </svg>
    290                 </div>
    291                 <h3 class="is-smaller-heading"><?php _e( 'Other notes of interest' ); ?></h3>
    292                 <p><?php _e( '6.1 includes a new time-to-read feature showing content authors the approximate time-to-read values for pages, posts, and custom post types.' ); ?></p>
    293                 <p>
    294                     <?php
    295                     printf(
    296                         /* translators: %s: "General Settings" admin page title, linked to the page if the user can edit options. */
    297                         __( 'The site tagline is empty by default in new sites but can be modified in %s.' ),
    298                         current_user_can( 'manage_options' ) ? '<a href="' . esc_url( admin_url( 'options-general.php' ) ) . '">' . __( 'General Settings' ) . '</a>' : __( 'General Settings' )
    299                     );
    300                     ?>
    301                 </p>
    302                 <p><?php _e( 'A new modal design offers a background blur effect, making it easier to focus on the task at hand.' ); ?></p>
    303             </div>
    304         </div>
    305 
    306         <div class="about__section has-2-columns">
    307             <div class="column">
    308                 <div class="about__image">
    309                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    310                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    311                         <rect x="11" y="17" width="26" height="14" rx="7" fill="#fff"/>
    312                         <circle cx="18" cy="24" r="4" fill="#1E1E1E"/>
    313                     </svg>
    314                 </div>
    315                 <h3 class="is-smaller-heading"><?php _e( 'Updated interface options and features' ); ?></h3>
    316                 <p>
    317                     <?php
    318                     printf(
    319                         /* translators: %s: Link to styling elements dev note. */
    320                         __( 'Updates include <a href="%s">styling elements</a> like buttons, citations, and links globally; controlling hover, active, and focus states for links using theme.json (not available to control in the interface yet); and customizing outline support for blocks and elements, among other features.' ),
    321                         'https://make.wordpress.org/core/2022/10/10/styling-elements-in-block-themes/'
    322                     );
    323                     ?>
    324                 </p>
    325             </div>
    326             <div class="column">
    327                 <div class="about__image">
    328                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    329                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    330                         <path fill-rule="evenodd" clip-rule="evenodd" d="M18 16h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H18a2 2 0 0 1-2-2V18a2 2 0 0 1 2-2zm12 1.5H18a.5.5 0 0 0-.5.5v3h13v-3a.5.5 0 0 0-.5-.5zm.5 5H22v8h8a.5.5 0 0 0 .5-.5v-7.5zm-10 0h-3V30a.5.5 0 0 0 .5.5h2.5v-8z" fill="#fff"/>
    331                     </svg>
    332                 </div>
    333                 <h3 class="is-smaller-heading"><?php _e( 'Continued evolution of layout options' ); ?></h3>
    334                 <p>
    335                     <?php
    336                     printf(
    337                         /* translators: %s: Link to layout support refactor dev note. */
    338                         __( 'The default content dimensions provided by themes can now be overridden in the Styles Sidebar, giving site builders better control over full-width content. Developers have <a href="%s">fine-grained control over these controls</a>.' ),
    339                         'https://make.wordpress.org/core/2022/10/10/updated-editor-layout-support-in-6-1-after-refactor/'
    340                     );
    341                     ?>
    342                 </p>
    343             </div>
    344         </div>
    345 
    346         <div class="about__section has-2-columns">
    347             <div class="column">
    348                 <div class="about__image">
    349                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    350                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    351                         <path d="M27.7 17.2l5.6 5.6c.7.6.7 1.8-.1 2.5l-5.6 5.6c-.3.3-.8.5-1.2.5-.4 0-.9-.2-1.2-.5l-5.6-5.6c-.7-.7-.7-1.8 0-2.5l5.6-5.6c.7-.7 1.8-.7 2.5 0z" fill="#fff"/>
    352                         <path d="M22 17.5l-6.3 6.3c-.1.1-.1.3.1.3l6.3 6.3-1.1 1.1-6.3-6.2c-.7-.7-.7-1.8 0-2.5l6.3-6.3 1 1z" fill="#fff"/>
    353                     </svg>
    354                 </div>
    355                 <h3 class="is-smaller-heading"><?php _e( 'Block template parts in classic themes' ); ?></h3>
    356                 <p>
    357                     <?php
    358                     printf(
    359                         /* translators: 1: Link to block-based template parts in classic themes dev note, 2: Folder name. */
    360                         __( '<a href="%1$s">Block template parts can now be defined in classic themes</a> by adding the appropriate HTML files to the %2$s directory at the root of the theme.' ),
    361                         'https://make.wordpress.org/core/2022/10/04/block-based-template-parts-in-traditional-themes/',
    362                         '<code>parts</code>'
    363                     );
    364                     ?>
    365                 </p>
    366             </div>
    367             <div class="column">
    368                 <div class="about__image">
    369                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    370                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    371                         <path fill-rule="evenodd" clip-rule="evenodd" d="M31.349 23.579a3.18 3.18 0 0 1-6.262.796l-.007-.03-.01-.029-.734-2.166-.005.002a4.818 4.818 0 0 0-9.418 1.427 4.816 4.816 0 0 0 6.575 4.485l-.598-1.523a3.18 3.18 0 1 1 1.92-3.758l.012-.003.69 2.034a4.818 4.818 0 0 0 9.472-1.235 4.816 4.816 0 0 0-6.57-4.487l.596 1.524a3.18 3.18 0 0 1 4.34 2.963z" fill="#fff"/>
    372                     </svg>
    373                 </div>
    374                 <h3 class="is-smaller-heading"><?php _e( 'Expanded support for Query Loop blocks' ); ?></h3>
    375                 <p>
    376                     <?php
    377                     printf(
    378                         /* translators: %s: Link to query loop dev note. */
    379                         __( '<a href="%s">New filters</a> let Query Block variations support custom queries for more powerful variations and advanced hierarchical post types filtering options.' ),
    380                         'https://make.wordpress.org/core/2022/10/10/extending-the-query-loop-block/'
    381                     );
    382                     ?>
    383                 </p>
    384             </div>
    385         </div>
    386 
    387         <div class="about__section has-2-columns">
    388             <div class="column">
    389                 <div class="about__image">
    390                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    391                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    392                         <path d="M17.25 30.25L24 17.594l6.75 12.656h-13.5z" stroke="#fff" stroke-width="1.5"/>
    393                         <path d="M24 16v15h-8l8-15z" fill="#fff"/>
    394                     </svg>
    395                 </div>
    396                 <h3 class="is-smaller-heading"><?php _e( 'Filters for all your styles' ); ?></h3>
    397                 <p>
    398                     <?php
    399                     printf(
    400                         /* translators: %s: Link to theme.json filters dev note. */
    401                         __( '<a href="%s">Leverage filters</a> in the Styles sidebar to control settings at all four levels of your site—core, theme, user, or block, from less to more specific.' ),
    402                         'https://make.wordpress.org/core/2022/10/10/filters-for-theme-json-data/'
    403                     );
    404                     ?>
    405                 </p>
    406             </div>
    407             <div class="column">
    408                 <div class="about__image">
    409                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    410                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    411                         <path fill-rule="evenodd" clip-rule="evenodd" d="M19.114 20.5H16V19h3.114a2.501 2.501 0 0 1 4.771 0H32v1.5h-8.114a2.501 2.501 0 0 1-4.771 0zM16 29h8.114a2.501 2.501 0 0 0 4.771 0H32v-1.5h-3.114a2.501 2.501 0 0 0-4.771 0H16V29z" fill="#fff"/>
    412                     </svg>
    413                 </div>
    414                 <h3 class="is-smaller-heading"><?php _e( 'Spacing presets for faster, consistent design' ); ?></h3>
    415                 <p>
    416                     <?php
    417                     printf(
    418                         /* translators: %s: Link to spacing presets dev note. */
    419                         __( 'Save time and help avoid hard-coding a values into a theme with <a href="%s">preset margin and padding values for multiple blocks</a>.' ),
    420                         'https://make.wordpress.org/core/2022/10/07/introduction-of-presets-across-padding-margin-and-block-gap/'
    421                     );
    422                     ?>
    423                 </p>
    424             </div>
    425         </div>
    426 
    427         <div class="about__section has-2-columns">
    428             <div class="column">
    429                 <div class="about__image">
    430                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    431                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    432                         <path fill-rule="evenodd" clip-rule="evenodd" d="M17.517 20.75A7.268 7.268 0 0 1 22 17.03a8.142 8.142 0 0 0-1.19 1.875 10.763 10.763 0 0 0-.657 1.845h-2.636zm-.554 1.5a7.266 7.266 0 0 0 0 3.5h2.9a13.453 13.453 0 0 1 0-3.5h-2.9zm4.415 0c-.084.56-.128 1.145-.128 1.75s.044 1.19.128 1.75h5.244c.084-.56.128-1.145.128-1.75s-.044-1.19-.128-1.75h-5.244zm6.759 0a13.45 13.45 0 0 1 0 3.5h2.9a7.266 7.266 0 0 0 0-3.5h-2.9zm2.346-1.5h-2.636a10.759 10.759 0 0 0-.657-1.845A8.14 8.14 0 0 0 26 17.03a7.269 7.269 0 0 1 4.483 3.721zm-4.194 0h-4.578c.13-.43.283-.836.458-1.211.495-1.063 1.139-1.847 1.831-2.306.692.46 1.335 1.243 1.83 2.306.176.375.33.78.46 1.211zm-8.772 6.5h2.636c.18.693.416 1.344.7 1.938A8.08 8.08 0 0 0 22 30.97a7.268 7.268 0 0 1-4.483-3.721zm8.772 0h-4.578c.138.46.305.892.495 1.29.491 1.024 1.12 1.78 1.794 2.227.692-.46 1.336-1.243 1.83-2.306a9.02 9.02 0 0 0 .46-1.211zm.901 1.845c.266-.57.486-1.188.657-1.845h2.636A7.268 7.268 0 0 1 26 30.97a8.145 8.145 0 0 0 1.19-1.875zM15.25 24a8.75 8.75 0 1 1 17.5 0 8.75 8.75 0 0 1-17.5 0z" fill="#fff"/>
    433                     </svg>
    434                 </div>
    435                 <h3 class="is-smaller-heading"><?php _e( 'Performance highlights' ); ?></h3>
    436                 <p>
    437                     <?php
    438                     printf(
    439                         /* translators: 1: REST API performance dev note, 2: Multisite performance dev note, 3: code-formatted "WP_Query" linked to dev note, 4: Block registration performance dev note, 5: Site health checks dev note; 6: code-formatted "async", 7: Performance field guide. */
    440                         __( 'WordPress 6.1 resolved more than 25 tickets dedicated to enhancing performance. From the  <a href="%1$s">REST API</a> to <a href="%2$s">multisite</a>, %3$s to <a href="%4$s">core block registration</a>, and <a href="%5$s">new Site Health checks</a> to the addition of the %6$s attribute to images, there are performance improvements for every type of site. A full breakdown can be found in the <a href="%7$s">Performance Field Guide</a>.' ),
    441                         'https://make.wordpress.org/core/2022/10/10/performance-improvements-to-the-rest-api/',
    442                         'https://make.wordpress.org/core/2022/10/10/multisite-improvements-in-wordpress-6-1/',
    443                         '<a href="https://make.wordpress.org/core/2022/10/07/improvements-to-wp_query-performance-in-6-1/"><code>WP_Query</code></a>',
    444                         'https://make.wordpress.org/core/2022/10/07/improved-php-performance-for-core-blocks-registration/',
    445                         'https://make.wordpress.org/core/2022/10/06/new-cache-site-health-checks-in-wordpress-6-1/',
    446                         '<code>async</code>',
    447                         'https://make.wordpress.org/core/2022/10/11/performance-field-guide-for-wordpress-6-1/'
    448                     );
    449                     ?>
    450                 </p>
    451                 <p>
    452                     <?php
    453                     printf(
    454                         /* translators: %s: Link to install Performance Lab plugin if permitted, otherwise link to plugin on WordPress.org. */
    455                         __( 'Be among the first to get the latest improvements by adding the <a href="%s">Performance Lab plugin</a> to your WordPress test site or sandbox.' ),
    456                         current_user_can( 'install_plugins' ) ? admin_url( 'plugin-install.php?s=slug%253Aperformance-lab&tab=search&type=term' ) : esc_url( __( 'https://wordpress.org/plugins/performance-lab/' ) )
    457                     );
    458                     ?>
    459                 </p>
    460             </div>
    461             <div class="column">
    462                 <div class="about__image">
    463                     <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
    464                         <rect width="48" height="48" rx="4" fill="#1E1E1E"/>
    465                         <path fill-rule="evenodd" clip-rule="evenodd" d="M32.067 17.085l-3.245-3.14-10.621 10.726-1.303 4.412 4.528-1.252 10.64-10.746zM16 32.75h8v-1.5h-8v1.5z" fill="#fff"/>
    466                     </svg>
    467                 </div>
    468                 <h3 class="is-smaller-heading"><?php _e( 'Content-only editing support for container blocks' ); ?></h3>
    469                 <p>
    470                     <?php
    471                     printf(
    472                         /* translators: %s: Link to content locking dev note. */
    473                         __( 'Thanks to <a href="%s">content-only editing settings</a>, layouts can be locked within container blocks. In a content-only block, its children are invisible to the List View and entirely uneditable. So you control the layout while your writers can focus on the content.' ),
    474                         'https://make.wordpress.org/core/2022/10/11/content-locking-features-and-updates/'
    475                     );
    476                     ?>
    477                 </p>
    478                 <p><?php _e( 'Combine it with block locking options for even more advanced control over your blocks.' ); ?></p>
     153                <div class="about__image">
     154                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     155                </div>
     156                <h3 class="is-smaller-heading"><?php _e( 'Style Book' ); ?></h3>
     157                <p><?php _e( 'Use the new Style Book to get a complete overview of how every block in your site&#8217;s library looks. All in one place, all at a glance.' ); ?></p>
     158            </div>
     159            <div class="column">
     160                <div class="about__image">
     161                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     162                </div>
     163                <h3 class="is-smaller-heading"><?php _e( 'Copy and paste styles' ); ?></h3>
     164                <p><?php _e( 'Perfect the design on one type of block, then copy and paste those styles to other blocks to get just the look you want.' ); ?></p>
     165            </div>
     166            <div class="column">
     167                <div class="about__image">
     168                    <img src="data:image/svg+xml,%3Csvg width='436' height='436' viewbox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='%231d35b4' /%3E%3C/svg%3E" alt="" />
     169                </div>
     170                <h3 class="is-smaller-heading"><?php _e( 'Custom CSS' ); ?></h3>
     171                <p><?php _e( 'Power up your site any way you wish. Add CSS to your site, or your blocks, for another level of control over your site&#8217;s look and feel.' ); ?></p>
     172            </div>
     173        </div>
     174
     175        <div class="about__section has-3-columns">
     176            <div class="column">
     177                <div class="about__image">
     178                    <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
     179                        <rect width="48" height="48" rx="4" fill="#1D35B4"/>
     180                        <path fill-rule="evenodd" clip-rule="evenodd" d="M19.138 20.765a6.012 6.012 0 0 1 3.614-.62l4.15-5.617 6.57 6.57-5.616 4.15a6.01 6.01 0 0 1-.772 3.886c-.252.427-.561.828-.927 1.195l-3.713-3.713-5.692 5.693h-1.06v-1.061l5.692-5.692-3.713-3.713a6.007 6.007 0 0 1 1.467-1.078Zm7.936-3.944 4.105 4.105-4.933 3.647.124.884c.122.87-.01 1.766-.394 2.57l-6.002-6.003a4.515 4.515 0 0 1 2.57-.394l.883.124 3.647-4.933Z" fill="#fff"/>
     181                    </svg>
     182                </div>
     183                <h3 class="is-smaller-heading"><?php _e( 'Sticky positioning' ); ?></h3>
     184                <p><?php _e( 'Choose to keep certain blocks fixed to the top of a page as visitors scroll.' ); ?></p>
     185            </div>
     186            <div class="column">
     187                <div class="about__image">
     188                    <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
     189                        <rect width="48" height="48" rx="4" fill="#1D35B4"/>
     190                        <path fill-rule="evenodd" clip-rule="evenodd" d="M18 15h2v2h8v-2h2v2a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H18a2 2 0 0 1-2-2V19a2 2 0 0 1 2-2v-2Zm12 3.5H18a.5.5 0 0 0-.5.5v1h13v-1a.5.5 0 0 0-.5-.5Zm.5 3h-13V31a.5.5 0 0 0 .5.5h12a.5.5 0 0 0 .5-.5v-9.5ZM23 23h2v2h-2v-2Zm-4 0v2h2v-2h-2Zm8 2v-2h2v2h-2Z" fill="#fff"/>
     191                    </svg>
     192                </div>
     193                <h3 class="is-smaller-heading"><?php _e( 'Importing widgets' ); ?></h3>
     194                <p><?php _e( 'Options to import your favorite widgets from Classic themes to Block themes.' ); ?></p>
     195            </div>
     196            <div class="column">
     197                <div class="about__image">
     198                    <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
     199                        <rect width="48" height="48" rx="4" fill="#1D35B4"/>
     200                        <path fill-rule="evenodd" clip-rule="evenodd" d="M17.681 27.075h4.076l.977 2.774h1.72L20.564 19h-1.69L15 29.849h1.705l.976-2.774Zm2.046-5.766 1.503 4.262h-3.006l1.503-4.262Zm6.755 8.064c.332.366.864.549 1.595.549.498 0 .963-.1 1.395-.3.443-.21.825-.586 1.147-1.13.01.377.11.71.299.998.2.288.603.432 1.212.432.366 0 .665-.056.898-.166.243-.111.482-.26.714-.449l-.166-.282c-.11.088-.222.166-.332.232a.697.697 0 0 1-.366.1c-.177 0-.299-.061-.365-.183-.067-.122-.1-.316-.1-.581v-4.586c0-.543-.044-1.002-.133-1.379a1.828 1.828 0 0 0-.548-.963 1.974 1.974 0 0 0-.88-.499c-.344-.11-.754-.166-1.23-.166-.51 0-.975.06-1.396.183-.41.122-.747.271-1.013.448a2.84 2.84 0 0 0-.598.532c-.144.188-.216.432-.216.731 0 .288.083.543.249.764.166.21.42.316.764.316.31 0 .565-.089.764-.266.21-.177.316-.42.316-.73a1.04 1.04 0 0 0-.25-.715 1.108 1.108 0 0 0-.597-.4c.166-.21.393-.348.681-.414.288-.078.56-.117.814-.117.3 0 .554.05.764.15.222.1.393.271.515.515.133.232.2.548.2.947v1.13c0 .254-.117.465-.35.63-.22.167-.509.317-.863.45-.343.121-.714.254-1.113.398-.388.133-.759.3-1.113.499a2.583 2.583 0 0 0-.848.73c-.221.3-.332.687-.332 1.164 0 .576.16 1.052.482 1.428Zm3.356-.481c-.277.155-.56.232-.848.232-.354 0-.647-.116-.88-.349-.233-.232-.349-.598-.349-1.096 0-.51.116-.908.349-1.196.233-.288.51-.515.83-.682.333-.177.654-.337.964-.481.322-.144.56-.333.715-.565v3.306c-.244.388-.504.665-.781.83Z" fill="#fff"/>
     201                    </svg>
     202                </div>
     203                <h3 class="is-smaller-heading"><?php _e( 'Local fonts in themes' ); ?></h3>
     204                <p><?php _e( 'Default WordPress themes offer better privacy with Google Fonts included.' ); ?></p>
    479205            </div>
    480206        </div>
    … …  
    485211            <div class="column about__image is-vertically-aligned-top">
    486212                <a href="https://youtu.be/1w9oywSa6Hw">
    487                     <img src="data:image/svg+xml,%3Csvg width='269' height='163' viewBox='0 0 269 163' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Crect width='269' height='163' rx='4' fill='%23FDFF85'/%3E%3Cpath d='M238.84 130.043a1 1 0 0 0-1.524.852v8.21a1 1 0 0 0 1.524.852l6.671-4.105a1 1 0 0 0 0-1.703l-6.671-4.106Z' fill='%231E1E1E'/%3E%3Crect x='226.25' y='120.25' width='29.5' height='29.5' rx='2.75' stroke='%231E1E1E' stroke-width='1.5'/%3E%3Cpath d='M99.597 127.44c-6.16 0-11.36-1.16-15.6-3.48-4.24-2.32-7.68-5.4-10.32-9.24-2.56-3.84-4.4-8.16-5.52-12.96A64.74 64.74 0 0 1 66.477 87c0-9.28 1.28-17.4 3.84-24.36 2.64-6.96 6.4-12.36 11.28-16.2 4.88-3.92 10.8-5.88 17.76-5.88 5.521 0 10.241 1.08 14.161 3.24s6.96 5.04 9.12 8.64c2.24 3.6 3.6 7.52 4.08 11.76h-11.88c-.72-4.16-2.44-7.36-5.16-9.6-2.72-2.24-6.2-3.36-10.44-3.36-5.84 0-10.68 2.76-14.52 8.28-3.76 5.44-5.76 13.84-6 25.2 1.92-3.52 4.88-6.52 8.88-9 4.08-2.48 8.76-3.72 14.04-3.72 4.72 0 9.12 1.12 13.2 3.36 4.16 2.24 7.52 5.4 10.08 9.48 2.64 4 3.96 8.76 3.96 14.28 0 4.88-1.2 9.48-3.6 13.8-2.4 4.32-5.8 7.84-10.2 10.56-4.32 2.64-9.48 3.96-15.48 3.96Zm-.72-11.04c3.361 0 6.361-.72 9.001-2.16 2.64-1.44 4.72-3.4 6.24-5.88 1.52-2.56 2.28-5.44 2.28-8.64 0-5.12-1.68-9.2-5.04-12.24-3.28-3.04-7.48-4.56-12.6-4.56-3.36 0-6.4.76-9.12 2.28-2.64 1.52-4.72 3.56-6.24 6.12-1.52 2.48-2.28 5.24-2.28 8.28 0 3.28.76 6.2 2.28 8.76 1.6 2.48 3.72 4.44 6.36 5.88 2.72 1.44 5.76 2.16 9.12 2.16Zm45.925 10.32c-2.4 0-4.4-.76-6-2.28-1.52-1.6-2.28-3.48-2.28-5.64 0-2.24.76-4.12 2.28-5.64 1.6-1.6 3.6-2.4 6-2.4s4.36.8 5.88 2.4c1.52 1.52 2.28 3.4 2.28 5.64 0 2.16-.76 4.04-2.28 5.64-1.52 1.52-3.48 2.28-5.88 2.28Zm26.814-.72V56.4l-13.56 3.12v-9.36l18.6-8.16h8.16v84h-13.2Z' fill='%231E1E1E'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='269' height='163' rx='4' fill='%23fff'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A" alt="<?php echo esc_attr( __( 'Exploring WordPress 6.1 video' ) ); ?>" />
     213                    <img src="data:image/svg+xml,%3Csvg width='294' height='280' viewBox='0 0 294 280' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23a)'%3E%3Cg clip-path='url(%23b)'%3E%3Cpath fill='%231D35B4' d='M0 0h280v280H0z'/%3E%3Cpath d='m178.94 801.802-59.946-94.723c45.365-71.684 70.344-166.987 70.344-268.362 0-101.375-24.979-196.678-70.344-268.362C73.629 98.671 13.316 59.202-50.84 59.202s-124.468 39.47-169.834 111.153c-45.365 71.684-70.344 166.987-70.344 268.362 0 101.375 24.979 196.678 70.344 268.362l-59.945 94.723c-61.373-96.978-95.181-225.924-95.181-363.063 0-137.139 33.794-266.085 95.181-363.062 61.372-96.977 142.976-150.4 229.765-150.4 86.789 0 168.393 53.4 229.765 150.4 61.373 96.977 95.181 225.923 95.181 363.062s-33.794 266.085-95.181 363.063h.029Z' fill='%23213FD4'/%3E%3Cpath d='m79.037 643.943-59.945-94.722c38.556-60.924 38.556-160.066 0-221.012-38.555-60.923-101.299-60.923-139.868 0-38.556 60.923-38.556 160.066 0 220.99l-59.946 94.722c-71.615-113.162-71.615-297.272 0-410.435 71.616-113.162 188.13-113.162 259.746 0 71.615 113.163 71.615 297.273 0 410.435l.013.022Z' fill='%23213FD4'/%3E%3Cpath d='m278.852 959.676-59.946-94.723c72.054-113.854 111.726-265.214 111.726-426.218 0-161.004-39.672-312.363-111.726-426.218C146.853-101.337 51.065-164.024-50.827-164.024s-197.681 62.687-269.734 176.541c-72.053 113.855-111.725 265.214-111.725 426.218 0 161.004 39.672 312.364 111.725 426.218l-59.946 94.723c-44.489-70.3-78.947-152.32-102.414-243.738-22.662-88.271-34.148-181.542-34.148-277.18s11.486-188.91 34.148-277.181c23.467-91.44 57.925-173.438 102.414-243.738 44.49-70.299 96.396-124.749 154.251-161.83 55.862-35.808 114.89-53.958 175.415-53.958 60.524 0 119.552 18.15 175.414 53.958 57.869 37.081 109.761 91.531 154.251 161.83 44.489 70.3 78.948 152.32 102.414 243.738 22.662 88.271 34.148 181.543 34.148 277.181 0 95.638-11.486 188.909-34.148 277.18-23.466 91.441-57.925 173.438-102.414 243.738h.028Z' fill='%23213FD4'/%3E%3Cpath d='m218.905 864.928-357.086 564.242 59.94 94.72 357.086-564.247-59.94-94.715ZM119.004 707.087-330.27 1417l59.94 94.72 449.274-709.918-59.94-94.715ZM19.094 549.203l-536.247 847.347 59.94 94.72L79.034 643.917l-59.94-94.714ZM2335.61 1839.71H-517.886v136.44H2335.61v-136.44ZM2335.61 1617.98H-517.886v136.45H2335.61v-136.45Z' fill='%23213FD4'/%3E%3Cpath d='M2335.61 1396.25H-517.886v130.76H2335.61v-130.76Z' fill='%23213FD4'/%3E%3C/g%3E%3Cpath d='m75.895 129.264-5.608 5.45a17.076 17.076 0 0 1 9.5 4.666 16.24 16.24 0 0 1 0 23.402c-3.216 3.126-7.492 4.847-12.04 4.847-4.548 0-8.824-1.721-12.04-4.847a16.239 16.239 0 0 1 0-23.402l-4.838-4.702c-9.306 9.044-9.306 23.76 0 32.805 4.509 4.382 10.503 6.794 16.878 6.794s12.369-2.412 16.877-6.794c9.307-9.045 9.307-23.761 0-32.805a23.893 23.893 0 0 0-8.73-5.414Z' fill='%2333F078'/%3E%3Cpath d='m84.501 120.9-5.106 4.962a28.488 28.488 0 0 1 8.455 5.682c5.37 5.218 8.327 12.157 8.327 19.537 0 7.381-2.958 14.319-8.327 19.538-5.37 5.218-12.51 8.093-20.103 8.093-7.594 0-14.733-2.875-20.103-8.093-5.37-5.218-8.327-12.157-8.327-19.538 0-7.38 2.957-14.318 8.327-19.537l-4.838-4.702c-6.662 6.475-10.33 15.083-10.33 24.238 0 9.156 3.669 17.765 10.33 24.239 6.66 6.473 15.52 10.039 24.94 10.039 9.421 0 18.278-3.566 24.94-10.039 6.662-6.475 10.33-15.083 10.33-24.239 0-9.155-3.67-17.764-10.33-24.238A35.356 35.356 0 0 0 84.5 120.9h.001Z' fill='%2333F078'/%3E%3Cpath d='M111.002 134.014c-2.349-5.629-5.798-10.678-10.253-15.007a46.57 46.57 0 0 0-7.927-6.195l-4.973 4.834a39.92 39.92 0 0 1 8.062 6.062c7.523 7.312 11.667 17.034 11.667 27.374s-4.144 20.061-11.667 27.373c-7.523 7.311-17.526 11.338-28.165 11.338-10.64 0-20.643-4.027-28.166-11.338-7.523-7.312-11.667-17.033-11.667-27.373s4.144-20.062 11.667-27.374l-4.838-4.701c-4.455 4.328-7.904 9.378-10.253 15.006a44.158 44.158 0 0 0-3.415 17.068c0 5.889 1.15 11.632 3.419 17.067 2.349 5.629 5.798 10.678 10.253 15.008a46.51 46.51 0 0 0 15.44 9.964 47.695 47.695 0 0 0 17.562 3.322c6.06 0 11.969-1.117 17.561-3.321a46.498 46.498 0 0 0 15.441-9.964c4.454-4.329 7.904-9.379 10.253-15.008a44.094 44.094 0 0 0 3.417-17.067c0-5.89-1.149-11.632-3.417-17.068h-.001Z' fill='%2333F078'/%3E%3Cpath d='m103.47 83.559-52.6 51.119 4.838 4.702 57.437-55.821h-9.675ZM87.344 83.559l-44.538 43.283 4.838 4.702L97.02 83.559h-9.675ZM71.219 83.559l-36.475 35.448 4.838 4.702 41.312-40.15H71.22ZM167.807 138.655l-4.765-4.661c3.606-3.527 5.592-8.216 5.592-13.205 0-4.988-1.986-9.678-5.592-13.205-3.607-3.527-8.401-5.47-13.501-5.47s-9.895 1.943-13.501 5.47c-3.607 3.527-5.592 8.217-5.592 13.205 0 4.989 1.985 9.678 5.592 13.205l-4.766 4.661c-4.879-4.771-7.566-11.117-7.566-17.865 0-6.748 2.686-13.093 7.566-17.865 4.879-4.772 11.366-7.4 18.266-7.4 6.899 0 13.386 2.627 18.265 7.4 4.879 4.772 7.566 11.117 7.566 17.865 0 6.748-2.686 13.094-7.566 17.865h.002Z' fill='%2333F078'/%3E%3Cpath d='m159.865 130.888-4.765-4.661a7.582 7.582 0 0 0 0-10.876c-3.065-2.997-8.053-2.997-11.119 0a7.58 7.58 0 0 0 0 10.875l-4.765 4.661a14.077 14.077 0 0 1 0-20.197c5.693-5.568 14.955-5.568 20.648 0a14.077 14.077 0 0 1 0 20.197l.001.001Z' fill='%2333F078'/%3E%3Cpath d='m175.75 146.424-4.766-4.661c5.728-5.602 8.882-13.05 8.882-20.973 0-7.922-3.154-15.37-8.882-20.973-5.728-5.602-13.342-8.687-21.442-8.687s-15.715 3.085-21.443 8.687c-5.728 5.603-8.882 13.051-8.882 20.973 0 7.923 3.154 15.371 8.882 20.973l-4.765 4.661c-3.537-3.459-6.276-7.495-8.142-11.994a35.432 35.432 0 0 1-2.714-13.639c0-4.706.913-9.295 2.714-13.639 1.866-4.5 4.605-8.534 8.142-11.994a36.91 36.91 0 0 1 12.262-7.963 37.647 37.647 0 0 1 13.945-2.655c4.811 0 9.503.893 13.944 2.655a36.89 36.89 0 0 1 12.262 7.963c3.537 3.46 6.276 7.496 8.142 11.994a35.436 35.436 0 0 1 2.715 13.639c0 4.706-.914 9.296-2.715 13.639-1.866 4.5-4.605 8.535-8.142 11.994h.003Z' fill='%2333F078'/%3E%3Cpath d='m170.984 141.762-28.387 27.765 4.765 4.66 28.387-27.765-4.765-4.66ZM163.042 133.995l-35.715 34.933 4.765 4.66 35.715-34.933-4.765-4.66ZM155.1 126.226l-42.629 41.695 4.765 4.661 42.629-41.696-4.765-4.66ZM339.253 189.728h-226.84v6.714h226.84v-6.714ZM339.253 178.817h-226.84v6.714h226.84v-6.714Z' fill='%2333F078'/%3E%3Cpath d='M339.253 167.907h-226.84v6.434h226.84v-6.434Z' fill='%2333F078'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h294v280H0z'/%3E%3C/clipPath%3E%3CclipPath id='b'%3E%3Cpath fill='%23fff' d='M0 0h280v280H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A" alt="<?php echo esc_attr( __( 'Exploring WordPress 6.2 video' ) ); ?>" />
    488214                </a>
    489215            </div>
    490             <div class="column">
     216            <div class="column is-vertically-aligned-center">
    491217                <h3>
    492218                    <?php
    … …  
    498224                    ?>
    499225                </h3>
    500                 <p>
    501                     <?php
    502                     printf(
    503                         /* translators: %s: 6.1 overview video link. */
    504                         __( 'See WordPress 6.1 in action! <a href="%s">Watch a brief overview video</a> highlighting some of the major features debuting in WordPress 6.1.' ),
    505                         'https://youtu.be/1w9oywSa6Hw'
    506                     );
    507                     ?>
    508                 </p>
    509             </div>
    510         </div>
    511 
    512         <div class="about__section has-3-columns">
    513             <div class="column" style="padding-top:0">
    514                 <p>
     226                <p class="is-subheading">
    515227                    <?php
    516228                    printf(
    … …  
    522234                </p>
    523235            </div>
    524             <div class="column" style="padding-top:0">
     236        </div>
     237
     238        <div class="about__section has-2-columns">
     239            <div class="column">
     240                <div class="about__image">
     241                    <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
     242                        <rect width="48" height="48" rx="4" fill="#1D35B4"/>
     243                        <path d="M23 34v-4h-5l-2.293-2.293a1 1 0 0 1 0-1.414L18 24h5v-2h-7v-6h7v-2h2v2h5l2.293 2.293a1 1 0 0 1 0 1.414L30 22h-5v2h7v6h-7v4h-2Zm-5-14h11.175l.646-.646a.5.5 0 0 0 0-.708L29.175 18H18v2Zm.825 8H30v-2H18.825l-.646.646a.5.5 0 0 0 0 .708l.646.646Z" fill="#fff"/>
     244                    </svg>
     245                </div>
    525246                <p>
    526247                    <?php
    … …  
    528249                        /* translators: %s: WordPress Field Guide link. */
    529250                        __( 'Check out the latest version of the <a href="%s">WordPress Field Guide</a>. It is overflowing with detailed developer notes to help you build with WordPress.' ),
    530                         __( 'https://make.wordpress.org/core/2022/10/12/wordpress-6-1-field-guide/' )
     251                        '#'
    531252                    );
    532253                    ?>
    533254                </p>
    534255            </div>
    535             <div class="column" style="padding-top:0">
     256            <div class="column">
     257                <div class="about__image">
     258                    <svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false">
     259                        <rect width="48" height="48" rx="4" fill="#1D35B4"/>
     260                        <path d="M28 19.75h-8v1.5h8v-1.5ZM20 23h8v1.5h-8V23ZM26 26.25h-6v1.5h6v-1.5Z" fill="#fff"/>
     261                        <path fill-rule="evenodd" clip-rule="evenodd" d="M29 16H19a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V18a2 2 0 0 0-2-2Zm-10 1.5h10a.5.5 0 0 1 .5.5v12a.5.5 0 0 1-.5.5H19a.5.5 0 0 1-.5-.5V18a.5.5 0 0 1 .5-.5Z" fill="#fff"/>
     262                    </svg>
     263                </div>
    536264                <p>
    537265                    <?php
    … …  
    542270                            /* translators: %s: WordPress version number. */
    543271                            esc_url( __( 'https://wordpress.org/support/wordpress-version/version-%s/' ) ),
    544                             '6-1'
     272                            '6-2'
    545273                        ),
    546                         '6.1'
     274                        '6.2'
    547275                    );
    548276                    ?>
Note: See TracChangeset for help on using the changeset viewer.