如何将Wrap Bootstrap主题集成到Rails应用程序中?

我从wrapbootstrap购买了一个twitter bootstrap主题。 我已经有一个function轨道应用程序。 现在,我想通过将bootstrap主题集成到我的应用程序中来设计我的应用程序。 我是新手,我不知道该怎么做。 在对此进行了大量研究后,我发现只有很少有关于这个问题的讨论。 例如,我发现这篇文章: 在Rails App中实现WrapBootstrap主题

但是,我不完全确定主题中的资产将如何应用于我的应用程序。 我已经从主题的相应文件夹中复制了项目的app/assets/imagesapp/assets/javascriptsapp/assets/stylesheets文件夹下的所有资源。 然后,当我尝试在本地运行我的应用程序时,我收到了一些错误。 我删除了我的application.css文件,之后它开始工作了。 但是,我还看不到主题的任何设计。 我应该怎么做才能使这个主题成为我的rails应用程序?

首先检查这个截屏video:

http://railscasts.com/episodes/328-twitter-bootstrap-basics

然后我会添加一个类似bootstrap-sass的bootstrap gem,然后通过将它们添加到清单中来添加JS文件,如下所示:

 //= require jquery //= require jquery_ujs //= require bootstrap //= require_tree . 

然后我会得到你从wrapboostrap购买的css文件,并将它们放在你的资产/样式表文件夹中,然后将必要的标记和clases添加到你的应用程序,这是我以前做过的。

希望能帮助到你

编辑:

标记:

检查您下载的模板,让我们从导航栏开始

模板代码:

 

现在你需要把自己放在你的应用程序中,如果导航栏显示在你的应用程序的每个视图中,你应该在layouts / application.html.erb上提到它:

    Golden Green Chlorella <%= stylesheet_link_tag "application", :media => "all" %> <%= javascript_include_tag "application" %> <%= csrf_meta_tags %>   <%= render :partial => 'layouts/navbar' %> <%= yield %>   

最后,你的导航栏部分

_navbar.html.erb:

 

这只适用于导航栏,现在你需要完成剩下的工作,添加模板显示你要做的标记,使用你的所有应用程序,这不是一件容易的事,但这就是它的完成方式。

确保在安装twitter bootstrap时你应该在你的Gemfile中添加以下gem:“group:assets”

 gem 'therubyracer' gem 'less-rails' gem 'twitter-bootstrap-rails' 

然后运行bundle命令。

现在,您已经下载的主题“file_name.css”(file_name可以是任何)只需将其添加到app-> assests-> stylesheets下的“stylesheets”文件夹中

然后在您将看到的同一文件夹中打开您的application.css文件

 *= require_tree. 

用这个替换

 *= require "file_name.css" 

注意:不要忘记重新编译资产或只删除tmp / cache文件夹的内容。

保存并重启服务器。 它将应用您的新主题。