css - RefineryCMS:将 Bootstrap 样式应用于导航菜单

Question

我已将 Refinery CMS 升级到最新版本 (2.1.0)，其中有一种呈现导航菜单的新方法:

(部分_header.html.erb)

<%= Refinery::Pages::MenuPresenter.new(refinery_menu_pages, self).to_html %>

相同部分的旧版本:

<%= render(:partial => "/refinery/menu", :locals => {
         :dom_id => 'menu',
         :css => 'menu'
       }) %>

如何使用 MenuPresenter 将 Bootstrap 样式添加到导航栏？

Answer 1

可以做到，但解决方案并不完美，因为 Refinery 2.1 中的 Menu Presenter 不支持开箱即用的所有正确 CSS 选项。但是只要有一点毅力，这就是大致要做的:

首先，在这里创建一个新的空白文件:config/initializers/refinery/monkey_patch_menu_presenter.rb

在此补丁文件中，粘贴此更新版本的菜单演示器(2013 年 10 月发布)的内容:menu_presenter.rb

接下来，根据section 5 of the menu presenter guide中的说明, 在你的 app/helpers/application_helper.rb文件，添加一个名为 navigation_menu 的新方法:

def navigation_menu
  presenter = Refinery::Pages::MenuPresenter.new(refinery_menu_pages, self)
  presenter.css = "navbar-inner"
  presenter.menu_tag = :div
  presenter.list_tag_css = "nav"
  presenter.selected_css = "active"
  presenter.first_css = ""
  presenter.last_css = ""
  presenter.max_depth = 0 # prevents dropdown menus, which don't render correctly
  presenter
end

最后，在你的 app/views/refinery/_header.html.erb文件(如果不存在则使用 $ bundle exec rake refinery:override view=refinery/_header)，替换为:

<%= Refinery::Pages::MenuPresenter.new(refinery_menu_pages, self).to_html %>

与:

<div class="navbar">
  <%= navigation_menu.to_html %>
</div>

确保您已加载 Bootstrap CSS/JS 文件并将整个页面包装在 <div class="container"> 中元素。然后重新启动您的应用程序以使补丁生效，希望您会看到熟悉的 Bootstrap 导航栏。

祝你好运!

马丁。