我想要一个如下按钮:
[ Sign in with FB]
其中 FB 是一个字体很棒的图标。我尝试了以下方法,但无法弄清楚如何将图标嵌入到按钮中:
= button_to "Login with", user_omniauth_authorize_path(:facebook)
以下是
font-awesome
通常如何调用(在 haml 中):
%i.icon-facebook-sign
如何达到我想要的效果?
谢谢你。
你可以像这样传递一个块到
button_to
:
= button_to user_omniauth_authorize_path(:facebook) do
Login with
%i.icon-facebook-sign
(虽然我不确定为什么你不直接使用 Facebook 图标本身作为按钮。)
为button_to helper 添加类选项
= button_to "Login with", user_omniauth_authorize_path(:facebook), :class => 'icon-facebook-sign'
尝试这个代码,它为我运行
<%= button_to line_items_path(product_id: produit.id),class:"btn btn-outline-primary" do %>
<i class="fas fa-shopping-basket"></i>
<% end %>
只需更改图标
您可以创建一个使用按钮标签但自定义输出的辅助方法:
#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 作为参数调用辅助方法:
<%= button_to_with_icon("login with <i class='fa fa-facebook-official'></i>", { action: "omniauth_authorize", controller: "users" }, class: "btn btn-info") %>
操作、控制器和类设置只是示例。但我认为您可以修改它以满足您的需要。
这是我制作的适合我的助手:
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)