how to access images from root directory on subdomain - html

I have website.com/img and have subdomain sub.website.com and would like to access images from the img folder on my subdomain but when I try the below the image isn't showing. Any help?
<img src="../../img/1.png">
<img src="../img/1.png">
<img src="/img/1.png">

<img src="//website.com/img/1.png">
Your question is forces us to make a lot of assumptions. Are you using Apache? What does Apache's config say sub.domain.com's serving directory is?

Use full url of the image file. So that, you can display in any pages...
<img src="http://www.url/images/image.jpg" />
I think, this will help you out.

Related

Image doesn't show HTML

I am completely new to coding and I am doing the responsive web design course on free code camp. I am trying to make a french bakery website to learn web development, but when I put an image, it doesn't appear. I tried to use an URL instead but it didn't work. So I tried the solutions that I saw on this website and others but none of the solutions worked. Thank for your help.
The code
The result
Replace images/Baguettes.jpg by Baguettes.jpg because you don't have a folder named ìmages
You don't have any images folder
Do this:
<img src ="Baguettes.jpg">
Instead of:
<img src ="images\Baguettes.jpg">
As you have define wrong image path because your image is not in image folder so please replace the following
<img src ="images\Baguettes.jpg">
with
<img src ="Baguettes.jpg">
or if you want the same path
<img src ="images\Baguettes.jpg">
then please add your image in "images" folder

How do I make my Html Image Source from a file path?

I am trying to insert an image from my computer into my HTML page (hopetnorman.pythonanywhere.com) and it's not working. Here is the code:
<img src="C:\Users\Alan\Downloads\Thomas Logo\Dogo.jpg" height="50px" class="Barpic">
Anybody know why?
It sounds to me, like you're trying to put a local file into a hosted page. This would not work, because the hosted page does not know where "C:\" is.
For it to work on a hosted website, you need to upload it from your computer to the page, or at a service that hosts your pictures and use the path to that online picture to your html site.
It would need to look something like this:
<img src="http://hopetnorman.pythonanywhere.com/Thomas%20Logo/Dogo.jpg" height="50px" class="Barpic" />
Or if the picture lies in the same folder as your page.
<img src="./Dogo.jpg" height="50px" class="Barpic" />
Also for code posts, there is a button "{}" while editing.
Maybe the best way will be if you put your image into folder where you have your html file then:
<img src="Dogo.jpg" height="50px" class="Barpic">
Or make another folder in folder where your html is for all your images:
<img src="folderWhereIhaveHTML/folderForImages/Dogo.jpg" height="50px" class="Barpic">
I figured out a way -
I posted it on imgur then copied the image address from there.

Image source is wrong Spring

I am trying to show an image which is located in a folder in my Desktop. My problem is this when i set source to image thymeleaf or spring engine appends localhost:8080 to its path.
<img alt="" src="/Users/abdullahtellioglu/Desktop/ZambakResimler/yarnartjeans.jpg">
This is the image path. I also tried this one.
<img th:src="#{/Users/abdullahtellioglu/Desktop/ZambakResimler/yarnartjeans.jpg}" alt="" />
Both of them gives me the following path.
http://localhost:8080/Users/abdullahtellioglu/Desktop/ZambakResimler/yarnartjeans.jpg
I am not sure how to remove localhost:8080 from path and make the path absolute.
What are you doing is not how a server should works. When you want to make available some resource from your webapp you need to it to your web app resources. Here is a brief example of how could you fix it.
Go to the folder src/main/resources and create a folder called static.
Under that folder create another one called img and inside copy your image. So we would have something like this now:
src
main
resources
static
img
yarnartjeans.jpg.jpg
Now go to your thymeleaf HTML page and use this
<a href="product_detail.html">
<img th:src="#{/img/yarnartjeans.jpg}" alt=""/>
</a>
Now your HTML page will load your image correctly
Good luck

Image does not load on site hosted on Github

I uploaded an image, and linked it to the html file using proper extension and proper link to the image. Even then, the image doesn't show up.
Here's a link to my website- http://valaparthvi.github.io/
And a link to my github profile- https://github.com/ValaParthvi/valaparthvi.github.io
What is going wrong here? What are possible solutions?
The source for that image includes your home directory (/home/). No one else in the world knows that. You need to provide a proper URL that a web browser can reach. The URL for that image would be //raw.githubusercontent.com/ValaParthvi/valaparthvi.github.io/master/DSC_07321.resized.png.
Understand that when you upload a website to GitHub, it stores all the files there. All the paths to those files must be reachable by someone on the internet. Hopefully I cannot access your home directory.
GitHub pages also provides more convenient, branch-agnostic URLs. For your image, it would be /DSC_07321.resized.png. The advantage of this is that the source is not defined, so it will work locally and when deployed. In both other cases, when using your home directory or when using the fullGitHub URL, you're using an absolute URL, which won't work across multiple sources.
Jamie Counsell has the answer for the image:
<img src="/DSC_07321.resized.png" />
I would also remove
img {
padding-left: 1000px;
}
And instead surround the <img src="/DSC_07321.resized.png"> with a <div> tag with text-align: right, so it'll look good on different screen sizes.
Like this:
<div style="text-align: right;">
<img src="/DSC_07321.resized.png" alt="profile picture">
</div>
Hope this helps.
Your image has the wrong src. Try this instead:
<img src="//valaparthvi.github.io/DSC_07321.resized.png">

path directory not working?

I've finished up my website and I'm trying to clean up the files. I've put all my images in a folder called images and I'm trying to set up the path directory from the root folder but to no avail. As far as I can tell I'm doing nothing wrong?
<img src="images/logo.png">
The root folder contains the html file with logo inside it and another folder called images with logo.png inside it.
Would anybody know what the problem is?
All help really appreciated!
The path is right but if you are using a url rewrite like engine htaccess the paths may be problematic, then you can set an absolute path instead of a relative:
<img src="/images/logo.png">
The issue looks like relative paths, so instead of:
<img src="images/logo.png">
try
<img src="/images/logo.png">
In the suggested approach notice the leading forward slash /
You may find the following useful: http://www.coffeecup.com/help/articles/absolute-vs-relative-pathslinks/