Use partials with parameter

#1

How do I use Middleman partials feature with passing parameter for showing different piece of a component?

For example: I have a button component (and I put it to /partials folder with buttons.erb name). The button has different views like big or small one.

So is there any way to include small button with such like <%= partial("partials/components/buttons#btn-small" %> or big one like that: <%= partial("partials/components/buttons#btn-big" %>?

#2

Let’s suppose your partial is something like this:

<div class = "contentHeader">
<h1><%=title%></h1>
</div>

You should use :locals to pass a variable as a parameter, like this:

<%= partial("partials/content_header", :locals => { :title => "Title here!" }) %>

In your case, you can use this to pass the tag information to the partial, as this:

<%= partial("partials/components/buttons", :locals => { :csssize => "#btn-small" }) %>
<%= partial("partials/components/buttons", :locals => { :csssize => "#btn-big" }) %>

… and adjust your partials to account for this, using <%= csssize %> into it.

This way, you can pass any number of variables to your partials and parameterize them.

1 Like