I have some static pages in a navigation menu. I want to add a class like \"current\" to the item which is currently displaying.
The way I am doing so is to add tons
I know it is a out dated answer, but you can easily ignore all these current page check by using a link_to helper wrapper, called active_link_to gem, it works exactly what you want, add a active class to current page link
I think I came up with a simple solution that might be helpful for a lot of use cases. This lets me:
link_to
(e.g. add an icon inside the link)application_helper.rb
active
to the whole class name of the link element instead of it being the sole class.So, add this to application_helper.rb
:
def active_class?(class_name = nil, path)
class_name ||= ""
class_name += " active" if current_page?(path)
class_name.strip!
return class_name
end
And on your template you can have something like this:
<div class="col-xs-3">
<%= link_to root_path, :class => active_class?("btn btn-outline-primary", root_path) do %>
<i class="fa fa-list-alt fa-fw"></i>
<% end %>
</div>
As bonus you can specify or not a class_name
and use it like this: <div class="<%= current_page?(root_path) %>">
Thanks to previous answers 1, 2 and resources.
I think the best way is
application_helper.rb:
def is_active(controller, action)
params[:action] == action && params[:controller] == controller ? "active" : nil
end
And in menu:
<li class="<%= is_active('controller', 'action') %>">
Let me show my solution:
_header.html.erb:
<ul class="nav">
<%= nav_tabs(@tabs) %>
</ul>
application_helper.rb:
def nav_tabs(tabs=[])
html = []
tabs.each do |tab|
html << (content_tag :li, :class => ("current-page" if request.fullpath.split(/[\??]/)[0] == tab[:path]) do
link_to tab[:path] do
content_tag(:i, '', :class => tab[:icon]) +
tag(:br) +
"#{tab[:name]}"
end
end)
end
html.join.html_safe
end
application_controller.rb:
before_filter :set_navigation_tabs
private
def set_navigation_tabs
@tabs =
if current_user && manager?
[
{ :name => "Home", :icon => "icon-home", :path => home_index_path },
{ :name => "Portfolio", :icon => "icon-camera", :path => portfolio_home_index_path },
{ :name => "Contact", :icon => "icon-envelope-alt", :path => contact_home_index_path }
]
elsif current_user && client?
...
end
The current_page?
method isn't flexible enough for me (say you set a controller but not an action, then it'll only return true on the controller's index action), so I've made this based on the other answers:
def nav_link_to(link_text, link_path, checks=nil)
active = false
if not checks.nil?
active = true
checks.each do |check,v|
if not v.include? params[check]
active = false
break
end
end
end
return content_tag :li, :class => (active ? 'active' : '') do
link_to link_text, link_path
end
end
Example:
nav_link_to "Pages", pages_url, :controller => 'pages'
My easy way -
application.html.erb
,
<div class="navbar">
<div class="<%= @menu1_current %> first-item"><a href="/menu1"> MENU1 </a></div>
<div class="<%= @menu2_current %>"><a href="/menu2"> MENU2 </a></div>
<div class="<%= @menu3_current %>"><a href="/menu3"> MENU3 </a></div>
<div class="<%= @menu4_current %> last-item"><a href="/menu4"> MENU4 </a></div>
</div>
main_controller.erb
,
class MainController < ApplicationController
def menu1
@menu1_current = "current"
end
def menu2
@menu2_current = "current"
end
def menu3
@menu3_current = "current"
end
def menu4
@menu4_current = "current"
end
end
Thanks.