在Rails button_to中嵌入font-awesome图标

时间:2013-03-12 04:18:15

标签: ruby-on-rails font-awesome

我想要一个按钮如下:

[ Sign in with FB]

其中FB是一个字体很棒的图标。我尝试了以下内容,但无法弄清楚如何将图标嵌入按钮:

= button_to "Login with", user_omniauth_authorize_path(:facebook)

以下是通常调用font-awesome的方式(以haml为单位):

%i.icon-facebook-sign

我如何达到我想要的效果?

谢谢。

5 个答案:

答案 0 :(得分:5)

你可以pass a blockbutton_to这样:

= button_to user_omniauth_authorize_path(:facebook) do
    Login with
    %i.icon-facebook-sign

(虽然我不确定为什么你不会只使用Facebook图标本身作为按钮。)

答案 1 :(得分:4)

为button_to helper添加类选项

= button_to "Login with", user_omniauth_authorize_path(:facebook), :class => 'icon-facebook-sign'

答案 2 :(得分:0)

您可以创建一个使用按钮标记但是自定义输出的辅助方法:

#application_helper.rb

def button_to_with_icon(text, path, classes)
  form_tag path, :method => :post do
    button_tag(classes) do
      raw text
    end
  end
end

然后使用嵌入的原始html作为参数调用helper方法:

<%= button_to_with_icon("login with <i class='fa fa-facebook-official'></i>", { action: "omniauth_authorize", controller: "users" }, class: "btn btn-info") %>

动作,控制器和类设置只是示例。但我认为你可以修改它以满足你的需求。

答案 3 :(得分:0)

这是我制作的帮手适合我:

def html_button_to(html = nil, options = nil, html_options = nil)
  button_to(options, html_options) do
    html
  end
end

结合font-awesome-rails gem,它可以让您:

html_button_to fa_icon(:facebook, text: "Login with"), user_omniauth_authorize_path(:facebook)

答案 4 :(得分:0)

尝试此代码,它将为我运行

<%= button_to line_items_path(product_id: produit.id),class:"btn btn-outline-primary" do %> <i class="fas fa-shopping-basket"></i> <% end %>

只需更改图标