Baike.dev
All toolsOnline toolsAI codingTrendingOpen sourceNewsSubmit
Log in
< Back to tools
O

option-tree

> 编程语言
Open source

Theme Options UI Builder for WordPress. A simple way to create & save Theme Options and Meta Boxes for free or premium themes.

628 stars0 likes1 views
WebsiteGitHub

About

Theme Options UI Builder for WordPress. A simple way to create & save Theme Options and Meta Boxes for free or premium themes.

OptionTree

Theme Options UI Builder for WordPress. A simple way to create & save Theme Options and Meta Boxes for free or premium themes.

Contributors: valendesigns
Tags: options, theme options, meta boxes, settings
Requires at least: 3.8
Tested up to: 5.2
Stable tag: 2.7.3
License: GPLv2 or later
Donate link: https://bit.ly/2TBvksV
Requires PHP: 5.3.0

Description

OptionTree attempts to bridge the gap between WordPress developers, designers and end-users by creating fully responsive option panels and meta boxes with an ease unlike any other plugin. OptionTree has many advanced features with well placed hooks and filters to adjust every aspect of the user experience.

Build your Theme Options panel locally with an easy to use drag & drop interface and then export a functioning theme-options.php file for production use that is i18n translation ready, with your custom text domain automatically inserted.

And, in just a few simple lines of code, save settings to the database with a unique array ID so none of your Theme Options conflict with other themes that use OptionTree.

Also, OptionTree now takes full advantage of the new color schemes introduced in WordPress 3.8, it looks and feels built-in.

Theme Integration

If you're like me, you want to know how everything works. Download and activate the OptionTree Theme and see first hand how to integrate OptionTree into your own project. I'll walk you through installing OptionTree and you'll get a chance to see all the various options and filters first hand and in the wild.

Contributing

To contribute or report bugs, please go to the OptionTree Github repository.

Sponsorship

OptionTree is a project partly sponsored by ThemeForest, the largest WordPress theme marketplace on the web.

Option Types

This is a complete list of all the available option types that come shipped with OptionTree.

  • Background
  • Border
  • Box Shadow
  • Category Checkbox
  • Category Select
  • Checkbox
  • Colorpicker
  • Colorpicker Opacity
  • CSS
  • Custom Post Type Checkbox
  • Custom Post Type Select
  • Date Picker
  • Date Time Picker
  • Dimension
  • Gallery
  • Google Fonts
  • JavaScript
  • Link Color
  • List Item
  • Measurement
  • Numeric Slider
  • On/Off
  • Page Checkbox
  • Page Select
  • Post Checkbox
  • Post Select
  • Radio
  • Radio Image
  • Select
  • Sidebar Select
  • Slider
  • Social Links
  • Spacing
  • Tab
  • Tag Checkbox
  • Tag Select
  • Taxonomy Checkbox
  • Taxonomy Select
  • Text
  • Textarea
  • Textarea Simple
  • Textblock
  • Textblock Titled
  • Typography
  • Upload

Installation

Plugin Mode

  1. Upload option-tree to the /wp-content/plugins/ directory
  2. Activate the plugin through the Plugins menu in WordPress
  3. Click the OptionTree->Documentation link in the WordPress admin sidebar menu for further setup assistance.

Theme Mode

  1. Download the latest version of OptionTree and unarchive the .zip directory.
  2. Put the option-tree directory in the root of your theme. For example, the server path would be /wp-content/themes/theme-name/option-tree/.
  3. You must deactivate and/or delete the plugin version of OptionTree.
  4. Add the following code to the beginning of your functions.php.
/**
 * Required: set 'ot_theme_mode' filter to true.
 */
add_filter( 'ot_theme_mode', '__return_true' );

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

For a list of all the OptionTree UI display filters refer to the demo-functions.php file found in the /assets/theme-mode/ directory of this plugin. This file is the starting point for developing themes with Theme Mode.

Frequently Asked Questions

Is there a demo theme I can install?

