Skip to content

Instantly share code, notes, and snippets.

@ThePeterMick
Last active August 14, 2020 06:41
Show Gist options
  • Save ThePeterMick/36a4a81393ec3f12305bc24785f683f4 to your computer and use it in GitHub Desktop.
Save ThePeterMick/36a4a81393ec3f12305bc24785f683f4 to your computer and use it in GitHub Desktop.
Customise checkbox label for bootstrap 4 in Twig for Symfony 4
{% form_theme form _self %}
{% block checkbox_radio_label -%}
{# {% block _user_registration_form_termsAccepted_label %} - use this if you need it for just a single field, amend accordingly to your form type/field #}
{#- Do not display the label if widget is not defined in order to prevent double label rendering -#}
{%- if widget is defined -%}
{% set is_parent_custom = parent_label_class is defined and ('checkbox-custom' in parent_label_class or 'radio-custom' in parent_label_class) %}
{% set is_custom = label_attr.class is defined and ('checkbox-custom' in label_attr.class or 'radio-custom' in label_attr.class) %}
{%- if is_parent_custom or is_custom -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' custom-control-label')|trim}) -%}
{%- else %}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' form-check-label')|trim}) -%}
{%- endif %}
{%- if not compound -%}
{% set label_attr = label_attr|merge({'for': id}) %}
{%- endif -%}
{%- if required -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' required')|trim}) -%}
{%- endif -%}
{%- if parent_label_class is defined -%}
{%- set label_attr = label_attr|merge({class: (label_attr.class|default('') ~ ' ' ~ parent_label_class)|replace({'checkbox-inline': '', 'radio-inline': '', 'checkbox-custom': '', 'radio-custom': ''})|trim}) -%}
{%- endif -%}
{%- if label is not same as(false) and label is empty -%}
{%- if label_format is not empty -%}
{%- set label = label_format|replace({
'%name%': name,
'%id%': id,
}) -%}
{%- else -%}
{%- set label = name|humanize -%}
{%- endif -%}
{%- endif -%}
{{ widget|raw }}
<label{% for attrname, attrvalue in label_attr %} {{ attrname }}="{{ attrvalue }}"{% endfor %}>
{{- label is not same as(false) ? (translation_domain is same as(false) ? label : label|trans({}, translation_domain))|raw -}}
{{- form_errors(form) -}}
</label>
{%- endif -%}
{%- endblock checkbox_radio_label %}
...
{{ form_row(form.termsAccepted) }}
@ThePeterMick
Copy link
Author

If you need to customise the label display for a checkbox you will need to override the template for within your form theme, the below modifies it in a way so that raw checkbox label will be displayed, useful when you need to for example display a link in a label for accepting the "Terms and Conditions"
The example assumes you are placing the new blocks within the actual Twig view, to place in an external file see: https://symfony.com/doc/current/form/form_themes.html
If you need this for bootstrap 3 just do the same but make sure you pull out the relevant blocks from bootstrap_3_layout.html.twig

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment