New Syntax for HTML Tag helpers in Rails 5.1

Rails is great at generating HTML using helpers such as content_tag and tag.

1content_tag(:div, , class: "home")
2
3<div class="home">
4</div>
Copy

Rails 5.1 has introduced new syntax for this in the form of enhanced tag helper.

Now that same HTML div tag can be generated as follows.

1tag.div class: 'home'
2
3<div class="home">
4</div>
Copy

Earlier, the tag type was decided by the positional argument to the content_tag and tag methods but now we can just call the required tag type on the tag method itself.

We can pass the tag body and attributes in the block format as well.

1<%= tag.div class: 'home' do %>
2  Welcome to Home!
3<% end %>
4
5
6<div class="home">
7  Welcome to Home!
8</div>
Copy

HTML5 compliant by default

The new tag helper is also HTML 5 compliant by default, such that it respects HTML5 features such as void elements.

Backward compatibility

The old syntax of content_tag and tag methods is still supported but might be deprecated and removed in future versions of Rails.