There sure is, and I'm glad you asked. Download and activate the OptionTree Theme and get some experience setting up OptionTree on your own with detailed directions and tips.

I get errors or a blank screen when I activate the plugin. What's the deal?

The most likely scenario is your theme already has OptionTree installed in Theme Mode. And since the plugin and theme version can't both be active at the same time without the sky falling on your head, your site has decided to throw in the towel. If that's not your issue, open up a support request and we'll figure it out together. UPDATE: As of OptionTree 2.4.0 the plugin version will not conflict with the Theme Mode version if they are both 2.4.0 or higher.

Screenshots

Changelog

2.7.3

  • Hotfix - Update regex for Object Injection check to include + bypass and PHP serialized classes. props @erwanlr

2.7.2

  • Hotfix - Extend the unfiltered_html iframe capabilities to support additional style attributes.

2.7.1

  • Hotfix - Fix error cannot redeclare _sanitize_recursive(). props @shramee
  • Hotfix - Ensure iframe supports the style attribute for users with unfiltered_html capabilities.
  • Hotfix - Ensure noscript is supported for users with unfiltered_html capabilities.

2.7.0

  • Require PHP 5.3+
  • Fix all PHPCS errors and warnings.
  • Fix a vulnerability where Object Injection could take place if someone has a valid nonce.
  • Force all settings to be sanitized and escaped before saving and during display.
  • Add filter ot_validate_setting_input_safe which is used to validate the input value of a custom setting type. All values must be validated!
  • Add a notice to let users know that a custom setting type is not properly validating saved data and do a best-effort sanitize of the user data before saving it.
  • Fix issue with Composer autoload and only load OptionTree if we have access to WordPress. props @infomaniac50
  • Fix deprecated create_function notice in PHP 7.2+. props @modesthatred
  • Fix notice "Only variables should be passed by reference". props @SergeAx
  • Add wordpress-plugin project type to composer file. props @egifford
  • Removed translation files.
  • Removed the deprecated XML file import method.
  • Fix SQL syntax issue. props @ryanlabelle
  • Fix metabox radio & checkbox style issues. props @ryanlabelle

2.6.0

  • Fix a reflected XSS vulnerability with the add_list_item & add_social_links Ajax requests.
  • Fix the Google Fonts URL so it passed the W3 Validator. props @BassemN
  • Fix global_admin_css so it's only enqueued when needed.
  • Fix dynamic.css so that a child theme doesn't load the styles saved to the parent theme.
  • Add filter ot_recognized_post_format_meta_boxes to support additional post formats meta boxes. props @BassemN
  • Add action ot_do_settings_fields_before & ot_do_settings_fields_after. props @BassemN, @valendesigns
  • Add Text Domain to plugin file to fully support the new translate.wordpress.org Language Packs.
  • Fix notice in PHP 7.0.0 props @Zackio

2.5.5

  • Hotfix - Allow a 0 value to be saved with certain option types. Contributors via github @BassemN.
  • Hotfix - Stop media from being attached to the OptionTree post type when uploaded from the media manager or customizer. Contributors via github @earnjam, and @valendesigns.
  • Hotfix - Added filter ot_load_dynamic_css to explicitly turn the feature off if desired.
  • Hotfix - Stopped dynamic.css created with other themes from being loaded elsewhere.

2.5.4

  • Hotfix - Support for WordPress 4.2 term splitting.
  • Hotfix - Removed any potential XSS security issues with add_query_arg by escaping it.
  • Hotfix - Fixed an issue where Visual Composer was indirectly destroying OptionTree meta box values.
  • Hotfix - Fixed an issue where the select field value was not visible. Contributors via github @sabbirk15.

