adding a link to a picture html - html

I've added a page link to a picture for my website, but it does not load the website because the link goes the directory therefore the webpages do not appear. My code is below:
<a href="www.w3schools.com">
<img src="Images/insta.png" alt="" style="width:7%; height:7%;">
</a>
When I click on the image it says file not found.

If you're linking to a page on an external site, you will need to provide the entire URL of the page in question, which includes the protocol. In this instance, that would be http://www.w3schools.com/.
By linking to www.w3schools.com, you are telling the browser to load that URL relative to the page you're linking from so, if this link were on a page located at http://domain.tld/page.html, clicking on it would attempt to load http://domain.tld/www.w3schools.com.

Add http:// OR https:// for your website link:
<a href="http://www.w3schools.com/">
<img src="Images/insta.png" alt="" style="width:7%; height:7%;">
</a>

<a href="http://www.w3schools.com" target="_blank">
<img src="Images/insta.png" alt="" style="width:7%; height:7%;">
</a>
Without the http:// your link will be something like: youraddress/www.w3schools.com
And pay attention if you image is in the correct folder called Images

Related

Not Downloading Files in HTML

I am trying to create a download link to a file I've created but it is not working. I've tried it without the <img> and without the download specification but nothing seems to work!
<a href="Downloadable File.txt" download="file">
<img src="downloadbutton.png">
</a>
All it does is redirect me to a page without the file downloading like it's supposed to, how do I fix this?
Try this and make sure that your file exists on the server or at least at the right path.
<a href="path/to/your/download/file" download="filename">
<img src="downloadbutton.png">
</a>
It is not download="file".
It should be download only.
And please check your href. It should be some path to your file.
<a href="path/to/your/file.txt" download>
<img src="downloadbutton.png">
</a>

Link my Logo to homepage

I am trying to make my logo clickable to go back to the homepage but can't seem to get it to work.
Any help appreciated...
<!-- logo begin -->
<div id="logo">
<a href="index.html">
<img class="logo logo_dark_bg" src="images/logo.png" alt="/">
<img class="logo logo_light_bg" src="images/logo_light.png" alt="/">
</a>
</div>
<!-- logo close -->
Your anchor currently work only from the root so you should update your reference to be from the root as well, so href="/index.html" note the starting "/". The Same applies to your src links:
<div id="logo">
<a href="/index.html">
<img class="logo logo_dark_bg" src="/images/logo.png" alt="logo">
<img class="logo logo_light_bg" src="/images/logo_light.png" alt="logo">
</a>
</div>
Starting an anchor link with a / means it sources from the root so that wherever the above code is based (such as in site.com/currentfolder/file.html) it will always connect with your home page which would typically be found in site.com/index.html.
Currently (without the leading /) the anchor link is looking for site.com/currentfolder/index.html which is almost certainly looking for a file which is not the welcome or home page.
Update
Also you need to ensure that the home page file does actually exist. Typically in your case the home pages may be /index.htm rather than /index.html. Please ensure that the file with the correct filetype HTML reference (.html or .htm) exists and is referenced correctly.
Summary Issues
Anchor href file should be absolute reference starting with /
Anchor href file must exist, with the correct filetype (.html or .htm, etc.).
image src should be absolute reference (starting /).
image alt should be the website name and/or logo description.

Domain Masking - Youtube link will not work

I mask my domain name as I use my university free web hosting because I'm a poor student.
I have a link in my portfolio site to a Youtube video but it will not let me click on the link... the only way to open it is to right click and open in new window/tab.
How can I avoid this..?
The site is www.Grice95.co.uk and the link is in he far left 'CAMERA USE' icon.
Thanks Luke
You could try a hax like setting the href like this:
<a class="" href="https://www.youtube.com/v/_djf6rZ_0i4">
<img alt="" src="../images/large/cam-txtdriving.png">
<p>Text Driving - The Unwanted Outcomes (Intermediate)</p>
</a>
Or:
<a class="" href="https://www.youtube.com/watch?v=_djf6rZ_0i4&output=embed">
<img alt="" src="../images/large/cam-txtdriving.png">
<p>Text Driving - The Unwanted Outcomes (Intermediate)</p>
</a>
Or:
<a class="" href="https://www.youtube.com/embed/_djf6rZ_0i4">
<img alt="" src="../images/large/cam-txtdriving.png">
<p>Text Driving - The Unwanted Outcomes (Intermediate)</p>
</a>
The way around this is to get the iframe embed code and take the URL from there.
Taking this will redirect your youtube link to a full screen embed of your video that works whilst still retaining the masked url.
Thanks to 'thepio'

