How to include a static page with custom css and js files in a Rails application
Question
I am working on a basic Rails application (Rails version 4.1) and I would like to include a static page in it. I have got the static page with following directory structure:
| |- index.html |- css folder |-- (some css files) |- js folder |-- (some js files) |- images folder |-- (some images)
How can I include it in my application? I intend to make it my homepage btw.
I have tried using the 'layout' keyword in the controller by including the html file in the 'app/views/layout' directory. However, I have at-most been able to render the 'index.html' file but it misses any styling ie gets rendered as plain text. I have been able to obtain the same result by using the HighVoltage gem.
2 answers
solution1
5 ACCPTED 2014-09-14 09:26:05
Page
When you mention a "static" page -- all the pages are static in Rails
Rails just renders HTML, using the data from your database. Much like PHP (which many developers can appreciate), Rails is a processor which allows you to populate your view with the data you need.
This means that if you want to make a "static" page, you just need to not pull any data from the db:
#config/routes.eb
root: "application#home"
#app/controllers/application_controller.rb
class ApplicationController < ActionController::Base
def home
end
end
This will give you the ability to load the following view:
#app/views/application/home.html.erb
Put stuff here
Assets
Now, the slightly trickier part is to include the right assets for this view.
You mention you have your own directory structure. Let me tell you now that you'll be MUCH better served by creating & serving assets from your assets pipeline.
Here's how:
#app/views/layouts/application.html.erb
<head>
...
<% if controller_name == "application" && action_name == "home" %>
<%= stylesheet_link_tag "welcome" %>
<%= javascript_include_tag "welcome" %>
<% end %>
</head>
This will give you the ability to call the following:
#app/assets/stylesheets/welcome.css
...
#app/assets/javascripts/welcome.js
...
Finally, if you then add the "welcome" files to your asset precompilation list, it should work for you:
#config/application.rb
Rails.application.config.assets.precompile += ['welcome.js', 'welcome.css']
solution2
0 2014-09-14 09:19:41
Since you have custom styles and js for your home page so you'll need to do to it more any other view. Create a controller for your home page, call it may be pages_controller. Create a custom action, lets say home, make a route for this action and then place your html inside this actions view
Follow these steps to make it work:
- Create a controller:
rails g controller Pages
- Create a action inside your pages_controller.rb
def home;end
- Create a route for your action
root :to => 'pages#home'
This will by default use application.html.erb as your layout and inside your application.html.erb you have this line
<%= stylesheet_link_tag "application", media: "all" %> #this by default load all the css from assets/stylesheets/application.css so you can require your css file inside it
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.