Divi Settings Fields and Advanced Fields

Settings_Fields.php

<?php 
/**
* All Fields List

* @author Mohammad Fahim
* @link https://fahim.xyz
*/

function get_fields() {
  
  $fields = array(
  
    
    // Icon settings
    $fields["font_icon"] => array(
            'label'              => esc_html__('Icon', 'text_domain' ),
            'type'               => 'select_icon',
            'option_category'    => 'basic_option',
            'class'              => array('et-pb-font-icon'),
            'toggle_slug'        => 'overlay_content',
            'depends_show_if'    => 'on',
     ),
    // Select Settings
    
    'select_id' => array(
      'label'           => esc_html__( 'Option Title', 'text_domain' ),
      'type'            => 'select',
      'option_category' => 'basic_option',
      'options'         => array(
        'option1'  => esc_html__( 'option 1', 'text_domain' ),
        'option2'  => esc_html__( 'option 2', 'text_domain' ),
        'option3'  => esc_html__( 'option 3', 'text_domain' ),
      ),
      'default_on_front' => 'option1',
      'description'      => esc_html__( 'Write description here', 'text_domain' ),
      'toggle_slug'      => 'toggle_name',
    ),
    
    // Yes and No Button
    
    'yes_no_id' => array(
      'label'          	 => esc_html__( 'Option Title', 'text_domain' ),
      'type'             => 'yes_no_button',
      'option_category'  => 'configuration',
      'options'          => array(
        'on'  => esc_html__( 'Yes', 'text_domain' ),
        'off' => esc_html__( 'No', 'text_domain' ),
      ),
      'default'          => 'off',
      'description'      => esc_html__( 'Write description here.', 'text_domain' ),
      'toggle_slug'      => 'toggle_name',
    ),

    // Upload
    
    'upload_id' => array(
      'label'              => esc_html__( 'Image', 'text_domain' ),
      'type'               => 'upload',
      'option_category'    => 'basic_option',
      'upload_button_text' => esc_attr__( 'Upload an image', 'text_domain' ),
      'choose_text'        => esc_attr__( 'Choose an Image', 'text_domain' ),
      'update_text'        => esc_attr__( 'Set As Image', 'text_domain' ),
      'description'        => esc_html__( 'Write description here.', 'text_domain' ),
      'toggle_slug'      => 'toggle_name',
    ),
    
    // Color
    
    'color_id' => array(
      'label'           => esc_html__( 'Color', 'text_domain' ),
      'type'            => 'color-alpha',
      'custom_color'    => true,
      //'tab_slug'			=> 'advanced',
      'toggle_slug'     => 'toggle_name',
    ),
    
    // Range
    
    'range_id'	=> array(
      'label'             => esc_html__( 'Range', 'text_domain' ),
      'type'             => 'range',
      'range_settings'   => array(
        'min'  => '1',
        'max'  => '100',
        'step' => '1'
      ),
      'default'           => 24,
      'validate_unit'			=> false,
      'tab_slug'          => 'advanced',
      'toggle_slug'      => 'toggle_name',
    ),
    
    // Computed
    
    '__ComputedID' => array(
      'type'                => 'computed',
      'computed_callback'   => array( 'ModuleClass', 'render_function' ),
      'computed_depends_on' => array(
        'depend1',
        'depend2',
        'depend3'
      ),
    ), 
    
    // computed id must start with ' __ ' and no ' _ ' in id name ' eg: __ComId (Yes), ComId or com_id (not applicable)
    
  );
}
 
/**
* All Advanced Fields List
*/
function get_advanced_fields_config() {
  
  $advanced_fields = array();
  
  // Font Advanced Field
  
  $advanced_fields['fonts']['font_id'] = array(
    
    'label'	=> esc_html__( 'Font', 'text_domain'),
    'css'   => array(
      'main' => "%%order_class%% .selector",
      'important' => 'all',
    ),
    'toggle_slug' => 'toggle_name'
    
  );
  
  // Box Shadow
  
  $advanced_fields['box_shadow']['box_shadow_id'] = array(
    'label'           	=> esc_html__( 'Box Shadow', 'text_domain' ),
    'option_category' 	=> 'layout',
    'css'          => array(
      'main'       => "%%order_class%% .selector",
      'overlay' => 'inset',
    ),
    'default_on_fronts'  => array(
      'color'    => '',
      'position' => '',
    ),
    'toggle_slug' => 'toggle_name'
  );
  
  return $advanced_fields;
  
}