optiontree

step 1:
    download option tree plugin "https://wordpress.org/plugins/option-tree
========================================================================================================
step 2:
    to add "ot-loader.php" add_filter and require into "functions.php"
    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.

============================================================================================================

step 3:
    ->copy "demo-theme-options.php" from ( option-tree>assets>theme-mode )
    ->put it into "inc" folder,
    ->rename it "theme-options.php" >
    ->then call if from functions.php    include_once('inc/theme-options.php');

========================================================================================================
step 4: edit "theme-options.php" to create your theme option
========================================================================================================
step 5: after edit import the option to your desirable location

example:
here is option tree id = portfolio_text_change

<?php
        $portfolio_text_change = ot_get_option('portfolio_text_change');

 ?>

<?php echo $portfolio_text_change; ?>


======================XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX==================







===========theme-options.php===========

<?php

add_action( 'admin_init', 'custom_theme_options' );

function custom_theme_options() {
  $saved_settings = get_option( ot_settings_id(), array() );

  $custom_settings = array(

     /*all codes will be written here*/


  );


  $custom_settings = apply_filters( ot_settings_id() . '_args', $custom_settings );

  if ( $saved_settings !== $custom_settings ) {
    update_option( ot_settings_id(), $custom_settings );
  }


}


===========contextrual help===========

'contextual_help' => array(
  'content'       => array(
    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>'
),


===========section===========


'sections'        => array(
  array(
    'id'          => 'option_types',
    'title'       => __( 'Option Types', 'theme-text-domain' )
  )
),

===========settings===========

    'settings'        => array(

/*here is data*/

)


===========settings===========

    'settings'        => array(
  /*Copy start here*/
      array(
        'id'          => 'demo_background',
        'label'       => __( 'Background', 'theme-text-domain' ),
        'desc'        => sprintf( __( 'The Background option type is for ' ),
        'std'         => '',
        'type'        => 'background',
        'section'     => 'option_types',
        'rows'        => '',
        'post_type'   => '',
        'taxonomy'    => '',
        'min_max_step'=> '',
        'class'       => '',
        'condition'   => '',
        'operator'    => 'and'
      )
  /*Copy end here*/
)


==============================


<!--loop start-->
    <?php
          $socialicons = ot_get_option( 'social_icons', array() );

          if ( ! empty( $socialicons ) ) {
            foreach( $socialicons as $socialicon ) {
              echo '
                    <!--code strat-->

                          <li><a href="' . $socialicon['social_link_ad'] . '" data-placement="top" title="' . $socialicon['social_title'] . '"><i class="fa fa-' . $socialicon['social_font'] . '"></i></a></li>

                    <!--code end-->

                ';
            }
          }
    ?>
<!--loop end-->

==============================

<?php
    $portfolio_text_change = ot_get_option('portfolio_text_change');

 ?>