Integrating AdminLTE into Ruby on Rails

2019-02-05 13:52发布

站内问答 / 后端开发
1422 2 3

I'm new to Ruby on Rails and wanted to install a free template called AdminLTE. It allows you to easily create App (front-end).

I wanted to integrate it into Rails but I didn't know how and I couldn't find a solution anywhere.

If anyone can help me that would be awesome.

this is the template's website: https://almsaeedstudio.com/AdminLTE

2条回答
孤傲高冷的网名
2楼-- · 2019-02-05 14:18

Don't need to copy 'skin-blue.css' into 

vendor/assets/stylesheets/

Paste the following to app/assets/stylesheets/application.css

//= require adminlte/skins/skin-blue
查看更多
0人赞 添加讨论(0) 举报
爱情/是我丢掉的垃圾
3楼-- · 2019-02-05 14:34

Got this implemented just last night. Here's how I did it.

Paste this into your Gemfile :

gem 'bootstrap-sass'
gem 'jquery-rails'
gem 'font-awesome-sass'

source 'https://rails-assets.org/' do 
  gem 'rails-assets-adminlte'
end

Paste the following to app/assets/javascripts/application.js

//= require adminlte

Paste the following to app/assets/stylesheets/application.css

*= require adminlte
*= require skin-blue

Create a new file app/assets/stylesheets/custom.css.scss and paste in the following: 

@import "bootstrap-sprockets";
@import "bootstrap";
@import "font-awesome-sprockets";
@import "font-awesome";

From the source code of AdminLTE that is downloaded separately which you may get from the link you mentioned in your question, browse to 

dist/css/skin

and copy the file skin-blue.css and paste it into vendor/assets/stylesheets/ in your rails project

Then open the starter.html in the source code of AdminLTE and paste the content within the <body> ......... </body> and paste it within the <body> ................ </body> in app/views/layouts/application.html.erb . Modify the body tag to to <body class="skin-blue sidebar-mini">

Install the included gems by running bundle install and then restart rails server by running rails s and you should see the the beautiful template that is AdminLTE

NOTE 1: Maybe there exist other, more efficient ways of doing it. I am not aware though and if anyone knows, I'd be more than glad to learn how it's done. Until then, this works perfectly for me and I hope it saves you some precious time.

NOTE 2: You may of course change the skin to your liking accordingly by changing the stylesheet file you include in the vendor/assets/stylesheets and making the necessary modifications to your app/assets/stylesheets/application.css file. Don't forget to change the class of the <body > .......</body> in your app/views/layouts/application.html.erb file

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(3)