Using Kirki in WordPress Theme Customizer (Part 1)

Kirki is a WordPress  plugin that let you customize the customizer panel. Kirki is not the replacement for WordPress customizer. If you use Kirki in you theme, still you can use WordPress default customizer options. WordPress customizer is the easiest way to make options for our theme. You can use WordPress customizer api, but Kirki WordPress theme customizer is easy to use and flexible.

Kirki WordPress Theme Customizer - Technig

Kirki WordPress Theme Customizer – Technig

What is Kirki WordPress Theme Customizer?

According to documentation.

Kirki is a Toolkit allowing WordPress developers to use the Customizer and take advantage of its advanced features and flexibility by abstracting the code and making it easier for everyone to create beautiful and meaningful user experiences.

So, Kirki is not only a plugin, but a Toolkit.

How to Include Kirki in Your WordPress Theme ?

You can install the Kirki as a plugin form WordPress plugin directory. If you are a developer and want to add the Kirki in your theme or plugin, you can download the Kirki plugin and put in your theme folder. For this demo we will use a demo theme generated by Underscores. After extracting the plugin file, put the kirki folder with all files anywhere in your theme directory.

Add the following code to your function.php. change the directory the way you put the kirki files.

Once you include the kirki files, you need add the configuration. Configurations allow each project to use a different setup and act as identifiers. We will create a simple config function.

Once you add the config files, you can starting adding you panel, section and settings in the customizer panel.

What are Panel, Section and Settings?

There is no better way of understanding this concepts than explaining in picture.

Kirki WordPress Theme Customizer

Kirki WordPress Theme Customizer

Conclusion

So, In the next part will continue adding this controls. I hope you have successfully added the kirki WordPress customizer without any error till now. 🙂

 

<p>Web Designer and Developer. I work with HTML5, CSS3, JavaSript, PHP, WordPress, Laravel … etc.</p>

Leave a Reply