Customize: Use selective refresh for custom header changes when possible.

* Use `postMessage` transport for header image settings by default when video headers are supported, and thus `the_custom_header_markup()` will necessarily be used (and thus a selective refresh partial will be available).
* Ensure that `the_custom_header_markup()` always outputs a container element in the customizer preview even if the header is empty.
* Ensure that edit shortcut appearing for custom header does not get positioned off-screen.

Props bradyvercher, westonruter.
See #38639.
Fixes #38737.

Built from https://develop.svn.wordpress.org/trunk@39227


git-svn-id: http://core.svn.wordpress.org/trunk@39167 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
Weston Ruter
2016-11-14 18:41:32 +00:00
parent 9ef40ced2f
commit dfbcdae985
9 changed files with 34 additions and 28 deletions

View File

@@ -16,8 +16,6 @@ function twentyseventeen_customize_register( $wp_customize ) {
$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
$wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
$wp_customize->get_setting( 'header_image' )->transport = 'postMessage';
$wp_customize->get_setting( 'header_image_data' )->transport = 'postMessage';
$wp_customize->selective_refresh->add_partial( 'blogname', array(
'selector' => '.site-title a',

View File

@@ -10,25 +10,11 @@
?>
<div class="custom-header">
<?php
// Check if Custom Header image has been added.
if ( has_custom_header() ) :
?>
<div class="custom-header-image">
<?php the_custom_header_markup(); ?>
</div>
<?php // Output the full custom header - video and/or image fallback. ?>
<div class="custom-header-image">
<?php the_custom_header_markup(); ?>
</div>
<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
<?php else : ?>
<?php // Otherwise, show a blank header. ?>
<div class="custom-header-simple">
<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
</div><!-- .custom-header-simple -->
<?php endif; ?>
<?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
</div><!-- .custom-header -->