How to add a background image using an absolute path in markup - ruby-on-rails

So I am using pdfkit gem, to make a pdf. The following is the typical syntax to make it work
<%= image_tag("#{Rails.root}/public/images/signature-white.png", class: "signature", alt: "signature")%>
It requires us to give the absolute paths of where the images, also the images are to be in public
Now I have to add a background image dynamically in the markup
I came up with this
<div style="background-image: url('/images/background.png')">
</div>
This is fine, if it had been a web page. However this pdfkit requires the path to be absolute, and I am clueless about how to use the url helper to access the image in public/images/background.png using absolute path

You need to use the file scheme as in file:///home/gregnavis/images/background.png.

Related

Image not loading in dynamic page of Ruby on Rails app

I've done the assets pipeline for my rails project and everything is working fine, except on the dynamic posts page, like http://localhost:3000/posts/2, where images doesn't load. Everywhere else it works fine.
In console I get this error:
ActionController::RoutingError (No route matches [GET]
"/posts/assets/logo.png")
But I used src="assets/m1.jpg in image tag but in the console error the link is different!
What am I missing?
If the image tag has the following exact image path specified:
<img src="assets/m1.jpg" etc="etc">
...then the browser will treat that as a relative URL and try to look it up relative to the URL of the current page, which is http://localhost:3000/posts/2.
As a result, the browser will look for an image with this URL: http://localhost:3000/posts/assets/m1.jpg, which is exactly what's happening in your case.
Try using the image_tag helper instead:
<%= image_tag "m1.jpg" %>
Links that don't start with a / look within the same "folder" you're currently in. Thus when you're on localhost:3000/posts/2 you're in the posts 'folder' and so it looks for localhost:3000/posts/assets/m1.jpg.
If your start a link with a / it'll look from the top of the current site localhost:3000, thus /assets/m1.jpg will look for localhost:3000/assets/m1.jpg which is where you want it to be looking.
In your code you, can use the image_tag helper instead of manually writing out your image tags:
image_tag('m1.jpg') # <img alt="M1" src="/assets/m1.jpg" />
You should use the helper <%= image_tag('m1.jpg') %> and put your image in the assets/images/ directory.
The helper will generate the correct path to the image

how to insert image in rails

Using Rails, I am creating my first web-site. And I have a problem like this: I can't insert an image in my page (index.html.erb).
I put an image named "main.png" in directory "app/assets/images", and wrote that:
<img src="main.png">
But my image isn't displayed correctly. What I'm doing not right?
You should use the provided helpers by Rails to "automagically" detect paths, fingerprints, ...:
<%= image_tag "main.png" %>
Anyway, I recommend you to read the asset pipeline guides to understand how the assets works in Rails: http://guides.rubyonrails.org/asset_pipeline.html
You should use Rails helpers as markets pointed out.
By the way, the name of the image file should be the same you use as the parameter of image_tag method. You are referencing your image as main.png when the image file is main.jpg
<%= image_tag "main.jpg" %>

How should I access the asset_url helper in the view

When I try to use asset_url in my view (Rails 3.2), I get a NoMethodError.
What do have to do to be able to use AssetUrlHelper's methods in my views?
To explain this a bit better and maybe find an alternative solutions: I need to get an "asset link" to file attachments created with carrierwave.
My model has an attachment which points to a file in my assets directory. I need to draw a link to this file.
= link_to model.name, model.attachment(:size)
gives me /myfiles/model/id/attachment/size.png (which is what is persisted by carrierwave)
= image_tag model.attachment(:size)
gives me the wanted http://static_host.com/.../size.png
but I have no need for an image tag, but the plain link to the file at the asset host.
The following works ok for me:
<%= link_to "link to asset", asset_path(article.image.url) %>
I'm using paperclip but I doubt it makes much difference
I think the helper asset_path belongs to asset files (like .css and .js) , not views. In views is proper to be used helpers like image_tag or stylesheet_include_tag. This is the idea behind the asset-pipeline - to ease reference to assets.

PDFkit doesn't display pictures in PDF

Rails 2, PDFkit 0.5.0
Im generating a PDF from a View in Rails 2 with PDFkit and everything works fine. The only thing which doesn't work is displaying pictures in the pdf.
When I look at the View in the Browser, the picture is there but its missing in the PDF. There is only a placeholder existing in the PDF.
The image_tag is looking like this:
<%= image_tag('plus.gif') %>
I also tried to realize it with a css-file but it doesn't work either.
Any ideas?
Because of the way that wkhtmltopdf works you need to specify the full path to any assets (JS, CSS, images etc), including the domain name.
This won't work:
<img src="/images/foo.png" />
This will:
<img src="http://example.com/images/foo.png" />
One workaround is to set an explicit asset host, even if it's the same server as your app is running on (see the AssetTagHelper documentation for details). Another would be to specify the hostname in the image_tag.
Instead of putting the full path each time, you can add a base tag to the head section.
<base href="http://mydomain.com" target="_blank" />

Why isn't my image tag working?

What is the different with
<images src="http://localhost:3000/images/logo_general.png">
and
<%= image_tag("logo_general.png") %>
Why am I having problems loading images using the first way?
Probably because the correct tag to use is
<img>
And not
<images>
There are several differences:
The image_tag generates the HTML <img> tag, not <images>
The source path is based on your asset host and asset path, so images don't break if they change. The default is relative to root, e.g. /images/
image_tag gives you an alt attribute for proper accessibility.
In development mode, it adds a random number to the image as a convenience to prevent the browser from using a cached image in case you change it.
image_tag properly closes the tag. with />.
You can try it out in the Rails Console.
image_tag("logo_general.png")
=> <img alt="Logo_general" src="/images/logo_general.png?1230601161" />

Resources