[ Index ]

PHP Cross Reference of WordPress

title

Body

[close]

/wp-admin/ -> about.php (source)

   1  <?php
   2  /**
   3   * About This Version administration panel.
   4   *
   5   * @package WordPress
   6   * @subpackage Administration
   7   */
   8  
   9  /** WordPress Administration Bootstrap */
  10  require_once  __DIR__ . '/admin.php';
  11  
  12  wp_enqueue_script( 'wp-components' );
  13  wp_enqueue_style( 'wp-components' );
  14  
  15  /* translators: Page title of the About WordPress page in the admin. */
  16  $title = _x( 'About', 'page title' );
  17  
  18  list( $display_version ) = explode( '-', get_bloginfo( 'version' ) );
  19  
  20  require_once ABSPATH . 'wp-admin/admin-header.php';
  21  ?>
  22      <div class="wrap about__container">
  23  
  24          <div class="about__header">
  25              <div class="about__header-image">
  26                  <img alt="<?php _e( 'Code is Poetry' ); ?>" src="images/about-badge.svg" />
  27              </div>
  28  
  29              <div class="about__header-title">
  30                  <p>
  31                      <?php _e( 'WordPress' ); ?>
  32                      <?php echo $display_version; ?>
  33                  </p>
  34              </div>
  35  
  36              <div class="about__header-text">
  37                  <?php _e( 'Jazz up your stories in an editor that’s cleaner, crisper, and does more to get out of your way.' ); ?>
  38              </div>
  39  
  40              <nav class="about__header-navigation nav-tab-wrapper wp-clearfix" aria-label="<?php esc_attr_e( 'Secondary menu' ); ?>">
  41                  <a href="about.php" class="nav-tab nav-tab-active" aria-current="page"><?php _e( 'What&#8217;s New' ); ?></a>
  42                  <a href="credits.php" class="nav-tab"><?php _e( 'Credits' ); ?></a>
  43                  <a href="freedoms.php" class="nav-tab"><?php _e( 'Freedoms' ); ?></a>
  44                  <a href="privacy.php" class="nav-tab"><?php _e( 'Privacy' ); ?></a>
  45              </nav>
  46          </div>
  47  
  48          <div class="about__section is-feature has-subtle-background-color">
  49              <div class="column">
  50                  <h1 class="is-smaller-heading">
  51                      <?php
  52                      printf(
  53                          /* translators: %s: The current WordPress version number. */
  54                          __( 'Step into WordPress %s.' ),
  55                          $display_version
  56                      );
  57                      ?>
  58                  </h1>
  59                  <p>
  60                      <?php
  61                      _e( 'With this new version, WordPress brings you fresh colors. The editor helps you work in a few places you couldn’t before—at least, not without getting into code or hiring a pro. The controls you use most, like changing font sizes, are in more places—right where you need them. And layout changes that should be simple, like full-height images, are even simpler to make.' );
  62                      ?>
  63                  </p>
  64              </div>
  65          </div>
  66  
  67          <hr class="is-large" />
  68  
  69          <div class="about__section has-2-columns">
  70              <h2 class="is-section-header is-smaller-heading">
  71                  <?php _e( 'Now the editor is easier to use' ); ?>
  72              </h2>
  73              <div class="column">
  74                  <p>
  75                      <?php
  76                      _e( '<strong>Font-size adjustment in more places:</strong> now, font-size controls are right where you need them in the List and Code blocks. No more trekking to another screen to make that single change!' );
  77                      ?>
  78                  </p>
  79                  <p>
  80                      <?php
  81                      _e( '<strong>Reusable blocks:</strong> several enhancements make reusable blocks more stable and easier to use. And now they save automatically with the post when you click the Update button.' );
  82                      ?>
  83                  </p>
  84                  <p>
  85                      <?php
  86                      _e( '<strong>Inserter drag-and-drop:</strong> drag blocks and block patterns from the inserter right into your post.' );
  87                      ?>
  88                  </p>
  89              </div>
  90              <div class="column about__image">
  91                  <video controls>
  92                      <source src="https://s.w.org/images/core/5.7/about-57-drag-drop-image.mp4" type="video/mp4" />
  93                      <source src="https://s.w.org/images/core/5.7/about-57-drag-drop-image.mp4" type="video/webm" />
  94                  </video>
  95              </div>
  96          </div>
  97  
  98          <div class="about__section has-2-columns">
  99              <h2 class="is-section-header is-smaller-heading">
 100                  <?php _e( 'You can do more without writing custom code' ); ?>
 101              </h2>
 102              <div class="column">
 103                  <p>
 104                      <?php
 105                      _e( '<strong>Full-height alignment:</strong> have you ever wanted to make a block, like the Cover block, fill the whole window? Now you can.' );
 106                      ?>
 107                  </p>
 108                  <p>
 109                      <?php
 110                      _e( '<strong>Buttons block:</strong> now you can choose a vertical or a horizontal layout. And you can set the width of a button to a preset percentage.' );
 111                      ?>
 112                  </p>
 113                  <p>
 114                      <?php
 115                      _e( '<strong>Social Icons block:</strong> now you can change the size of the icons.' );
 116                      ?>
 117                  </p>
 118              </div>
 119              <div class="column about__image">
 120                  <img src="https://s.w.org/images/core/5.7/about-57-cover.jpg" alt="" />
 121              </div>
 122          </div>
 123  
 124          <hr />
 125  
 126          <div class="about__section has-subtle-background-color">
 127              <div class="column">
 128                  <h2 class="is-smaller-heading"><?php _e( 'A Simpler Default Color Palette' ); ?></h2>
 129              </div>
 130          </div>
 131  
 132          <div class="about__section has-subtle-background-color">
 133              <figure class="column about__image" id="about-image-comparison">
 134                  <div class="about__image-comparison no-js">
 135                      <img src="https://s.w.org/images/core/5.7/about-57-color-old.png" alt="<?php esc_attr_e( 'Dashboard with old color scheme.' ); ?>" />
 136                      <div class="about__image-comparison-resize">
 137                          <img src="https://s.w.org/images/core/5.7/about-57-color-new.png" alt="<?php esc_attr_e( 'Dashboard with new color scheme.' ); ?>" />
 138                      </div>
 139                  </div>
 140                  <figcaption><?php _e( 'Above, the Dashboard before and after the color update in 5.7.' ); ?></figcaption>
 141              </figure>
 142          </div>
 143  
 144          <div class="about__section has-2-columns has-subtle-background-color">
 145              <div class="column">
 146                  <p>
 147                      <?php
 148                      printf(
 149                          /* translators: %s: WCAG information link. */
 150                          __( 'This new streamlined color palette collapses all the colors that used to be in the WordPress source code down to seven core colors and a range of 56 shades that meet the <a href="%s">WCAG 2.0 AA recommended contrast ratio</a> against white or black.' ),
 151                          'https://www.w3.org/WAI/WCAG2AAA-Conformance'
 152                      );
 153                      ?>
 154                  </p>
 155                  <p>
 156                      <?php
 157                      _e( 'The colors are perceptually uniform from light to dark in each range, which means they start at white and get darker by the same amount with each step.' );
 158                      ?>
 159                  </p>
 160              </div>
 161              <div class="column">
 162                  <p>
 163                      <?php
 164                      _e( 'Half the range has a 4.5 or higher contrast ratio against black, and the other half maintains the same contrast against white.' );
 165                      ?>
 166                  </p>
 167                  <p>
 168                      <?php
 169                      printf(
 170                          /* translators: %s: Color palette dev note link. */
 171                          __( 'Find the new palette in the default WordPress Dashboard color scheme, and use it when you’re building themes, plugins, or any other components. For all the details, <a href="%s">check out the Color Palette dev note</a>.' ),
 172                          'https://make.wordpress.org/core/2021/02/23/standardization-of-wp-admin-colors-in-wordpress-5-7'
 173                      );
 174                      ?>
 175                  </p>
 176              </div>
 177          </div>
 178  
 179          <div class="about__section has-subtle-background-color">
 180              <div class="column about__image">
 181                  <picture>
 182                      <source media="(max-width: 600px)" srcset="images/about-color-palette-vert.svg" />
 183                      <img alt="" src="images/about-color-palette.svg" />
 184                  </picture>
 185              </div>
 186          </div>
 187  
 188          <hr />
 189  
 190          <div class="about__section has-2-columns">
 191              <div class="column">
 192                  <h3><?php _e( 'From HTTP to HTTPS in a single click' ); ?></h3>
 193                  <p><?php _e( 'Starting now, switching a site from HTTP to HTTPS is a one-click move. WordPress will automatically update database URLs when you make the switch. No more hunting and guessing!' ); ?></p>
 194                  <h3><?php _e( 'New Robots API' ); ?></h3>
 195                  <p>
 196                      <?php
 197                      _e( 'The new Robots API lets you include the filter directives in the robots meta tag, and the API includes the <code>max-image-preview: large</code> directive by default. That means search engines can show bigger image previews, which can boost your traffic (unless the site is marked <em>not-public</em>).' );
 198                      ?>
 199                  </p>
 200              </div>
 201              <div class="column">
 202                  <h3><?php _e( 'Ongoing cleanup after update to jQuery 3.5.1' ); ?></h3>
 203                  <p><?php _e( 'For years jQuery helped make things move on the screen in ways the basic tools couldn’t—but that keeps changing, and so does jQuery.' ); ?></p>
 204                  <p><?php _e( 'In 5.7, jQuery gets more focused and less intrusive, with fewer messages in the console.' ); ?></p>
 205                  <h3><?php _e( 'Lazy-load your iframes' ); ?></h3>
 206                  <p><?php _e( 'Now it’s simple to let iframes lazy-load. By default, WordPress will add a <code>loading="lazy"</code> attribute to iframe tags when both width and height are specified.' ); ?></p>
 207              </div>
 208          </div>
 209  
 210          <hr class="is-small" />
 211  
 212          <div class="about__section">
 213              <div class="column">
 214                  <h3><?php _e( 'Check the Field Guide for more!' ); ?></h3>
 215                  <p>
 216                      <?php
 217                      printf(
 218                          /* translators: %s: WordPress 5.7 Field Guide link. */
 219                          __( 'Check out the latest version of the WordPress Field Guide. It highlights developer notes for each change you may want to be aware of. <a href="%s">WordPress 5.7 Field Guide.</a>' ),
 220                          'https://make.wordpress.org/core/2021/02/23/wordpress-5-7-field-guide'
 221                      );
 222                      ?>
 223                  </p>
 224              </div>
 225          </div>
 226  
 227          <hr />
 228  
 229          <div class="return-to-dashboard">
 230              <?php if ( current_user_can( 'update_core' ) && isset( $_GET['updated'] ) ) : ?>
 231                  <a href="<?php echo esc_url( self_admin_url( 'update-core.php' ) ); ?>">
 232                      <?php is_multisite() ? _e( 'Go to Updates' ) : _e( 'Go to Dashboard &rarr; Updates' ); ?>
 233                  </a> |
 234              <?php endif; ?>
 235              <a href="<?php echo esc_url( self_admin_url() ); ?>"><?php is_blog_admin() ? _e( 'Go to Dashboard &rarr; Home' ) : _e( 'Go to Dashboard' ); ?></a>
 236          </div>
 237      </div>
 238  
 239  <?php require_once ABSPATH . 'wp-admin/admin-footer.php'; ?>
 240  
 241  <script>
 242      wp.domReady( function() {
 243          var createElement = wp.element.createElement;
 244          var Fragment = wp.element.Fragment;
 245          var render = wp.element.render;
 246          var useState = wp.element.useState;
 247          var ResizableBox = wp.components.ResizableBox;
 248  
 249          var container = document.getElementById( 'about-image-comparison' );
 250          var images = container ? container.querySelectorAll( 'img' ) : [];
 251          if ( ! images.length ) {
 252              // Something's wrong, return early.
 253              return;
 254          }
 255  
 256          var beforeImage = images.item( 0 );
 257          var afterImage = images.item( 1 );
 258          var caption = container.querySelector( 'figcaption' ).innerText;
 259  
 260  		function ImageComparison( props ) {
 261              var stateHelper = useState( props.width );
 262              var width = stateHelper[0];
 263              var setWidth = stateHelper[1];
 264  
 265              return createElement(
 266                  'div',
 267                  {
 268                      className: 'about__image-comparison'
 269                  },
 270                  createElement( 'img', { src: beforeImage.src, alt: beforeImage.alt } ),
 271                  createElement(
 272                      ResizableBox,
 273                      {
 274                          size: {
 275                              width: width,
 276                              height: props.height
 277                          },
 278                          onResizeStop: function( event, direction, elt, delta ) {
 279                              setWidth( parseInt( width + delta.width, 10 ) );
 280                          },
 281                          showHandle: true,
 282                          enable: {
 283                              top: false,
 284                              right: ! wp.i18n.isRTL(),
 285                              bottom: false,
 286                              left: wp.i18n.isRTL(),
 287                          },
 288                          className: 'about__image-comparison-resize'
 289                      },
 290                      createElement(
 291                          'div',
 292                          {
 293                              style: { width: '100%', height: '100%', overflow: 'hidden' }
 294                          },
 295                          createElement('img', { src: afterImage.src, alt: afterImage.alt } )
 296                      )
 297                  )
 298              );
 299          }
 300  
 301          render(
 302              createElement(
 303                  Fragment,
 304                  {},
 305                  createElement(
 306                      ImageComparison,
 307                      {
 308                          width: beforeImage.clientWidth / 2,
 309                          height: beforeImage.clientHeight
 310                      }
 311                  ),
 312                  createElement( 'figcaption', {}, caption )
 313              ),
 314              container
 315          );
 316      } );
 317  </script>
 318  <?php
 319  
 320  // These are strings we may use to describe maintenance/security releases, where we aim for no new strings.
 321  return;
 322  
 323  __( 'Maintenance Release' );
 324  __( 'Maintenance Releases' );
 325  
 326  __( 'Security Release' );
 327  __( 'Security Releases' );
 328  
 329  __( 'Maintenance and Security Release' );
 330  __( 'Maintenance and Security Releases' );
 331  
 332  /* translators: %s: WordPress version number. */
 333  __( '<strong>Version %s</strong> addressed one security issue.' );
 334  /* translators: %s: WordPress version number. */
 335  __( '<strong>Version %s</strong> addressed some security issues.' );
 336  
 337  /* translators: 1: WordPress version number, 2: Plural number of bugs. */
 338  _n_noop(
 339      '<strong>Version %1$s</strong> addressed %2$s bug.',
 340      '<strong>Version %1$s</strong> addressed %2$s bugs.'
 341  );
 342  
 343  /* translators: 1: WordPress version number, 2: Plural number of bugs. Singular security issue. */
 344  _n_noop(
 345      '<strong>Version %1$s</strong> addressed a security issue and fixed %2$s bug.',
 346      '<strong>Version %1$s</strong> addressed a security issue and fixed %2$s bugs.'
 347  );
 348  
 349  /* translators: 1: WordPress version number, 2: Plural number of bugs. More than one security issue. */
 350  _n_noop(
 351      '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bug.',
 352      '<strong>Version %1$s</strong> addressed some security issues and fixed %2$s bugs.'
 353  );
 354  
 355  /* translators: %s: Documentation URL. */
 356  __( 'For more information, see <a href="%s">the release notes</a>.' );


Generated: Tue Mar 9 01:00:03 2021 Cross-referenced by PHPXref 0.7.1