WordPress.org

Make WordPress Core


Ignore:
Timestamp:
02/16/2016 01:56:13 AM (5 years ago)
Author:
westonruter
Message:

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

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.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-admin/customize.php

    r36422 r36532  
    149149
    150150        <div id="customize-footer-actions" class="wp-full-overlay-footer">
     151            <?php $previewable_devices = $wp_customize->get_previewable_devices(); ?>
     152            <?php if ( ! empty( $previewable_devices ) ) : ?>
     153            <div class="devices">
     154                <?php foreach ( (array) $previewable_devices as $device => $settings ) : ?>
     155                    <?php
     156                    if ( empty( $settings['label'] ) ) {
     157                        continue;
     158                    }
     159                    $active = ! empty( $settings['default'] );
     160                    $class = 'preview-' . $device;
     161                    if ( $active ) {
     162                        $class .= ' active';
     163                    }
     164                    ?>
     165                    <button type="button" class="<?php echo esc_attr( $class ); ?>" aria-pressed="<?php echo esc_attr( $active ) ?>" data-device="<?php echo esc_attr( $device ); ?>">
     166                        <span class="screen-reader-text"><?php echo esc_html( $settings['label'] ); ?></span>
     167                    </button>
     168                <?php endforeach; ?>
     169            </div>
     170            <?php endif; ?>
    151171            <button type="button" class="collapse-sidebar button-secondary" aria-expanded="true" aria-label="<?php esc_attr_e( 'Collapse Sidebar' ); ?>">
    152172                <span class="collapse-sidebar-arrow"></span>
Note: See TracChangeset for help on using the changeset viewer.