WordPress и своя верстка

Вот не могу понять, как найти информацию по тому, как правильно натягивать свою верстку, чтобы можно было менять все в админке/настройка темы. Вот так:

Если несложно, дайте ссылки на информацию, как это реализовать без плагинов.

Ответ

То, что вы показали на картинке, называется Theme Customizer. Туда можно добавить свою секцию, а в нее - нужные опции.
Например, создадим секцию "Контакты для всего сайта" и добавим два телефона и почту. Для этого надо добавить нижеприведенный код в functions.php:
add_action( 'customize_register', function ( $customizer ) { global $global_email;
$customizer->add_section( 'section_contacts', array( 'title' => 'Контакты для всего сайта', 'description' => 'Контактная информация для страниц сайта', 'priority' => 20, ) ); $customizer->add_setting( 'section_contacts_moscow_phone', array( 'default' => '+7 (499) 322-33-22', ) ); $customizer->add_control( 'section_contacts_moscow_phone', array( 'label' => 'Московский телефон', 'section' => 'section_contacts', 'type' => 'text', ) ); $customizer->add_setting( 'section_contacts_federal_phone', array( 'default' => '8 (800) 322-33-22', ) ); $customizer->add_control( 'section_contacts_federal_phone', array( 'label' => 'Федеральный телефон', 'section' => 'section_contacts', 'type' => 'text', ) ); $customizer->add_setting( 'section_contacts_email', array( 'default' => 'info@mysite.ru', ) ); $customizer->add_control( 'section_contacts_email', array( 'label' => 'Email', 'section' => 'section_contacts', 'type' => 'text', ) ); } );
Использование:
$current_phone = get_theme_mod( 'section_contacts_moscow_phone', '' );
Результат:


Полезные ссылки на документацию по теме (из комментариев @HamSter и @SeVlad)
https://developer.wordpress.org/themes/customize-api/ https://developer.wordpress.org/themes/customize-api/tools-for-improved-user-experience/#selective-refresh-fast-accurate-updates https://make.wordpress.org/core/2016/11/10/visible-edit-shortcuts-in-the-customizer-preview/