2.5.3

  • Hotfix - Added inherit fallback to the border option type in dynamic.css.
  • Hotfix - Added none fallback to the box-shadow option type in dynamic.css.
  • Hotfix - Added inherit fallback to the colorpicker option type in dynamic.css.
  • Hotfix - Added inherit fallback to the colorpicker-opacity option type in dynamic.css.
  • Hotfix - Added filter ot_insert_css_with_markers_fallback to filter the dynamic.css fallback value.
  • Hotfix - Added filter ot_type_radio_image_attributes to filter the image attributes for each radio choice. Contributors via github @BassemN, and @valendesigns.
  • Hotfix - Refactored ot_insert_css_with_markers to remove confusing & unnecessary PHP statements and fix whitespace.
  • Hotfix - Fixed an issue in ot_insert_css_with_markers where the $option_type variable was not being set properly.
  • Hotfix - Fixed an issue where having multiple Google Fonts option types caused the "Add Google Font" button to insert multiple dropdowns.

2.5.2

  • Hotfix - Added inherit fallback to the link-color option type in dynamic.css.
  • Hotfix - Remove $.browser.msie JS error caused by function being deprecated.
  • Hotfix - Change hover to mouseenter mouseleave to stop jQuery migrate error message.
  • Hotfix - Don't allow duplicate Google Fonts in the ot-google-fonts-css enqueue.
  • Hotfix - Fixed an issue with the CSS and JavaScript option types not being initiating inside of tabs.
  • Hotfix - Fixed metabox tab styles for mobile.
  • Hotfix - Separate the post formats JS so it does not interfere with the default behavior and loads only as needed.
  • Hotfix - Adding the not-sortable class to the List Item option type will remove the sortable feature for that option.

2.5.1

  • Hotfix - Overhaul the Colorpicker Opacity option type so it saves rgba values, not arrays.
  • Hotfix - Added the ability to set opacity on any colorpicker with the ot-colorpicker-opacity class.
  • Hotfix - Don't use esc_url_raw to filter the Upload option type when it's saving an attachment ID. Contributors via github @RistoNiinemets.
  • Hotfix - Show an error message to user if unable to write to the dynamic.css file. Contributors via github @johnh10, and @valendesigns.
  • Hotfix - Force the ot_google_fonts array to be rebuilt when switching between themes.
  • Hotfix - Stop theme check from nagging about using add_menu_page in ot-cleanup-api.php.

2.5.0

  • Added the Google Fonts option type. Contributors via github @maimairel, and @valendesigns.
  • Added the Border option type. Contributors via github @doitmax, and @valendesigns.
  • Added the Box Shadow option type. Contributors via github @doitmax, and @valendesigns.
  • Added the Colorpicker Opacity option type. Contributors via github @doitmax, and @valendesigns.
  • Added the Dimension option type. Contributors via github @doitmax, and @valendesigns.
  • Added the JavaScript option type.
  • Added the Link Color option type. Contributors via github @doitmax, and @valendesigns.
  • Added the Spacing option type. Contributors via github @doitmax, and @valendesigns.
  • Fixed an issue where the Colorpicker was not parsing conditions on change or clear.
  • Fixed the Colorpicker styles on mobile devices.
  • Show the Colorpicker setting ID inside the error message string when the value is invalid.
  • Added an 'on change' trigger to the Numeric Slider's hidden input. Contributors via github @cubell.
  • Stop Theme Check from complaining about the register_post_type() function being used in Theme Mode.
  • Added styles that clean up the appearance of the included Font Awesome icons in section tabs.
  • Fixed jQuery UI style conflicts created by the WP Review plugin.
  • Changed the sanitization function from sanitize_text_field to esc_url_raw for the Upload option type.
  • Added filter `ot_dequeue_

Issues· 0 open

View all issuesOpen on GitHub

No open issues yet, or sync has not completed.

> Tags

PHP

No comments yet. Be the first to share.

> Details

PublishedAug 1, 2026
UpdatedSep 17, 2026
Category编程语言
PricingOpen source

> Related tools

T
TypeScript
JavaScript 的超集,为前端与全栈提供静态类型
P
Python
通用编程语言,广泛用于 Web、数据与 AI
G
Go
Google 推出的简洁高效系统语言