Book Image

Symfony2 Essentials

Book Image

Symfony2 Essentials

Overview of this book

Table of Contents (17 chapters)
Symfony2 Essentials
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Theming form elements


So far our form does not look too pretty. It's just a basic form without any fancy styles. Symfony2 provides a very flexible way to customize form rendering using Twig templates called form theme.

Form theme is just a regular Twig template but filled with blocks to render form rows, labels, inputs, errors, text areas, select boxes, checkboxes, and so on.

By default, Symfony2 uses a theme called form_div_layout.html.twig. The file with this form style is located in vendor/symfony/symfony/src/Symfony/Bridge/Twig/Resources/views/Form/form_div_layout.html.twig, and it is good to review this and see how it's organized. It is, of course, possible to change this easily.

Let's create our own theme based on the default theme. Create the app/Resources/views/Form/theme.html.twig file and fill it with the following content:

{% use 'form_div_layout.html.twig' %}

{%- block form -%}
    {{- form_start(form, { attr: { class: 'ui form small', novalidate: true }}) -}}
    {{- form_widget...