Problems displaying facebook share image using image parameter of share url

I am using the facebook share url but having trouble displaying the image parameter of the url, can anyone advise where I may be going wrong with this?
HTML
<a title="Share this on Facebook"
href="http://www.facebook.com/sharer.php?
s=100
&p[url]='http://www.test.com'
&p[images][0]='http://www.meandmrsjoneshotel.com/wp-content/themes/child-theme/img/fb-thumbs/home.png'
&p[title]='This is the title'
&p[summary]='This is the share description'"
target="_blank" class="fb ir">
Share this page on Facebook
</a>​
JS Fiddle http://jsfiddle.net/pUMZb/
Thanks
try to remove the apostrophes. Your code should be look like this
<a title="Share this on Facebook"
href="http://www.facebook.com/sharer.php?
s=100
&p[url]='http://www.test.com'
&p[images][0]=http://www.meandmrsjoneshotel.com/wp-content/themes/child-theme/img/fb-thumbs/home.png
&p[title]='This is the title'
&p[summary]='This is the share description'"
target="_blank" class="fb ir">
Share this page on Facebook
</a>​

Html links don't work with localhost?

Is this true? I'm working on an mvc3 application in visual studio and I want the image I'm using as the header to be a link back to the home page, but since I'm just running it locally I'm using this line as the code:
<a href="localhost:60060">
<img src="../../Content/images/LionLabs.png" alt="Lion logo">
</a>
This doesn't work though! am I doing something wrong, or is it just that localhosts can't be used as this?
I also just tried using a javascript method as the href to refresh the page, but that didn't work either :(
Since links by default start at the domain, there is no reason to specify it. You can just use /.
<a href="/">
<img src="../../Content/images/LionLabs.png" alt="Lion logo">
</a>
HTML links work just fine with localhost:
<a href="http://localhost:60060/">
<img src="../../Content/images/LionLabs.png" alt="Lion logo">
</a>
The issue here is that just using localhost:60060 attempts to use a relative path, so the browser is actually looking for http://localhost:60060/localhost:60060/, which, of course, is an invalid path.
Also, you should not use absolute paths when linking between pages of your application, because that becomes a nightmare when you need to change domain names (like, deploying your application to the web).
To make your code more MVC friendly, do this:
<a href="#Url.Action("Index", "Home")">
<img src="#Url.Content("~/Content/images/LionLabs.png")" alt="Lion logo">
</a>
What's happening here is that the ASP.NET MVC Url helper is supplying the proper path information when the page is served out to the user, so it automatically accommodates any changes in the server. It also allows you to use your Routes to best effect, because you can easily change the route (ie the URL) of a link but still use the same controller and view.
The links for <a href=""> don't differ from the links for <img src=""> .
You shouldn't use absolute path, because, when you deploy your project, the site name will not be localhost:60060.
For main page use
Change this:
<a href="localhost:60060">
<img src="../../Content/images/LionLabs.png" alt="Lion logo">
</a>
To this:
<a href="#Url.Action("Index", "Home")">
<img src="#Url.Content("~/Content/images/LionLabs.png")" alt="Lion logo">
</a>
Why?
It's better to use #Url.Action as that will use any custom routing you set in Global.asax. Can you imagine modifying every single link reference on a complex site if you have to change your url routing? :)
Use #Url.Content, as that will correctly resolve to the root of your application, taking away the uncertainty of using ../ or ../../ or ../../... It's cleaner!
You have used href as localhost:60060. It should be a page (may be default.html or something like that).