如何添加glyphicons到rails link_to助手 - 引导3

我一直在寻找一个很好的解释如何添加glyphicons到rails link_to和button_to帮手，但我发现很少。什么到目前为止，我已经收集已使我这个：如何添加glyphicons到rails link_to助手 - 引导3

<li> 
    <%= link_to deals_path, class: "btn btn-default" do %> 
    <%= content_tag(:i, "Dasboard",:class=>' glyphicon, glyphicon-th-large') -%> 
    <% end %> 
</li>

这不工作，虽然，我认为一个例子，我发现从引导2.任何人都可以点我一个很好的资源这一点，或者提供一个简单的例子？提前致谢！

来源

2013-12-20 settheline

我找到了答案，这here

在轨字形链路的基本形式如下：

<%= link_to deals_path, class: "btn btn-default" do %> 
    <i class="glyphicon glyphicon-euro"></i> Dashboard 
<% end %>

根据需要进行修改。该链接中的第二个例子并不适用于我，我假设因为我使用了rails_bootstrap_sass gem？无论如何，上面的表格对我有用。

来源

2013-12-31 23:10:59 settheline

可以使用font-awesome-rails宝石为了这个目的，然后执行：

<li><%= link_to raw(fa_icon("dashboard", class: "th-large"), deals_path, class: "btn btn-default" %>

来源

2013-12-20 01:55:31 Stoic

嗯...我有字体真棒护栏去，但不知道在哪里的逗号都应该在这里犹豫。看起来你要么在最后缺少一个，要么在'fa_icon'之后多加一个？ – settheline

进一步搜索后，我不需要使用字体引导来使用Bootstrap字形。我在上面回答。 – settheline

如果你正在寻找一个直线排列方式，这对我的作品：

<%= link_to '<i class="glyphicon glyphicon-th-large"></i> Dasboard'.html_safe, deals_path, class: 'btn btn-default' %>

的<i></i>可以去'Dashboard'两侧的我只对Rails 4测试这个特殊的例子了自举3但是这是对Rails 3之前我使用的方法和Bootstrap 2

希望这有助于有人在未来

编辑：删除逗号来正确地呈现glyphicon。

来源

2014-03-12 17:01:56 DazBaldwin

从3升级到rails 4后，此内联解决方案修复了以前以do ... end格式设置的断开链接。 – Stephen

根据我的经验，@settheline的答案几乎是理想的，但在我的网站上，它改变了相对于没有图标的其他按钮的字体。所以我最终做了这样的事情：

<%= link_to deals_path, class: "btn btn-default" do %> 
    <span class="glyphicon glyphicon-euro"></span> Dashboard 
<% end %>

而这似乎保持字体等于其他无图标的按钮。

来源

2014-05-20 22:56:11 alexvicegrab

经过一段时间之后发现了这一点 - 如果您在启动时应用glyphicon类以及按钮类的轨道问题，那么这就是您一直在寻找的答案！谢谢！ –

优雅的解决方案 – Deano

采用超薄，这里的link_to：

= link_to deals_path 
     span.glyphicon.glyphicon-th-large

和button_to：

= button_to deals_path, class: "btn btn-primary" 
     span.glyphicon.glyphicon-th-large

这有可能增加更多的文字/等。也可以将按钮放在按钮的下面。

来源

2014-07-16 19:44:33 anitdas

&对于那些避免不必要的重复冗长的事情..

我推这样的事情在我app/helpers/application_helper.rb：

module ApplicationHelper 
    def glyph(icon_name_postfix, hash={}) 
    content_tag :span, nil, hash.merge(class: "glyphicon glyphicon-#{icon_name_postfix.to_s.gsub('_','-')}") 
    end 
end

例.erb用法：

<%= button_tag glyph("heart-empty", aria_hidden: "true", foo: "bar"), type: "button", class: "btn btn-default" %> 
<%= link_to glyph(:eye_open) + " Oook", some_path, class: "nav" %>

我在Rails4利用这一点，但我认为它也可能在Rails3工作

Ooook！我还碰巧注意到从引导（目前v3.3.5）此提醒docos：

不要与其他部件图标类不能与其他组件可以直接结合混合。它们不应该与其他类一起使用。相反，添加一个嵌套的<span>和将图标类应用到<span>。

仅用于空元素图标类只应用于不包含文本内容且没有子元素的元素。

来源

2015-08-14 00:08:54 violet313

使用HAML：

= link_to deals_path, class: "btn btn-default" do 
    = "Dashboard" 
    %span.glyphicon.glyphicon-th-large

来源

2016-04-11 18:34:54

如何添加glyphicons到rails link_to助手 - 引导3

回答

相关问题