I'm a newbie in ruby so please ignore my little mistakes ;)
Im trying to show an image in a View and everything works fine except the path of the image I gave to img's src attribute, I'm using Rails 4 and as a default web project tree in Rails my project has following directories
app
config
db
public
and some other…
my image is in "app\assets\images\file.jpg"
And i Have coded this line in my html file.
<img src="/app/assets/images/file.jpg" alt="image" />
But image doesn't load on the page!!!
When I check it in "firebug" I found the request of:
"http://localhost:3000/app/assets/images/file.jpg"
this request exactly means "public\app\assets\images\file.jpg"
and clearly is not my path! and even does not exist.
What should I code for src's value to make it!?
Try this:
<img src="<%= asset_path("file.jpg") %>" alt="image" />
Related
I set up a server, am trying to load a picture on the web page, I get the alt tag to show up but the picture will not load. I have the picture in file structure '/templates/images/pic' . I have the src tag defined as '/images/pic' but it will still not load Is this an environment problem?
I have tried moving the picture into the folder with the html files and changing the src tag but still nothing
html
<img src="/mymodules/images/computer"
alt="HTML5 Icon"
name="pic"
style="width:128px;height:128px;">
python code for homepage
#app.route('/',methods=['POST','GET'])
def home() -> 'html':
return render_template('entry.html', page_title='Logica1 Err0r')
I have got the 404 error every time
I think I see your problem.
You need the WHOLE path of the image.
if you say the name of the image is pic, then your code should be
<img src="/mymodules/images/computer/templates/images/pic.jpg" alt="HTML5 Icon" style="width:128px;height:128px;>
Hope this helps! If it is still not working, I'll reformat my answer because the way you have your image path isn't that clear to me, but I'll figure it out.
I'm sure this is super easy but I'm a beginner. I have my code to pull up my logo but my logo just pulls up a broken image icon. See screencast
See screencast: http://screencast.com/t/ar8cpTIbMs
Here is my HTML:
<div id="logo">
<img src="C:\Users\Brent\Documents\Website Development"/>
</div>
I really only need my HTML figured out and I assume the CSS will work pretty well after that. Thanks for the help!
You must enter the correct file name for src. Such as
<img src="C:\path\to\your\file.jpg" />
http://www.w3schools.com/tags/tag_img.asp
Please note that it is not a good practice to use absolute paths in your src attribute.
In the other hand, you can use base64 encoded image data as src of your img tag. Something like
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD...//Z" />
https://www.base64-image.de/tutorial
If you use this method, you dont need to keep your logo.jpg file anywhere.
Hope this will help.
You are linking to a directory in your img tag, instead of an image file. Also, I would suggest either practicing online in a free webhost or downloading a stack package like WAMP/MAMP/LAMP. You'll start running into problems where you can use http protocols pretty quickly in your studies. Though, that can get technical, so I say stick to a free webhost for now. You will get weird hang ups trying to use the file system that will ultimately confuse you while you are trying to learn.
The problem lies in your src for your <img>. You're linking it to a directory /Users/Brent/Documents/Website Development right now, when you should be linking it to the image. If your image is called logo.png, then you should link it with C:\Users\Brent\Documents\Website Development\logo.png. Also, instead of linking it to C:\Users\Brent\Documents\Website Development\logo.png, link it to the image based on where the file is. For example, if your file is in \Website Development\index.html, then all you need to put for the src is "logo.png".
You should move your logo to the same path as your website. Ex:
Website: C:/site/index.html
Logo: C:/site/logo.jpg
Then include the logo as:
<div id="logo">
<img src="logo.jpg">
</div>
Hint: You don't have to have the div for the logo to show up.
please enter the complete path including your image.
for example if your file name is mypic.jpg .Then
<img src="C:\Users\Brent\Documents\Website Development\mypic.jpg" />
I am currently doing an assignment for school and my teacher has sent all the project photos which I have saved. The only problem is they will not show up no matter what I try doing.
ex. the image is named "photo1.jpg" and I did:
<img src="photo1.jpg">
But the image will not load. if anyone has any suggestions I'd appreciate it.
If you mean on a webpage then the use this code to generate the image:
<img src="photo1.jpg"/>
Keep in mind that the photo1.jpg needs to be in the same directory as the file (webpage) calling it.
Check the location of the image. It should be in the same folder
<img src = "photo1.jpg" />
if it is not, and it has its own image folder inside your project you can do it like this
<img src = "imagesFolder/photo1.jpg" />
<img src="photo1.jpg"></img>
Don't forget that this links current page folder. If you have in eg. in images directory, then use
<img src="images/photo1.jpg"></img>
i have a porlet running in liferay portal.after successfully entering the details , i want to download the details in an html page , in which i have to include an image.
this is done by giving the absolute path as:
<img src="http://localhost:8080/Demo-portlet/images/logo-1.jpg"
and it works fine.
My portlet structure is :
Demo-portlet-->docroot-->images-->logo-1.jpg
Now i want to do this by using relative path. i tried as below but it didnt work out:
<img src="../Demo-portlet/docroot/images/logo-1.jpg" />
<img src="./docroot/images/logo-1.jpg" />
<img src="./images/logo-1.jpg" />
None of the above worked. please tell me how this can be done.
Adding the html path:
Demo-portlet-->docroot-->download.html
Try this:
<img src="images/logo-1.jpg" />
Your portlet can be embedded on random pages. It's the page's URL that you need to be relative to, not the portlet.
If you have your portlet on http://localhost:8080/web/guest/home or http://localhost:8080/web/guest/about-us/contact/addresses, the relative address would need to be different. Thus I'd recommend to be relative with regards to the server name, but not with regard to the embedding URL: At development time you have no clue what name the pages that embed your portlet will have.
Go with <img src="/Demo-portlet/images/logo-1.jpg" /> or look up the servlet context (e.g. replace "/Demo-Portlet" with a dynamic value, so that you don't have to hard-code it).
(sorry, IDE not running and I'm always mixing up if it's request.getServletContext() or something else - try for yourself and comment here, I'll edit this answer when you give the full code). The dynamic stuff - on a jsp - would be <img src="<%=request.getServletContext()%>/images/logo-1.jpg" />
I am using spring mvc 3.2.0.RELEASE.
I want to display an image in my jsp tag and for that i am using this line in my jsp code:
<img src="images/login_pic.png"/>
it is not fetching the image. Can you please suggest a solution ?
My JSP is in the location : WebContent/WEB-INF/views/index.jsp
my image is in the location: WebContent/WEB-INF/views/images/login_pic.png
Try this:
<img src="${pageContext.request.contextPath}/images/login_pic.png"/>
<mvc:resources mapping="/images/**" location="/WEB-INF/views/images/"
cache-period="10000" />
add this to your context configuration file , then you can refer your images this way:
<img src="/images/login_pic.png"/>
<img src="/images/login_pic.png"/>
this will go from the very top root (this one should do) given that your root is on the index.
<img src="../images/login_pic.png"/>
this will go one level above your current location
<img src="../../images/login_pic.png"/>
this will go two level above your current location
<img src="images/login_pic.png"/>
what you have looks at the same folder
/folder
html
login_pic.png