diff --git src/wp-admin/css/customize-controls.css src/wp-admin/css/customize-controls.css
index df6e49feac..bd9402f44c 100644
|
|
body { |
152 | 152 | |
153 | 153 | #customize-controls .customize-info .customize-panel-description, |
154 | 154 | #customize-controls .customize-info .customize-section-description, |
155 | | #customize-controls .no-widget-areas-rendered-notice { |
| 155 | #customize-controls .non-rendered-widget-areas-notice { |
156 | 156 | color: #555d66; |
157 | 157 | display: none; |
158 | 158 | background: #fff; |
… |
… |
body { |
160 | 160 | border-top: 1px solid #ddd; |
161 | 161 | } |
162 | 162 | |
163 | | #customize-controls .customize-info .customize-panel-description.open + .no-widget-areas-rendered-notice { |
| 163 | #customize-controls .customize-info .customize-panel-description.open + .non-rendered-widget-areas-notice { |
164 | 164 | border-top: none; |
165 | 165 | } |
| 166 | .non-rendered-widget-areas-notice { |
| 167 | font-style: italic; |
| 168 | } |
| 169 | .non-rendered-widget-areas-notice p:first-child { |
| 170 | margin-top: 0; |
| 171 | } |
| 172 | .non-rendered-widget-areas-notice p:last-child { |
| 173 | margin-bottom: 0; |
| 174 | } |
166 | 175 | |
167 | 176 | #customize-controls .customize-info .customize-section-description { |
168 | 177 | margin-bottom: 15px; |
diff --git src/wp-admin/js/customize-widgets.js src/wp-admin/js/customize-widgets.js
index 25c1eb5b7a..ebdfd6b099 100644
|
|
|
1577 | 1577 | api.Panel.prototype.ready.call( panel ); |
1578 | 1578 | |
1579 | 1579 | panel.deferred.embedded.done(function() { |
1580 | | var panelMetaContainer, noRenderedAreasNotice, shouldShowNotice; |
| 1580 | var panelMetaContainer, noticeContainer, updateNotice, getActiveSectionCount, shouldShowNotice; |
1581 | 1581 | panelMetaContainer = panel.container.find( '.panel-meta' ); |
1582 | | noRenderedAreasNotice = $( '<div></div>', { |
1583 | | 'class': 'no-widget-areas-rendered-notice' |
| 1582 | |
| 1583 | // @todo This should use the Notifications API introduced to panels. See <https://core.trac.wordpress.org/ticket/38794>. |
| 1584 | noticeContainer = $( '<div></div>', { |
| 1585 | 'class': 'non-rendered-widget-areas-notice' |
1584 | 1586 | }); |
1585 | | noRenderedAreasNotice.append( $( '<em></em>', { |
1586 | | text: l10n.noAreasRendered |
1587 | | } ) ); |
1588 | | panelMetaContainer.append( noRenderedAreasNotice ); |
| 1587 | panelMetaContainer.append( noticeContainer ); |
1589 | 1588 | |
1590 | | shouldShowNotice = function() { |
1591 | | return ( 0 === _.filter( panel.sections(), function( section ) { |
| 1589 | /** |
| 1590 | * Get the number of active sections in the panel. |
| 1591 | * |
| 1592 | * @return {number} Number of active sidebar sections. |
| 1593 | */ |
| 1594 | getActiveSectionCount = function() { |
| 1595 | return _.filter( panel.sections(), function( section ) { |
1592 | 1596 | return section.active(); |
1593 | | } ).length ); |
| 1597 | } ).length; |
| 1598 | }; |
| 1599 | |
| 1600 | /** |
| 1601 | * Determine whether or not the notice should be displayed. |
| 1602 | * |
| 1603 | * @return {boolean} |
| 1604 | */ |
| 1605 | shouldShowNotice = function() { |
| 1606 | var activeSectionCount = getActiveSectionCount(); |
| 1607 | if ( 0 === activeSectionCount ) { |
| 1608 | return true; |
| 1609 | } else { |
| 1610 | return activeSectionCount !== api.Widgets.data.registeredSidebars.length; |
| 1611 | } |
| 1612 | }; |
| 1613 | |
| 1614 | /** |
| 1615 | * Update the notice. |
| 1616 | * |
| 1617 | * @returns {void} |
| 1618 | */ |
| 1619 | updateNotice = function() { |
| 1620 | var activeSectionCount = getActiveSectionCount(), nonRenderedAreaCount; |
| 1621 | noticeContainer.empty(); |
| 1622 | |
| 1623 | if ( activeSectionCount !== api.Widgets.data.registeredSidebars.length ) { |
| 1624 | |
| 1625 | if ( 0 !== activeSectionCount ) { |
| 1626 | nonRenderedAreaCount = api.Widgets.data.registeredSidebars.length - activeSectionCount; |
| 1627 | noticeContainer.append( $( '<p></p>', { |
| 1628 | text: ( 1 === nonRenderedAreaCount ? l10n.allAreasNotShown.singular : l10n.allAreasNotShown.plural ).replace( '%d', nonRenderedAreaCount ) |
| 1629 | } ) ); |
| 1630 | } |
| 1631 | |
| 1632 | noticeContainer.append( $( '<p></p>', { |
| 1633 | text: l10n.navigatePreview |
| 1634 | } ) ); |
| 1635 | } |
1594 | 1636 | }; |
| 1637 | updateNotice(); |
1595 | 1638 | |
1596 | 1639 | /* |
1597 | 1640 | * Set the initial visibility state for rendered notice. |
1598 | 1641 | * Update the visibility of the notice whenever a reflow happens. |
1599 | 1642 | */ |
1600 | | noRenderedAreasNotice.toggle( shouldShowNotice() ); |
| 1643 | noticeContainer.toggle( shouldShowNotice() ); |
1601 | 1644 | api.previewer.deferred.active.done( function () { |
1602 | | noRenderedAreasNotice.toggle( shouldShowNotice() ); |
| 1645 | noticeContainer.toggle( shouldShowNotice() ); |
1603 | 1646 | }); |
1604 | 1647 | api.bind( 'pane-contents-reflowed', function() { |
1605 | 1648 | var duration = ( 'resolved' === api.previewer.deferred.active.state() ) ? 'fast' : 0; |
| 1649 | updateNotice(); |
1606 | 1650 | if ( shouldShowNotice() ) { |
1607 | | noRenderedAreasNotice.slideDown( duration ); |
| 1651 | noticeContainer.slideDown( duration ); |
1608 | 1652 | } else { |
1609 | | noRenderedAreasNotice.slideUp( duration ); |
| 1653 | noticeContainer.slideUp( duration ); |
1610 | 1654 | } |
1611 | 1655 | }); |
1612 | 1656 | }); |
diff --git src/wp-includes/class-wp-customize-widgets.php src/wp-includes/class-wp-customize-widgets.php
index 0cd2359d56..795ab684e6 100644
|
|
final class WP_Customize_Widgets { |
732 | 732 | 'error' => __( 'An error has occurred. Please reload the page and try again.' ), |
733 | 733 | 'widgetMovedUp' => __( 'Widget moved up' ), |
734 | 734 | 'widgetMovedDown' => __( 'Widget moved down' ), |
735 | | 'noAreasRendered' => __( 'There are no widget areas on the page shown, however other pages in this theme do have them.' ), |
| 735 | 'navigatePreview' => __( 'You can navigate to other pages on your site while using the customizer to view and edit the widgets displayed on those pages.' ), |
| 736 | 'allAreasNotShown' => wp_array_slice_assoc( |
| 737 | /* translators: placeholder is the number of other widget areas registered */ |
| 738 | _n_noop( |
| 739 | 'Your theme has %d other widget area, but this particular page doesn\'t display it.', |
| 740 | 'Your theme has %d other widget areas, but this particular page doesn\'t display them.' |
| 741 | ), |
| 742 | array( 'singular', 'plural' ) |
| 743 | ), |
736 | 744 | 'reorderModeOn' => __( 'Reorder mode enabled' ), |
737 | 745 | 'reorderModeOff' => __( 'Reorder mode closed' ), |
738 | 746 | 'reorderLabelOn' => esc_attr__( 'Reorder widgets' ), |
| 747 | /* translators: placeholder is the count for the number of widgets found */ |
739 | 748 | 'widgetsFound' => __( 'Number of widgets found: %d' ), |
740 | 749 | 'noWidgetsFound' => __( 'No widgets found.' ), |
741 | 750 | ), |