Как создать собственную страницу настроек для темы в админке WordPress
Опубликовано: 24.10.2017
Вероятно вам приходилось использовать премиум шаблоны , которые имеют собственную страницу настроек, на которой можно менять различные параметры сайта или указывать некоторые значения, будь-то номер телефона или ссылки в социальных сетях. Подобная страница настроек в шаблоне значительно облегчат жизнь конечному пользователю, который работает с сайтом, потому что ему не нужно лезть в код, чтобы поменять какую-то надпись или номер телефоны на сайте. И если вы занимаетесь разработкой сайтов на WordPress для клиентов или для себя, то этот пост будет вам очень полезен, и вы научитесь создавать страницу настроек в админке WordPress.
Мы полагаем, что вы уже обладаете достаточными знаниями и умеете работать с файлами WordPress шаблона. Если вы начинающий WordPress пользователь, то для начала ознакомьтесь с разделом WordPress для чайников .
Создаем собственную страницу настроек в админке WordPress
Для начала создайте в папке вашего шаблона новую папку и назовите ее functions. В этой папке будут храниться все файлы, которые будут подключаться к файлу functions.php. Затем создайте файл settings.php, наполните его следующим кодом и положите в папку functions.
<?php class ControlPanel { // Устанавливаем значения по умолчанию var $default_settings = array( 'phone' => '495 122-12-12', 'email' => '[email protected]' ); var $options; function ControlPanel() { add_action('admin_menu', array(&$this, 'add_menu')); if (!is_array(get_option('themadmin'))) add_option('themadmin', $this->default_settings); $this->options = get_option('themadmin'); } function add_menu() { add_theme_page('WP Theme Options', 'Опции темы', 8, "themadmin", array(&$this, 'optionsmenu')); } // Сохраняем значения формы с настройками function optionsmenu() { if ($_POST['ss_action'] == 'save') { $this->options["phone"] = $_POST['cp_phone']; $this->options["email"] = $_POST['cp_email']; $this->options["facebook"] = $_POST['cp_facebook']; $this->options["vkontakte"] = $_POST['cp_vkontakte']; $this->options["twitter"] = $_POST['cp_twitter']; $this->options["metrika"] = $_POST['cp_metrika']; update_option('themadmin', $this->options); echo '<div class="updated fade" id="message" style="background-color: rgb(255, 251, 204); width: 400px; margin-left: 17px; margin-top: 17px;"><p>Ваши изменения <strong>сохранены</strong>.</p></div>'; } // Создаем форму для настроек echo '<form action="" method="post" class="themeform">'; echo '<input type="hidden" id="ss_action" name="ss_action" value="save">'; print '<div class="cptab"><br /> <b>Настройки темы</b> <br /> <h3>Контакты</h3> <p><input placeholder="Телефон" style="width:300px;" name="cp_phone" id="cp_phone" value="'.$this->options["phone"].'"><label> - телефон</label></p> <p><input placeholder="Email" style="width:300px;" name="cp_email" id="cp_email" value="'.$this->options["email"].'"><label> - email</label></p> <h3>Социальные сети</h3> <p><input placeholder="Ссылка на страницу facebook" style="width:300px;" name="cp_facebook" id="cp_facebook" value="'.$this->options["facebook"].'"><label> - facebook</label></p> <p><input placeholder="Ссылка на страницу vkontakte" style="width:300px;" name="cp_vkontakte" id="cp_vkontakte" value="'.$this->options["vkontakte"].'"><label> - vkontakte</label></p> <p><input placeholder="Ссылка на страницу twitter" style="width:300px;" name="cp_twitter" id="cp_twitter" value="'.$this->options["twitter"].'"><label> - twitter</label></p> <h3>Код в footer.php</h3> <p><textarea placeholder="Здесь можно прописать коды счетчиков или дополнительных скриптов" style="width:300px;" name="cp_metrika" id="cp_metrika">'.stripslashes($this->options["metrika"]).'</textarea><label> - здесь можно прописать коды счетчиков или дополнительных скриптов</label></p> </div><br />'; echo '<input type="submit" value="Сохранить" name="cp_save" class="dochanges" />'; echo '</form>'; } } $cpanel = new ControlPanel(); $mytheme = get_option('themadmin'); ?>Этот файл вы можете отредактировать по своему желанию, добавив или удали некоторые поля из формы. Мы добавили комментарии к коду, чтобы вам было понятнее, как это все работает.