vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-08-11 20:30:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Customize: Overlay incompatible banner for block themes.

Browse Source 
Starting in 5.9, block themes are not compatible with (do not support) Customizer; rather, they use the Site Editor. Viewing installed themes in Customizer, this commit adds an overlay message to alert users and give them a way to activate the block theme. Clicking on the "Activate" button activates the block theme and redirects back to the Appearance > Themes interface, where the user can then enter the Site Editor for customization.

Non-block themes are not affected by this change and continue to work in Customizer.

Follow-up to [41648], [41893], [52279].

Props antonvlasenko, costdev, hellofromTonya, jffng, joyously, noisysocks, poena, shaunandrews.
Fixes #54549.

git-svn-id: https://develop.svn.wordpress.org/trunk@52371 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Tonya Mork
2021-12-14 15:31:14 +00:00
parent d3a851d0d1
commit 4b35425d7b
4 changed files with 118 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/wp-admin/includes/theme.php
+28 -3
View File
@@ -1005,6 +1005,21 @@ function customize_themes_print_templates() {
?>
<# } #>
</p></div>
<# } else if ( ! data.active && data.blockTheme ) { #>
<div class="notice notice-error notice-alt notice-large"><p>
<?php
_e( 'This theme doesn\'t support Customizer.' );
?>
<# if ( data.actions.activate ) { #>
<?php
printf(
/* translators: %s: URL to the themes page (also it activates the theme). */
' ' . __( 'However, you can still <a href="%s">activate this theme</a>, and use the Site Editor to customize it.' ),
'{{{ data.actions.activate }}}'
);
?>
<# } #>
</p></div>
<# } #>
<p class="theme-description">{{{ data.description }}}</p>
@@ -1025,10 +1040,20 @@ function customize_themes_print_templates() {
<# } #>
<?php } ?>
<# if ( data.compatibleWP && data.compatiblePHP ) { #>
<button type="button" class="button button-primary preview-theme" data-slug="{{ data.id }}"><?php _e( 'Live Preview' ); ?></button>
<# if ( data.blockTheme ) { #>
<?php
/* translators: %s: Theme name. */
$aria_label = sprintf( _x( 'Activate %s', 'theme' ), '{{ data.name }}' );
?>
<# if ( data.compatibleWP && data.compatiblePHP && data.actions.activate ) { #>
<a href="{{{ data.actions.activate }}}" class="button button-primary activate" aria-label="<?php echo esc_attr( $aria_label ); ?>"><?php _e( 'Activate' ); ?></a>
<# } #>
<# } else { #>
<button class="button button-primary disabled"><?php _e( 'Live Preview' ); ?></button>
<# if ( data.compatibleWP && data.compatiblePHP ) { #>
<button type="button" class="button button-primary preview-theme" data-slug="{{ data.id }}"><?php _e( 'Live Preview' ); ?></button>
<# } else { #>
<button class="button button-primary disabled"><?php _e( 'Live Preview' ); ?></button>
<# } #>
<# } #>
<# } else { #>
<# if ( data.compatibleWP && data.compatiblePHP ) { #>
src/wp-includes/class-wp-customize-manager.php
+5 -4
View File
@@ -5808,10 +5808,11 @@ final class WP_Customize_Manager {
if ( 'installed' === $theme_action ) {
// Load all installed themes from wp_prepare_themes_for_js().
$themes = array( 'themes' => wp_prepare_themes_for_js() );
foreach ( $themes['themes'] as &$theme ) {
$theme['type'] = 'installed';
$theme['active'] = ( isset( $_POST['customized_theme'] ) && $_POST['customized_theme'] === $theme['id'] );
$themes = array( 'themes' => array() );
foreach ( wp_prepare_themes_for_js() as $theme ) {
$theme['type'] = 'installed';
$theme['active'] = ( isset( $_POST['customized_theme'] ) && $_POST['customized_theme'] === $theme['id'] );
$themes['themes'][] = $theme;
}
} elseif ( 'wporg' === $theme_action ) {
src/wp-includes/customize/class-wp-customize-theme-control.php
+40 -10
View File
@@ -242,17 +242,47 @@ class WP_Customize_Theme_Control extends WP_Customize_Control {
</div>
<div class="notice notice-success notice-alt"><p><?php _ex( 'Installed', 'theme' ); ?></p></div>
<# } else if ( 'installed' === data.theme.type ) { #>
<div class="theme-id-container">
<h3 class="theme-name" id="{{ data.section }}-{{ data.theme.id }}-name">{{ data.theme.name }}</h3>
<div class="theme-actions">
<# if ( data.theme.compatibleWP && data.theme.compatiblePHP ) { #>
<button type="button" class="button button-primary preview-theme" aria-label="<?php echo esc_attr( $preview_label ); ?>" data-slug="{{ data.theme.id }}"><?php _e( 'Live Preview' ); ?></button>
<# } else { #>
<button type="button" class="button button-primary disabled" aria-label="<?php echo esc_attr( $preview_label ); ?>"><?php _e( 'Live Preview' ); ?></button>
<# } #>
<# if ( data.theme.blockTheme ) { #>
<div class="theme-id-container">
<h3 class="theme-name" id="{{ data.section }}-{{ data.theme.id }}-name">{{ data.theme.name }}</h3>
<div class="theme-actions">
<# if ( data.theme.actions.activate ) { #>
<?php
/* translators: %s: Theme name. */
$aria_label = sprintf( _x( 'Activate %s', 'theme' ), '{{ data.name }}' );
?>
<a href="{{{ data.theme.actions.activate }}}" class="button button-primary activate" aria-label="<?php echo esc_attr( $aria_label ); ?>"><?php _e( 'Activate' ); ?></a>
<# } #>
</div>
</div>
</div>
<div class="notice notice-success notice-alt"><p><?php _ex( 'Installed', 'theme' ); ?></p></div>
<div class="notice notice-error notice-alt"><p>
<?php
_e( 'This theme doesn\'t support Customizer.' );
?>
<# if ( data.theme.actions.activate ) { #>
<?php
echo ' ';
printf(
/* translators: %s: URL to the themes page (also it activates the theme). */
__( 'However, you can still <a href="%s">activate this theme</a>, and use the Site Editor to customize it.' ),
'{{{ data.theme.actions.activate }}}'
);
?>
<# } #>
</p></div>
<# } else { #>
<div class="theme-id-container">
<h3 class="theme-name" id="{{ data.section }}-{{ data.theme.id }}-name">{{ data.theme.name }}</h3>
<div class="theme-actions">
<# if ( data.theme.compatibleWP && data.theme.compatiblePHP ) { #>
<button type="button" class="button button-primary preview-theme" aria-label="<?php echo esc_attr( $preview_label ); ?>" data-slug="{{ data.theme.id }}"><?php _e( 'Live Preview' ); ?></button>
<# } else { #>
<button type="button" class="button button-primary disabled" aria-label="<?php echo esc_attr( $preview_label ); ?>"><?php _e( 'Live Preview' ); ?></button>
<# } #>
</div>
</div>
<div class="notice notice-success notice-alt"><p><?php _ex( 'Installed', 'theme' ); ?></p></div>
<# } #>
<# } else { #>
<div class="theme-id-container">
<h3 class="theme-name" id="{{ data.section }}-{{ data.theme.id }}-name">{{ data.theme.name }}</h3>
tests/phpunit/tests/ajax/CustomizeManager.php
+45
View File
@@ -714,4 +714,49 @@ class Tests_Ajax_CustomizeManager extends WP_Ajax_UnitTestCase {
$this->assertFalse( $this->_last_response_parsed['success'] );
$this->assertSame( 'no_autosave_revision_to_delete', $this->_last_response_parsed['data'] );
}
/**
* Test request for retrieving installed themes.
*
* @ticket 54549
* @covers WP_Customize_Manager::handle_load_themes_request
*/
public function test_wp_ajax_customize_load_themes_action() {
$arguments = array(
'changeset_uuid' => false,
'settings_previewed' => true,
'branching' => false,
);
new WP_Customize_Manager( $arguments );
wp_set_current_user( self::$admin_user_id );
$nonce = wp_create_nonce( 'switch_themes' );
$_POST['nonce'] = $nonce;
$_GET['nonce'] = $nonce;
$_REQUEST['nonce'] = $nonce;
$_POST['theme_action'] = 'installed';
$this->make_ajax_call( 'customize_load_themes' );
$response = $this->_last_response_parsed;
$this->assertIsArray( $response, 'Response is not an array' );
$this->assertArrayHasKey( 'success', $response, 'Response must have a "success" key' );
$this->assertTrue( $response['success'], 'Response was not "success"' );
$this->assertArrayHasKey( 'data', $response, 'Response must have a "data" key' );
$this->assertIsArray( $response['data'], 'The response "data" is not an array' );
$this->assertArrayHasKey( 'themes', $response['data'], 'The response data must have a "themes" key' );
$this->assertIsArray( $response['data']['themes'], 'Themes data is not an array' );
$this->assertNotEmpty( $response['data']['themes'], 'Themes data must not be empty' );
foreach ( $response['data']['themes'] as $theme ) {
$this->assertIsArray( $theme, 'Theme is not an array' );
$this->assertNotEmpty( $theme, 'Theme data must not be empty' );
$this->assertArrayHasKey( 'id', $theme, 'Theme data must have an "id" key' );
$this->assertNotEmpty( $theme['id'], 'Theme id cannot be empty' );
$this->assertArrayHasKey( 'name', $theme, 'Theme data must have a "name" key' );
$this->assertNotEmpty( $theme['name'], 'Theme name cannot be empty' );
$this->assertArrayHasKey( 'blockTheme', $theme, 'Themes data must include information about blocks support' );
}
}
}