Главная страница » Визуальный конструктор Theme Options

Визуальный конструктор Theme Options

Плагин Option Tree

Скачать: https://ru.wordpress.org/plugins/option-tree/

Страница на Github: https://github.com/valendesigns/option-tree

К сожалению, русской локализации практически не существует, и плагин некоторое время не обновляется.
Возможно, в будущем будет заброшен при наличии более современных и выгодных альтернатив, но это не делает его менее интересным или полезным.

Плагин предоставляет визуальный конструктор для создания опций темы, со всевозможными элементами управления, которые только можно придумать.

Как это выглядит?

к содержанию ↑

Демо Option Tree Theme

Разработчики создали специальную демонстрационную тему, чтобы показать нам как интегрировать OptionTree с любой темой.

Мне не удалось её найти в репозитории тем WordPress.

Но её можно абсолютно свободно скачать на официальной странице разработки: https://github.com/valendesigns/option-tree-theme. И загрузить архивом на сайт.

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

к содержанию ↑

Установка OptionTree в режиме плагина

Установить и активировать плагин OptionTree. Воспользоваться визуальным конструктором.

Ручной способ:

  • создать папку inc в создаваемой теме;
  • скопировать в эту папку файл theme-options.php из демонстрационной темы;
  • подключить файл theme-options.php в нашу тему.

Для этого нужно вставить следующий код в functions.php:

/**
 * Loads Theme Options
 */
require( trailingslashit( get_template_directory() ) . 'inc/theme-options.php' );

к содержанию ↑

Установка OptionTree в режиме темы

Шаги идентичные способу выше, за исключением трех моментов:

  • плагин нужно скачать и распаковать в корень с темой;
  • если установлен плагин OptionTree, его нужно деактивировать;
  • нужно инициализировать OptionTree в теме (загрузить его).

Для этого в functions.php в самом начале вставляем код:

/**
 * Activates Theme Mode
 */
add_filter( 'ot_theme_mode', '__return_true' );

/**
 * Loads OptionTree
 */
require( trailingslashit( get_template_directory() ) . 'option-tree/ot-loader.php' );

Файл опций создаем атоматически через визуальный конструктор или вручную по способу описанному выше.

к содержанию ↑

Использование опций в теме

В шаблонах для вывода настроек мы используем код:

<?php echo ot_get_option( $option, $default ); ?>

На главной странице демонстрационной темы нам показывают весь список доступных типов опций. И предлагают задать им значения в админке, чтобы понаблюдать как они сохраняются.

Вот скриншот без установленных опций.

OptionTree Theme - Option Types not set

А вот как выглядит с установленными опциями.

OptionTree Theme - Options set

Разумеется, это только часть, потому что элементов там очень много.
Суть в том, что можно легко их посмотреть и использовать.

Разработчики постарались на славу и сделали такое наглядное руководство, с возможностью скопировать в свой проект. Неудивительно, что плагин заработал столько положительных отзывов и получил много скачиваний.