The "code" control

Learn how to create controls using Kirki

Back to Controls


The documentation site is currently being rewritten. If you can't find what you're looking for please check the github issues and ask for assistance there until the documentation rewrite is complete.

Using the code control your users can enter custom CSS, JS, HTML (and others) which you can then use however you please in your themes. Internally this control uses the CodeMirror library available in WordPress.

CodeMirror is only available in WordPress 4.9+ so if used in an older WordPress installation we gracefully fallback to a textarea field.


Kirki::add_field( 'theme_config_id', array(
	'type'        => 'code',
	'settings'    => 'code_setting',
	'label'       => esc_attr__( 'Code Control', 'textdomain' ),
	'description' => esc_attr__( 'Description', 'textdomain' ),
	'section'     => 'section_id',
	'default'     => '',
	'choices'     => array(
		'language' => 'css',
) );


<?php echo get_theme_mod( 'code_setting', '' ); ?>
Edit this page