vhad/wordpress-develop
1
0
Fork 0
mirror of https://github.com/gosticks/wordpress-develop.git synced 2026-06-28 14:20:15 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Customize: Add a user-friendly way to preview site responsiveness for desktop, tablet, and mobile.

Browse Source 
Introduces `WP_Customize_Manager::get_previewable_devices()` with a `customize_previewable_devices` filter to change the default device and which devices are available for previewing. This is a feature that was first pioneered on WordPress.com.

Props celloexpressions, folletto, valendesigns, westonruter, welcher, adamsilverstein, michaelarestad, Fab1en.
Fixes #31195.


git-svn-id: https://develop.svn.wordpress.org/trunk@36532 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Weston Ruter
2016-02-16 01:56:13 +00:00
parent 5534474cef
commit 6dd1dd61a1
8 changed files with 306 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/wp-admin/customize.php
View File

@@ -148,6 +148,26 @@ do_action( 'customize_controls_print_scripts' );
</div>
<div id="customize-footer-actions" class="wp-full-overlay-footer">
<?php $previewable_devices = $wp_customize->get_previewable_devices(); ?>
<?php if ( ! empty( $previewable_devices ) ) : ?>
<div class="devices">
<?php foreach ( (array) $previewable_devices as $device => $settings ) : ?>
<?php
if ( empty( $settings['label'] ) ) {
continue;
}
$active = ! empty( $settings['default'] );
$class = 'preview-' . $device;
if ( $active ) {
$class .= ' active';
}
?>
<button type="button" class="<?php echo esc_attr( $class ); ?>" aria-pressed="<?php echo esc_attr( $active ) ?>" data-device="<?php echo esc_attr( $device ); ?>">
<span class="screen-reader-text"><?php echo esc_html( $settings['label'] ); ?></span>
</button>
<?php endforeach; ?>
</div>
<?php endif; ?>
<button type="button" class="collapse-sidebar button-secondary" aria-expanded="true" aria-label="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
<span class="collapse-sidebar-arrow"></span>
<span class="collapse-sidebar-label"><?php _e( 'Collapse' ); ?></span>