* Initialize the custom Theme Options.

add_action( 'init', 'custom_theme_options' );

 * Build the custom settings & update OptionTree.

function custom_theme_options() {

  /* OptionTree is not loaded yet, or this is not an admin request */

  if ( ! function_exists( 'ot_settings_id' ) || ! is_admin() )

    return false;

  $saved_settings = get_option( ot_settings_id(), array() );

   * Custom settings array that will eventually be 

   * passes to the OptionTree Settings API Class.

  $custom_settings = array( 

    'contextual_help' => array( 

          'id'        => 'option_types_help',

          'title'     => __( 'Option Types', 'theme-text-domain' ),

          'content'   => '<p>' . __( 'Help content goes here!', 'theme-text-domain' ) . '</p>'

      'sidebar'       => '<p>' . __( 'Sidebar content goes here!', 'theme-text-domain' ) . '</p>'

    ),

    'sections'        => array( 

      array(

        'id'          => 'option_types',

        'title'       => __( 'Option Types', 'theme-text-domain' )

      )

    'settings'        => array( 

        'id'          => 'demo_background',

        'label'       => __( 'Background', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Background option type is for adding background styles to your theme either dynamically via the CSS option type below or manually with %s. The Background option type has filters that allow you to remove fields or change the defaults. For example, you can filter %s to remove unwanted fields from all Background options or an individual one. You can also filter %s. These filters allow you to fine tune the select lists for your specific needs.', 'theme-text-domain' ), '<code>ot_get_option()</code>', '<code>ot_recognized_background_fields</code>', '<code>ot_recognized_background_repeat</code>, <code>ot_recognized_background_attachment</code>, <code>ot_recognized_background_position</code>, ' . __( 'and', 'theme-text-domain' ) . ' <code>ot_type_background_size_choices</code>' ),

        'std'         => '',

        'type'        => 'background',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_border',

        'label'       => __( 'Border', 'theme-text-domain' ),

        'desc'        => __( 'The Border option type is used to set width, unit, style, and color values.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'border',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

        'id'          => 'demo_box_shadow',

        'label'       => __( 'Box Shadow', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Box Shadow option type is used to set %s, %s, %s, %s, %s, and %s values.', 'theme-text-domain' ), '<code>inset</code>', '<code>offset-x</code>', '<code>offset-y</code>', '<code>blur-radius</code>', '<code>spread-radius</code>', '<code>color</code>' ),

        'type'        => 'box-shadow',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_category_checkbox',

        'label'       => __( 'Category Checkbox', 'theme-text-domain' ),

        'desc'        => __( 'The Category Checkbox option type displays a list of category IDs. It allows the user to check multiple category IDs and will return that value as an array for use in a custom function or loop.', 'theme-text-domain' ),

        'std'         => '',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_category_select',

        'label'       => __( 'Category Select', 'theme-text-domain' ),

        'desc'        => __( 'The Category Select option type displays a list of category IDs. It allows the user to select only one category ID and will return that value for use in a custom function or loop.', 'theme-text-domain' ),

        'std'         => '',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_checkbox',

        'label'       => __( 'Checkbox', 'theme-text-domain' ),

        'desc'        => __( 'The Checkbox option type displays a group of choices. It allows the user to check multiple choices and will return that value as an array for use in a custom function or loop.', 'theme-text-domain' ),

        'std'         => '',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and',

        'choices'     => array( 

          array(

            'value'       => 'no',

            'label'       => __( 'No', 'theme-text-domain' ),

            'src'         => ''

          ),

          array(

            'value'       => 'Yes',

            'label'       => __( 'Yes', 'theme-text-domain' ),

            'src'         => ''

          )

        )

        'id'          => 'demo_colorpicker',

        'label'       => __( 'Colorpicker', 'theme-text-domain' ),

        'desc'        => __( 'The Colorpicker option type saves a hexadecimal color code for use in CSS. Use it to modify the color of something in your theme.', 'theme-text-domain' ),

        'std'         => '',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_colorpicker_opacity',

        'label'       => __( 'Colorpicker Opacity', 'theme-text-domain' ),

        'desc'        => __( 'Colorpicker Opacity', 'option-tree-theme' ),

        'desc'        => sprintf( __( 'The Colorpicker Opacity option type saves an rgba color value for use in CSS. To add opacity to other colorpickers add the %s class to the %s array.', 'option-tree' ), '<code>ot-colorpicker-opacity</code>', '<code>$args</code>' ),

        'type'        => 'colorpicker-opacity',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_css',

        'label'       => __( 'CSS', 'theme-text-domain' ),

        'desc'        => '<p>' . sprintf( __( 'The CSS option type is a textarea that when used properly can add dynamic CSS to your theme from within OptionTree. Unfortunately, due server limitations you will need to create a file named %s at the root level of your theme and change permissions using %s so the server can write to the file. I have had the most success setting this single file to %s but feel free to play around with permissions until everything is working. A good starting point is %s. When the server can save to the file, CSS will automatically be updated when you save your Theme Options.', 'theme-text-domain' ), '<code>dynamic.css</code>', '<code>chmod</code>', '<code>0777</code>', '<code>0666</code>' ) . '</p><p>' . sprintf( __( 'This example assumes you have an option with the ID of %1$s. Which means this option will automatically insert the value of %1$s into the %2$s when the Theme Options are saved.', 'theme-text-domain' ), '<code>demo_background</code>', '<code>dynamic.css</code>' ) . '</p>',

        'std'         => '#custom {

  {{demo_background}}

}',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_custom_post_type_checkbox',

        'label'       => __( 'Custom Post Type Checkbox', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Custom Post Type Select option type displays a list of IDs from any available WordPress post type or custom post type. It allows the user to check multiple post IDs for use in a custom function or loop. Requires at least one valid %1$s in the %1$s field.', 'theme-text-domain' ), '<code>post_type</code>' ),

        'std'         => '',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_custom_post_type_select',

        'label'       => __( 'Custom Post Type Select', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Custom Post Type Select option type displays a list of IDs from any available WordPress post type or custom post type. It will return a single post ID for use in a custom function or loop. Requires at least one valid %1$s in the %1$s field.', 'theme-text-domain' ), '<code>post_type</code>' ),

        'std'         => '',

        'section'     => 'option_types',

        'min_max_step'=> '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_date_picker',

        'label'       => __( 'Date Picker', 'theme-text-domain' ),

        'desc'        => __( 'The Date Picker option type is tied to a standard form input field which displays a calendar pop-up that allow the user to pick any date when focus is given to the input field. The returned value is a date formatted string.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'date-picker',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_date_time_picker',

        'label'       => __( 'Date Time Picker', 'theme-text-domain' ),

        'desc'        => __( 'The Date Time Picker option type is tied to a standard form input field which displays a calendar pop-up that allow the user to pick any date and time when focus is given to the input field. The returned value is a date and time formatted string.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'date-time-picker',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_dimension',

        'label'       => __( 'Dimension', 'theme-text-domain' ),

        'desc'        => __( 'The Dimension option type is used to set width and height values.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'dimension',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_gallery',

        'label'       => __( 'Gallery', 'theme-text-domain' ),

        'desc'        => __( 'The Gallery option type saves a comma separated list of image attachment IDs. You will need to create a front-end function to display the images in your theme.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'gallery',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

        'id'          => 'demo_gallery_shortcode',

        'label'       => __( 'Gallery Shortcode', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Gallery option type can also be saved as a shortcode by adding %s to the class attribute. Using the Gallery option type in this manner will result in a better user experience as you\'re able to save the link, column, and order settings.', 'theme-text-domain' ), '<code>ot-gallery-shortcode</code>' ),

        'std'         => '',

        'type'        => 'gallery',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => 'ot-gallery-shortcode',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_google_fonts',

        'label'       => __( 'Google Fonts', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Google Fonts option type will dynamically enqueue any number of Google Web Fonts into the document %1$s. As well, once the option has been saved each font family will automatically be inserted into the %2$s array for the Typography option type. You can further modify the font stack by using the %3$s filter, which is passed the %4$s, %5$s, and %6$s parameters. The %6$s parameter is being passed from %7$s, so it will be the ID of a Typography option type. This will allow you to add additional web safe fonts to individual font families on an as-need basis.', 'theme-text-domain' ), '<code>HEAD</code>', '<code>font-family</code>', '<code>ot_google_font_stack</code>', '<code>$font_stack</code>', '<code>$family</code>', '<code>$field_id</code>', '<code>ot_recognized_font_families</code>' ),

        'std'         => array( 

            'family'    => 'opensans',

            'variants'  => array( '300', '300italic', 'regular', 'italic', '600', '600italic' ),

            'subsets'   => array( 'latin' )

          )

        ),

        'type'        => 'google-fonts',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_javascript',

        'label'       => __( 'JavaScript', 'theme-text-domain' ),

        'desc'        => '<p>' . sprintf( __( 'The JavaScript option type is a textarea that uses the %s code editor to highlight your JavaScript and display errors as you type.', 'theme-text-domain' ), '<code>ace.js</code>' ) . '</p>',

        'std'         => '',

        'type'        => 'javascript',

        'section'     => 'option_types',

        'rows'        => '20',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_link_color',

        'label'       => __( 'Link Color', 'theme-text-domain' ),

        'desc'        => __( 'The Link Color option type is used to set all link color states.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'link-color',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and'

      ),

      array(

        'id'          => 'demo_list_item',

        'label'       => __( 'List Item', 'theme-text-domain' ),

        'desc'        => __( 'The List Item option type allows for a great deal of customization. You can add settings to the List Item and those settings will be displayed to the user when they add a new List Item. Typical use is for creating sliding content or blocks of code for custom layouts.', 'theme-text-domain' ),

        'std'         => '',

        'type'        => 'list-item',

        'section'     => 'option_types',

        'rows'        => '',

        'post_type'   => '',

        'taxonomy'    => '',

        'min_max_step'=> '',

        'class'       => '',

        'condition'   => '',

        'operator'    => 'and',

        'settings'    => array( 

          array(

            'id'          => 'demo_list_item_content',

            'label'       => __( 'Content', 'theme-text-domain' ),

            'desc'        => '',

            'min_max_step'=> '',

            'class'       => '',

            'condition'   => '',

            'operator'    => 'and'

        )

        'id'          => 'demo_measurement',

        'label'       => __( 'Measurement', 'theme-text-domain' ),

        'desc'        => sprintf( __( 'The Measurement option type is a mix of input and select fields. The text input excepts a value and the select lets you choose the unit of measurement to add to that value. Currently the default units are %s, %s, %s, and %s. However, you can change them with the %s filter.', 'theme-text-domain' ), '<code>px</code>', '<code>%</code>', '<code>em</code>', '<code>pt</code>', '<code>ot_measurement_unit_types</code>' ),

        'type'        => 'measurement',

        'section'     => 'option_types',