Shortcode Modal Structure

Posted on | by admin

Modal Layout Techniques

  1. No Sidebar
  2. Left Sidebar
  3. Right Sidebar
  4. Left & Right Sidebar

It’s a default layout when create any shortcode modal.

It will be create class top_General, top_Style, top_Animation, top_Advance [ top_ * ]

// Top Tab Menu
main_tab : {
   type :  'tab_top',
   title :  '',
   descr :  '',
   def :    '',
   required :  false,
   eyetab :  '',
   width :   'top_menu',
   choises : {
   		'1' :     'General',
   		'2' :     'Style',
   		'3' :     'Animation',
   		'4' :     'Advance'
             }
}

Each shortcode modal will be use only one top tab menu, it’s optional

button_tab : {
   	type :   'tab_shortcode',
   	title :  '',
   	descr :  '',
   	def :    '',
   	required :  false,
   	eyetab :  'tab_General_sidebar',
   	width :   'sidebar_left',
   	choises : {
   	        '1' :     'RowEYE',
   		'2' :     'Setting',
   		'3' :     'Offsetting',
   		'4' :     'Ordering',
   		'5' :     'Nestable',
   		'6' :     'Breaks'
   	}
}

// Tab Left Sidebar (will be show only Style Tab when click on Style Top Menu) // Class form mate tab_Style_sidebar [ tab_ * _sidebar ] where * will be field.choises[k] // k means ‘General, Style, etc

button_tab2 : {
   	type :    'tab_shortcode',
   	title :   '',
   	descr :   '',
   	def :     '',
   	required :  false,
   	eyetab :  'tab_Style_sidebar',
        width :  'sidebar_left',
   	choises : {
   		'1' :   'Padding',
   		'2' :   'Margin',
   		'3' :   'Radius',
   		'4' :   'Border'
   	}
},

Tab Left Sidebar (will be show only General Tab when click on General Top Menu) Class from mate tab_General_sidebar [ tab_ * _sidebar ] where * will be field.choises[k] where k means ‘General, Style, etc’

// Top Tab Menu
main_tab : {
   type :  'tab_top',
   title :  '',
   descr :  '',
   def :    '',
   required :  false,
   eyetab :  '',
   width :   'top_menu',
   choises : {
   		'1' :     'General',
   		'2' :     'Style',
   		'3' :     'Animation',
   		'4' :     'Advance'
             }
}
button_tab : {
   	type :   'tab_shortcode',
   	title :  '',
   	descr :  '',
   	def :    '',
   	required :  false,
   	eyetab :  'tab_General_sidebar',
   	width :   'sidebar_left',
   	choises : {
   	        '1' :     'RowEYE',
   		'2' :     'Setting',
   		'3' :     'Offsetting',
   		'4' :     'Ordering',
   		'5' :     'Nestable',
   		'6' :     'Breaks'
   	}
},
// Tab Right Sidebar
button_tab_right : {
	type : 	        'tab_shortcode_right',
	title : 	'',
	descr : 	'',
	def : 		'',
	required : 	false,
	eyetab : 	'',
	width : 	'sidebar_right'
}, 
// Top Tab Menu
main_tab : {
   type :  'tab_top',
   title :  '',
   descr :  '',
   def :    '',
   required :  false,
   eyetab :  '',
   width :   'top_menu',
   choises : {
   		'1' :     'General',
   		'2' :     'Style',
   		'3' :     'Animation',
   		'4' :     'Advance'
             }
}
// Tab Right Sidebar
button_tab_right : {
	type : 	        'tab_shortcode_right',
	title : 	'',
	descr : 	'',
	def : 		'',
	required : 	false,
	eyetab : 	'',
	width : 	'sidebar_right'
},

Related articles