Use overridden input.html & attrs.html

src/newsreader/news/core/templates/news/core/widgets/rule.html

@@ -1,7 +1,7 @@
 {% load filters %}
 
 {% with option.instance|id_for_label:"category" as id_for_label %}
-  {% include "components/form/checkbox.html" with name=option.name value=option.value|stringformat:'s' id=id_for_label id_for_label=id_for_label checked=option.selected only %}
+  {% include "components/form/checkbox.html" with widget=option checked=option.selected id_for_label=id_for_label only %}
 {% endwith %}
 
 {% if option.instance.favicon %}

src/newsreader/templates/components/form/attrs.html

@@ -0,0 +1,18 @@
+{% spaceless %}
+  {% for name, value in widget.attrs.items %}
+    {% if value is not False %}
+      {{ name }}
+
+      {% if value is not True %}
+        ="{{ value|stringformat:'s' }}"
+      {% endif %}
+    {% endif %}
+  {% endfor %}
+
+  {% if id %} id="{{ id }}"{% endif %}
+  {% if type %} type="{{ type }}"{% endif %}
+  {% if value %} value="{{ value }}"{% endif %}
+  {% if name %} name="{{ name }}"{% endif %}
+  {% if data_input %} data-input="{{ data_input }}"{% endif %}
+  {% if checked %} checked {% endif %}
+{% endspaceless %}

src/newsreader/templates/components/form/checkbox.html

@@ -1,12 +1,10 @@
 <div class="checkbox">
-  {% if field %}
+  {% if widget %}
-    {{ field }}
+    {% include "components/form/input.html" with widget=widget %}
   {% else %}
-  <input id="{{ id }}" name="{{ name }}" type="checkbox" value="{{ value }}"
+    {% include "components/form/input.html" with id=id name=name type="checkbox" value=value data_input=data_input checked=checked %}
-         {% if data_input %}data-input="{{ data_input }}"{% endif %}
-         {% if checked %}checked{% endif %} />
   {% endif %}
-  <label class="checkbox__label" for="{% if field %}{{ field.id_for_label }}{% else %}{{ id_for_label }}{% endif %}">
+  <label class="checkbox__label" for="{% if widget %}{{ widget.attrs.id }}{% else %}{{ id_for_label }}{% endif %}">
     <span class="checkbox__box"/>
   </label>
 </div>

src/newsreader/templates/components/form/input.html

@@ -0,0 +1,7 @@
+{% spaceless %}
+  <input {% if widget %}
+    type="{{ widget.type }}" name="{{ widget.name }}"
+      {% if widget.value != None %} value="{{ widget.value|stringformat:'s' }}"{% endif %}
+      {% endif %}
+      {% include "django/forms/widgets/attrs.html" %}>
+{% endspaceless %}

src/newsreader/templates/django/forms/widgets/attrs.html

@@ -0,0 +1 @@
+../../../components/form/attrs.html

src/newsreader/templates/django/forms/widgets/checkbox.html

@@ -0,0 +1 @@
+../../../components/form/checkbox.html