Всем привет, друзья! Сегодня Мы с Вами будем разбираться, как прописать в шапке сайта word press контактную информацию.
Итак, в моем случае, мне нужно было чтобы клиенту показывались телефоны в мобильной версии в шапке, поэтому, мне нужно было их разместить под логотипом.
Итак, для начала поблагодарю сайт https://impuls-web.ru/kak-vyvesti-kontaktnye-dannye-v-shapke-sajta/, где я и нашла эту полезную информацию
Рассмотрим самый «гибкий» способ:
Все просто, даже если «боитесь» кода. Переходим в админку — Внешний вид — Редактор Тем
Содержание
Добавляем поля для настройки темы с вводом контактных данных
Находим раздел «functions.php» и на всякий случай копируем содержимое в блокнот.
В самый низ после последней строчки вставляем следующий код:
/**
* Добавляет блок для ввода контактных данных
*/
function mytheme_customize_register( $wp_customize ) {
/*
Добавляем секцию в настройки темы
*/
$wp_customize->add_section(
// ID
'data_site_section',
// Массив аргументов
array(
'title' => 'Контактные данные в шапке сайта',
'capability' => 'edit_theme_options',
'description' => "Тут можно указать контактные данные" )
);
/*
Добавляем поле контактных данных
*/
$wp_customize->add_setting(
// ID
'theme_contacttext',
// Массив аргументов
array(
'default' => '',
'type' => 'option'
)
);
$wp_customize->add_control(
// ID
'theme_contacttext_control',
// Массив аргументов
array(
'type' => 'text',
'label' => "Текст с контактной информацией",
'section' => 'data_site_section',
'settings' => 'theme_contacttext'
)
);
/*
Добавляем поле телефона site_telephone
*/
$wp_customize->add_setting(
// ID
'site_telephone',
// Массив аргументов
array(
'default' => '',
'type' => 'option'
)
);
$wp_customize->add_control(
// ID
'site_telephone_control',
// Массив аргументов
array(
'type' => 'text',
'label' => "Текст с телефоном",
'section' => 'data_site_section',
'settings' => 'site_telephone'
)
);
}
add_action( 'customize_register', 'mytheme_customize_register' );
Определяем место, где контакты будут выводится и вставляем код для вывода
Затем находим файл «header.php» и копируем его содержимое на всякий случай так же в блокнот.
Теперь нам нужно определиться, где наши контакты должны выводится, в это место и вставляем заданный этот код:
<!--Вывод адреса--->
<?php
$contact_inf = get_option('theme_contacttext');
if($contact_inf != null){ ?>
<div class="contact_inf"><i class="fa fa-map-marker" aria-hidden="true"></i> <?php echo $contact_inf; ?></div>
<?php } ?>
<!--Вывод номера телефона--->
<?php
$tel = get_option('site_telephone');
if($tel != null){ ?>
<div class="phone-number"><i class="fa fa-phone" aria-hidden="true"></i> <?php echo get_option('site_telephone'); ?></div>
<?php } ?>
В моем случае, когда нужно было под логотипом, я добавила в секцию после него, перед закрывающим <section> и поставила <br> для перехода на другую строку:
Переходим на сам сайт и нажимаем «Настроить»
Слева в списке настроек у Вас появится строчка «Контактные данные в шапке сайта», заходим в него и добавляем телефон.
Итак, если все сделали правильно, у Вас должен появится телефон в нужном месте.
Как сделать телефон кликабельным?
И не забудьте сделать телефон в шапке кликабельным, чтобы с него моглу сразу позвонить при заходе с мобильного
Для этого нужно прописать в форме не просто телефон, а ссылку на него, в такой форме
<a href="tel:ваштелефон"><b>ваш телефон</b></a>
А на сегодня все! Читайте и подписывайтесь на мой блог, а так же дзен канал https://zen.yandex.ru/id/5d57092e46f4ff00ad002524