WP_Customize_Site_Icon_Control WordPress Class
The WP_Customize_Site_Icon_Control class allows you to upload a custom site icon in the WordPress Customizer. This icon will be used as your site's favicon, as well as the icon for your site on mobile devices and in your site's RSS feed. To upload a custom icon, simply click the "Upload" button and select the file from your computer. Once your icon has been uploaded, you can crop it to the desired size. After you have cropped your icon, you can preview how it will look on your site by clicking the "Preview" button. If you are satisfied with your icon, click the "Save & Publish" button to save your changes.
WP_Customize_Site_Icon_Control #
Customize Site Icon control class.
Description
Used only for custom functionality in JavaScript.
See also
Source
File: wp-includes/customize/class-wp-customize-site-icon-control.php
class WP_Customize_Site_Icon_Control extends WP_Customize_Cropped_Image_Control { /** * Control type. * * @since 4.3.0 * @var string */ public $type = 'site_icon'; /** * Constructor. * * @since 4.3.0 * * @see WP_Customize_Control::__construct() * * @param WP_Customize_Manager $manager Customizer bootstrap instance. * @param string $id Control ID. * @param array $args Optional. Arguments to override class property defaults. * See WP_Customize_Control::__construct() for information * on accepted arguments. Default empty array. */ public function __construct( $manager, $id, $args = array() ) { parent::__construct( $manager, $id, $args ); add_action( 'customize_controls_print_styles', 'wp_site_icon', 99 ); } /** * Renders a JS template for the content of the site icon control. * * @since 4.5.0 */ public function content_template() { ?> <# if ( data.label ) { #> <span class="customize-control-title">{{ data.label }}</span> <# } #> <# if ( data.description ) { #> <span class="description customize-control-description">{{{ data.description }}}</span> <# } #> <# if ( data.attachment && data.attachment.id ) { #> <div class="attachment-media-view"> <# if ( data.attachment.sizes ) { #> <div class="site-icon-preview wp-clearfix"> <div class="favicon-preview"> <img src="<?php echo esc_url( admin_url( 'images/' . ( is_rtl() ? 'browser-rtl.png' : 'browser.png' ) ) ); ?>" class="browser-preview" width="182" alt="" /> <div class="favicon"> <img src="{{ data.attachment.sizes.full ? data.attachment.sizes.full.url : data.attachment.url }}" alt="<?php esc_attr_e( 'Preview as a browser icon' ); ?>" /> </div> <span class="browser-title" aria-hidden="true"><# print( '<?php bloginfo( 'name' ); ?>' ) #></span> </div> <img class="app-icon-preview" src="{{ data.attachment.sizes.full ? data.attachment.sizes.full.url : data.attachment.url }}" alt="<?php esc_attr_e( 'Preview as an app icon' ); ?>" /> </div> <# } #> <div class="actions"> <# if ( data.canUpload ) { #> <button type="button" class="button remove-button"><?php echo $this->button_labels['remove']; ?></button> <button type="button" class="button upload-button"><?php echo $this->button_labels['change']; ?></button> <# } #> </div> </div> <# } else { #> <div class="attachment-media-view"> <# if ( data.canUpload ) { #> <button type="button" class="upload-button button-add-media"><?php echo $this->button_labels['site_icon']; ?></button> <# } #> <div class="actions"> <# if ( data.defaultAttachment ) { #> <button type="button" class="button default-button"><?php echo $this->button_labels['default']; ?></button> <# } #> </div> </div> <# } #> <?php } }
Expand full source codeCollapse full source codeView on TracView on GitHub
Methods
- __construct— Constructor.
- content_template— Renders a JS template for the content of the site icon control.
Changelog
Version | Description |
---|---|
4.3.0 | Introduced. |