Настройки сайта с theme customizer

Для того чтобы некоторые настройки сайта можно было менять из админки, через специальный интерфейс, а не ковырять исходный код (для заказчика), нужно использовать возможности WP Theme Customizer.
Можно настраивать, например, такие элементы:

• Логотип
• Телефон
• E-mail
• Основной фон
• Цвета ссылок
• Цвет текста
• Любые цвета сайта
• Текст copyright
• Счетчики
• Включение/Отключение каких-либо элементов
• Переключение стилей
• Переключение шрифтов

Добавляем в файл funсtions.php

// Страница настроек темы
function true_customizer_init( $wp_customize ) {

$true_transport = 'postMessage';



// Добавляем собственную секцию настроек
$wp_customize->add_section(
'true_display_options',
array(
'title' => 'Отображение',
'priority' => 400,
'description' => 'Настройте внешний вид вашего сайта'
)
);



// Цвета ссылок
$wp_customize->add_setting(
'true_link_color', // id
array(
'default' => '#000000',
'transport' => $true_transport
)
);


$wp_customize->add_control(
new WP_Customize_Color_Control(
$wp_customize,
'true_link_color',
array(
'label' => 'Цвет ссылок',
'section' => 'true_display_options',
'settings' => 'true_link_color'
)
)
);


// Отображение шапки
$wp_customize->add_setting(
'true_display_header',
array(
'default' => 'true',
'transport' => $true_transport
)
);
$wp_customize->add_control(
'true_display_header',
array(
'section' => 'true_display_options',
'label' => 'Показывать шапку сайта',
'type' => 'checkbox'
)
);


// Текст копирайта в футере
$wp_customize->add_setting(
'true_footer_copyright_text',
array(
'default' => 'Все права защищены',
'transport' => $true_transport
)
);
$wp_customize->add_control(
'true_footer_copyright_text',
array(
'section' => 'true_display_options',
'label' => 'Копирайт',
'type' => 'text'
)
);


// Фоновое изображение
$wp_customize->add_setting(
'true_background_image',
array(
'default' => '',
'transport' => $true_transport
)
);

$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'true_background_image',
array(
'label' => 'Фон сайта',
'settings' => 'true_background_image',
'section' => 'true_display_options'
)
)
);


// Логотип
$wp_customize->add_setting(
'true_logo',
array(
'default' => '',
'transport' => $true_transport
)
);
$wp_customize->add_control(
new WP_Customize_Image_Control(
$wp_customize,
'true_logo',
array(
'label' => 'Логотип',
'settings' => 'true_logo',
'section' => 'true_display_options'
)
)
);


// Телефон
$wp_customize->add_setting(
'true_phone',
array(
'default' => '8 800 2000 600',
'transport' => $true_transport
)
);
$wp_customize->add_control(
'true_phone',
array(
'section' => 'true_display_options',
'label' => 'Телефон',
'type' => 'text'
)
);


// E-mail
$wp_customize->add_setting(
'true_email',
array(
'default' => 'info@mail.ru',
'transport' => $true_transport
)
);
$wp_customize->add_control(
'true_email',
array(
'section' => 'true_display_options',
'label' => 'E-mail',
'type' => 'text'
)
);


// Счетчики
$wp_customize->add_setting(
'true_counters',
array(
'default' => 'Коды счетчиков Yandex, Google и т.д.',
'transport' => $true_transport
)
);
$wp_customize->add_control(
'true_counters',
array(
'section' => 'true_display_options',
'label' => 'Счетчики',
'type' => 'textarea'
)
);



}

add_action( 'customize_register', 'true_customizer_init' );

// CSS для хука wp_head()

function true_customizer_css() {

echo '<style>';

// Сначала стили для body
echo '.bg {';
	if ( $background_image_url = get_theme_mod( 'true_background_image' )) {
    		echo 'background-image: url( ' . $background_image_url . ' );';
	}
echo '}';


echo 'a { color: ' . get_theme_mod( 'true_link_color' ) . '; }';
if( false === get_theme_mod( 'true_display_header' ) ) {
echo '#header { display: none; }';
}

echo '</style>';
}

add_action( 'wp_head', 'true_customizer_css' );

// Функция обработки текстовых значений, перед их сохранением в базу

function true_sanitize_copyright( $value ) {
return strip_tags( stripslashes( $value ) );
}

Подключение скриптов theme-customizer.js — нужны для того, чтобы изменения в customizer отображались в режиме онлайн. Также в файл funсtions.php

// Подключение скриптов theme-customizer.js (для просмотра online)
function true_customizer_live() {
wp_enqueue_script(
'true-theme-customizer',
get_stylesheet_directory_uri() . '/js/theme-customizer.js', // URL
array( 'jquery', 'customize-preview' ),
null,
true
);
}
add_action( 'customize_preview_init', 'true_customizer_live' );

Содержание файла theme-customizer.js

jQuery(function( $ ) {

// цвет ссылок сайта
wp.customize( 'true_link_color', function( value ) {
value.bind( function( to ) {
$( 'a' ).css( 'color', to );
} );
});

// отображение/скрытие шапки сайта
wp.customize( 'true_display_header', function( value ) {
value.bind( function( to ) {
false === to ? $( '#header' ).hide() : $( '#header' ).show();
} );
});

// изменение цветовой схемы
wp.customize( 'true_color_scheme', function( value ) {
value.bind( function( to ) {
if ( 'inverse' === to ) {
$( 'body' ).css({
'background-color': '#000',
'color': '#fff'
});
} else {
$( 'body' ).css({
'background-color': '#fff',
'color': '#000'
});
}
});
});

// изменяем текст в футере
wp.customize( 'true_footer_copyright_text', function( value ) {
value.bind( function( to ) {
$( '#copyright' ).text( to ); // в элемент #copyright помещаем текст
});
});

// фон сайта
wp.customize( 'true_background_image', function( value ) {
value.bind( function( to ) {
0 === $.trim( to ).length ? $( 'body' ).css( 'background-image', '' ) : $( 'body' ).css( 'background-image', 'url( ' + to + ')' );
});
});

});