132 lines
4.4 KiB
PHP
132 lines
4.4 KiB
PHP
<?php
|
|
/**
|
|
* Add Logo Size option in the customizer.
|
|
*/
|
|
function photos_logo_resizer_customize_register( $wp_customize ) {
|
|
// Logo Resizer additions
|
|
$wp_customize->add_setting( 'logo_size', array(
|
|
'default' => 50,
|
|
'type' => 'theme_mod',
|
|
'theme_supports' => 'custom-logo',
|
|
'transport' => 'postMessage',
|
|
'sanitize_callback' => 'absint',
|
|
'sanitize_js_callback' => 'absint',
|
|
) );
|
|
|
|
$wp_customize->add_control( 'logo_size', array(
|
|
'label' => esc_html__( 'Logo Size', 'photos' ),
|
|
'section' => 'title_tagline',
|
|
'priority' => 9,
|
|
'type' => 'range',
|
|
'settings' => 'logo_size',
|
|
'input_attrs' => array(
|
|
'step' => 5,
|
|
'min' => 0,
|
|
'max' => 100,
|
|
'aria-valuemin' => 0,
|
|
'aria-valuemax' => 100,
|
|
'aria-valuenow' => 50,
|
|
'aria-orientation' => 'horizontal',
|
|
),
|
|
) );
|
|
}
|
|
add_action( 'customize_register', 'photos_logo_resizer_customize_register' );
|
|
|
|
/**
|
|
* Add support for logo resizing by filtering `get_custom_logo`.
|
|
*/
|
|
function photos_customize_logo_resize( $html ) {
|
|
$max = [];
|
|
$img = [];
|
|
$size = get_theme_mod( 'logo_size' );
|
|
$custom_logo_id = get_theme_mod( 'custom_logo' );
|
|
// set the short side minimum
|
|
$min = 48;
|
|
|
|
// don't use empty() because we can still use a 0
|
|
if ( is_numeric( $size ) && is_numeric( $custom_logo_id ) ) {
|
|
|
|
// we're looking for $img['width'] and $img['height'] of original image
|
|
$logo = wp_get_attachment_metadata( $custom_logo_id );
|
|
if ( ! $logo ) return $html;
|
|
|
|
// get the logo support size
|
|
$sizes = get_theme_support( 'custom-logo' );
|
|
|
|
// Check for max height and width, default to image sizes if none set in theme
|
|
$max['height'] = isset( $sizes[0]['height'] ) ? $sizes[0]['height'] : $logo['height'];
|
|
$max['width'] = isset( $sizes[0]['width'] ) ? $sizes[0]['width'] : $logo['width'];
|
|
|
|
// landscape or square
|
|
if ( $logo['width'] >= $logo['height'] ) {
|
|
$output = photos_logo_resize_min_max( $logo['height'], $logo['width'], $max['height'], $max['width'], $size, $min );
|
|
$img = array(
|
|
'height' => $output['short'],
|
|
'width' => $output['long']
|
|
);
|
|
// portrait
|
|
} else if ( $logo['width'] < $logo['height'] ) {
|
|
$output = photos_logo_resize_min_max( $logo['width'], $logo['height'], $max['width'], $max['height'], $size, $min );
|
|
$img = array(
|
|
'height' => $output['long'],
|
|
'width' => $output['short']
|
|
);
|
|
}
|
|
|
|
// add the CSS
|
|
$css = '
|
|
<style>
|
|
.custom-logo {
|
|
height: ' . $img['height'] . 'px;
|
|
max-height: ' . $max['height'] . 'px;
|
|
max-width: ' . $max['width'] . 'px;
|
|
width: ' . $img['width'] . 'px;
|
|
}
|
|
</style>';
|
|
|
|
$html = $css . $html;
|
|
}
|
|
|
|
return $html;
|
|
}
|
|
add_filter( 'get_custom_logo', 'photos_customize_logo_resize' );
|
|
|
|
/* Helper function to determine the max size of the logo */
|
|
function photos_logo_resize_min_max( $short, $long, $short_max, $long_max, $percent, $min ){
|
|
$max = [];
|
|
$size = [];
|
|
$ratio = ( $long / $short );
|
|
$max['long'] = ( $long_max >= $long ) ? $long : $long_max;
|
|
$max['short'] = ( $short_max >= ( $max['long'] / $ratio ) ) ? floor( $max['long'] / $ratio ) : $short_max;
|
|
|
|
$ppp = ( $max['short'] - $min ) / 100;
|
|
|
|
$size['short'] = round( $min + ( $percent * $ppp ) );
|
|
$size['long'] = round( $size['short'] / ( $short / $long ) );
|
|
|
|
return $size;
|
|
}
|
|
|
|
/**
|
|
* Binds JS handlers to make Theme Customizer preview reload changes asynchronously.
|
|
*/
|
|
function photos_logo_resizer_customize_preview_js() {
|
|
wp_enqueue_script( 'photo-blog-logo-resizer-customizer', get_template_directory_uri() . '/js/logo/customize-preview.js', array( 'jquery', 'customize-preview' ), '20180724', true );
|
|
}
|
|
add_action( 'customize_preview_init', 'photos_logo_resizer_customize_preview_js' );
|
|
|
|
/**
|
|
* JS handlers for Customizer Controls
|
|
*/
|
|
function photos_logo_resizer_customize_controls_js() {
|
|
wp_enqueue_script( 'photo-blog-logo-resizer-customizer-controls', get_template_directory_uri() . '/js/logo/customize-controls.js', array( 'jquery', 'customize-controls' ), '20180724', true );
|
|
}
|
|
add_action( 'customize_controls_enqueue_scripts', 'photos_logo_resizer_customize_controls_js' );
|
|
|
|
/**
|
|
* Adds CSS to the Customizer controls.
|
|
*/
|
|
function photos_logo_resizer_customize_css() {
|
|
wp_add_inline_style( 'customize-controls', '#customize-control-logo_size input[type="range"] { width: 100%; }' );
|
|
}
|
|
add_action( 'customize_controls_enqueue_scripts', 'photos_logo_resizer_customize_css' );
|