Checkbox: iCheck. How to add?

Question

Joomla

This is more of an answer than a question.
For Joomla 3.
Add the iCheck plugin to the template (template/your_template/index.php) at the very top of the page:

<?php defined('_JEXEC') or die;
$doc = JFactory::getDocument();
$doc->addScript('templates/' . $this->template . '/js/icheck.min.js');
$doc->addScript('templates/' . $this->template . '/js/template.js');
...тут остальные функции...
?>

in the template.js file, which lies in the folder indicated above in the code, we write:

(function($)
{
  $(document).ready(function()
  {
//тут могут быть и другие функции

    $('input[type="checkbox"]').addClass('ваш_добавочный_класс');
    $('input[type="checkbox"]').iCheck({
      checkboxClass: 'ваш_добавочный_класс'',
      radioClass: 'тут_может_может_быть_другой_класс_для_radio',
      increaseArea: '20%' // optional
      });
  })
})(jQuery);

Also don't forget to add css:

.ваш_добавочный_класс{
position:relative;
display:inline-block;
vertical-align:middle;
margin:10px;
padding:0;
width:22px;
height:22px;
background:url(.../../../images/green.png) no-repeat;
background-position:0 0;
border:none;
cursor:pointer
}
.ваш_добавочный_класс.hover{
background-position:-24px 0
}
.ваш_добавочный_класс.checked{
background-position:-48px 0
}

That's all. Everything should work like clockwork.
More details: here and here