Geek Answers Handbook

Static 404 page Rails 4: how to use the asset pipeline?

I am using Rails 4.2.3 and trying to set up a 404 error page in public/404.html . How to include images from the resource pipeline?

There's a great post on how to create dynamic custom error pages. However, as described here, this requires many changes in the settings, which I, as a beginner, are not ready to accept. All I want to do is on my 404 page include 2 images that are in the asset pipeline. Is there an easy way to do this?

+6
source share
5 answers

If you want the error page to use images from the asset pipeline, you have two options:

  • Use dynamic error pages (I wrote a tutorial here ).
  • The monkey fixes the asset pipeline to allow no fingerprints.

Since you are now excluding option # 1, I think the monkey patch is the way to go. Install a non-stupid-digest-assets gem in your application. This will lead to the correction of the asset market so that it will issue assets without a fingerprint (in addition to fingerprints).

 # Gemfile gem "non-stupid-digest-assets"

And, of course, do not forget:

 $ bundle install

Then in your 404.html just refer to the asset as if it were a static file, for example:

 <img src="/assets/my-image.png">

This assumes that the actual image is saved here in your project:

 app/assets/images/my-image.png
+5
source

Add images to the shared folder.

Use the root relative path to images on public 404/500 html pages.

 <img src="/my-logo.png"/>
+1
source

In the new application, routes that are not found are directed to the static html page found in public/404.html . As you discovered, this is a .html not .html.erb , which means you need to pretend to access the pipeline of your asset.

If you don’t want to worry about creating a dynamic page, the easiest way is to copy * two images from the pipeline of your resource into public/assets (or a subdirectory), and then enable them using

 <img src="assets/image.jpg">

* You can also use a symbolic link, but this can cause problems depending on how your production server is configured.

0
source

Keep in mind that the contents of the public folder are visible to everyone. For, following the convention, I would create an assets folder (if you do not already have it), then images and stylesheets . And create a regular html page

 - app ... - public - 404.html - images - image1.jpg - image2.jpg - stylesheets - style.css

Then in your 404.html you will refer to it like this:

<img src="./assets/images/image1.jpg" alt=""/>

0
source

in your 404.html add ... file

 <head> <link data-turbolinks-track="true" href="/assets/application.css" media="all" rel="stylesheet" /> <script data-turbolinks-track="true" src="/assets/application.js"></script> </head> <body> <img src="simple.gif"> </body>
-1
source

More articles:


All Articles