Make WordPress Core


Ignore:
Timestamp:
02/12/2024 09:55:44 PM (3 months ago)
Author:
jorbin
Message:

General: Add an option to configure the site icon in general settings.

This restores the site icon setting to its original home on the settings page where it lives with the title and tagline.

The base for this code was originally added in [32994] and then removed in [33329]. The majority of the modification to that version are to remove the no-js pieces and make the workflow completely inline rather than putting the cropping on a separate page.

Additionally, since image crops rely on the ability to upload an image, this setting is gated by the upload_files capability.

Follow-up to: [32994], [33329].

Props jorbin, audrasjb, mukesh27, joedolson, afercia, kebbet, swissspidy, obenland, jameskoster, kjellr, andraganescu, stacimc, mikeschroder, h71, krupajnanda, huzaifaalmesbah.
Fixes #54370.
See #16434.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/options-general.php

    r56680 r57602  
    9898</tr>
    9999
    100 <?php
     100<?php if ( current_user_can( 'upload_files' ) ) : ?>
     101<tr class="hide-if-no-js site-icon-section">
     102<th scope="row"><?php _e( 'Site Icon' ); ?></th>
     103<td>
     104    <?php
     105    wp_enqueue_media();
     106    wp_enqueue_script( 'site-icon' );
     107
     108    $classes_for_upload_button = 'upload-button button-add-media button-add-site-icon';
     109    $classes_for_update_button = 'button';
     110
     111    $classes_for_avatar = 'avatar avatar-150';
     112    if ( has_site_icon() ) {
     113        $classes_for_avatar          .= ' has-site-icon';
     114        $classes_for_button           = $classes_for_update_button;
     115        $classes_for_button_on_change = $classes_for_upload_button;
     116    } else {
     117        $classes_for_avatar          .= ' hidden';
     118        $classes_for_button           = $classes_for_upload_button;
     119        $classes_for_button_on_change = $classes_for_update_button;
     120    }
     121
     122
     123    ?>
     124    <div id="site-icon-preview" class="site-icon-preview wp-clearfix <?php echo esc_attr( $classes_for_avatar ); ?>">
     125        <div class="favicon-preview">
     126            <img src="<?php echo esc_url( admin_url( 'images/' . ( is_rtl() ? 'browser-rtl.png' : 'browser.png' ) ) ); ?>" class="browser-preview" width="182" alt="">
     127            <div class="favicon">
     128                <img src="<?php site_icon_url(); ?>" alt="Preview as a browser icon">
     129            </div>
     130            <span class="browser-title" aria-hidden="true"><?php echo get_bloginfo( 'name' ); ?></span>
     131        </div>
     132        <img class="app-icon-preview" src="<?php site_icon_url(); ?>" alt="Preview as an app icon">
     133    </div>
     134    <input type="hidden" name="site_icon" id="site_icon_hidden_field" value="<?php form_option( 'site_icon' ); ?>" />
     135    <p>
     136        <button type="button"
     137            id="choose-from-library-link"
     138            type="button"
     139            class="<?php echo esc_attr( $classes_for_button ); ?>"
     140            data-alt-classes="<?php echo esc_attr( $classes_for_button_on_change ); ?>"
     141            data-size="512"
     142            data-choose-text="<?php esc_attr_e( 'Choose a Site Icon' ); ?>"
     143            data-update-text="<?php esc_attr_e( 'Change Site Icon' ); ?>"
     144            data-update="<?php esc_attr_e( 'Set as Site Icon' ); ?>"
     145            data-state="<?php echo esc_attr( has_site_icon() ); ?>"
     146
     147        >
     148            <?php if ( has_site_icon() ) : ?>
     149                <?php _e( 'Change Site Icon' ); ?>
     150            <?php else : ?>
     151                <?php _e( 'Choose a Site Icon' ); ?>
     152            <?php endif; ?>
     153        </button>
     154        <button
     155            id="js-remove-site-icon"
     156            type="button"
     157            <?php echo has_site_icon() ? 'class="button button-secondary reset"' : 'class="button button-secondary reset hidden"'; ?>
     158        >
     159            <?php _e( 'Remove Site Icon' ); ?>
     160        </button>
     161    </p>
     162
     163    <p class="description" id="site-icon-description">
     164        <?php _e( 'Site Icons are what you see in browser tabs, bookmark bars, and within the WordPress mobile apps. Upload one here!' ); ?>
     165    </p>
     166    <p class="description" id="site-icon-further-description">
     167        <?php
     168            /* translators: %s: Site Icon size in pixels. */
     169            printf( __( 'Site Icons should be square and at least %s pixels.' ), '<strong>512 &times; 512</strong>' );
     170        ?>
     171    </p>
     172
     173</td>
     174</tr>
     175
     176    <?php
     177endif;
     178    /* End Site Icon */
     179
    101180if ( ! is_multisite() ) {
    102181    $wp_site_url_class = '';
Note: See TracChangeset for help on using the changeset viewer.