Image and Image Link Trouble

(DreamWeaver)

  • (2 Pages)
  • +
  • 1
  • 2

15 Replies - 808 Views - Last Post: 22 June 2008 - 11:56 AM

#1 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Image and Image Link Trouble

Posted 21 June 2008 - 02:06 PM

Ok so I'm using Dreamweaver(CS3) to create a website. I had a friends make a nice looking site in Photoshop(CS3), then I sliced and optimized it. Then I put the page into my website, and put in the image folder as well. Then I made sure that all the images has the correct source files. It looked like everything was fine, but then when I went to the website none of the images showed up. They show up as broken, like they have the wrong source, but I made sure that the images are from a folder in the site root, so it should work, right? I just don't know what's wrong, please help.


P.S.
Also, how do I make it so that images that are links don't have that blue box around them?


Thanks

Is This A Good Question/Topic? 0
  • +

Replies To: Image and Image Link Trouble

#2 biggles2008  Icon User is offline

  • Bassface
  • member icon

Reputation: 9
  • View blog
  • Posts: 623
  • Joined: 05-March 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 04:08 PM

Upload to an ftp?

Did you : Save for web > Save> and in the little drop down click images and html file?

use the html file as your Home page and edit around that for rest of page.
Was This Post Helpful? 0
  • +
  • -

#3 gabehabe  Icon User is offline

  • GabehabeSwamp
  • member icon




Reputation: 1382
  • View blog
  • Posts: 10,962
  • Joined: 06-February 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 04:14 PM

Your links are wrong. As an example, you should have something such as:
http://www.mysite.com as the main page and images should be in a new directory:
http://www.mysite.com/images [or something similar]

Also, you can simply set the border to 0, with something like the following:
<img src = "images/myimage.png" border = 0 />

Hope this helps :)
Was This Post Helpful? 0
  • +
  • -

#4 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 05:43 PM

I did save properly, and I do have proper links like you say, that's not the problem. Thanks for the help with the border tho.
Was This Post Helpful? 0
  • +
  • -

#5 no2pencil  Icon User is online

  • Toubabo Koomi
  • member icon

Reputation: 5307
  • View blog
  • Posts: 27,208
  • Joined: 10-May 07

Re: Image and Image Link Trouble

Posted 21 June 2008 - 07:48 PM

View PostTentativeChaos, on 21 Jun, 2008 - 08:43 PM, said:

I did save properly, and I do have proper links like you say, that's not the problem. Thanks for the help with the border tho.

Can you post a link to the live site?
Was This Post Helpful? 0
  • +
  • -

#6 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 09:03 PM

ok update:

So I tweaked the image source, on one image (made it relative to root instead of relative to document, which in theory shouldn't have any affect on it). That made it so all the images worked except for the home button. So then I did the exact same tweak to the home button and everything went back to not working. So after tweaking this and that, it appears that whatever I do to the image source or anything, it either causes all pictures to not work, or all to work except the home button. I still have no idea what's wrong.

Here is the link to the website: http://www.goldgas.exofire.net
Was This Post Helpful? 0
  • +
  • -

#7 rjolitz  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 3
  • View blog
  • Posts: 110
  • Joined: 17-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 09:30 PM

Okay.. for some reason your files are still referring to the file on your home machine.

ie:

<img src="file:///C|/Users/Dan/Documents/images/gray_box_nextToBuyNow.gif" width="126" height="66" alt="">


I'm not sure why this is happening but if you fix your image links to read:

img src="./images/gray_box_nextToBuyNow.gif" width="126" height="66" alt="">

Should fix it.


Also, you may get this error if you don't use the upload features in Dreamweaver.

Try fixing these and let us know!
Was This Post Helpful? 0
  • +
  • -

#8 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 10:43 PM

here is what my gray box code looks like:

<td>
<img src="../public_html/images/gray_box_nextToBuyNow.gif" 
width="126" height="66" alt="">
</td>

This post has been edited by TentativeChaos: 21 June 2008 - 10:44 PM

Was This Post Helpful? 0
  • +
  • -

#9 no2pencil  Icon User is online

  • Toubabo Koomi
  • member icon

Reputation: 5307
  • View blog
  • Posts: 27,208
  • Joined: 10-May 07

Re: Image and Image Link Trouble

Posted 21 June 2008 - 10:49 PM

You want your code to match the directory structure of your webhost.

<td>
<img src="images/gray_box_nextToBuyNow.gif" 
width="126" height="66" alt="">
</td>


If that means changing your settings in DreamWeaver, I would strongly suggest doing that.
Was This Post Helpful? 0
  • +
  • -

#10 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 11:08 PM

Well, that didn't work, here is a pic of my website in dreamweaver for you guys:

Posted Image

and here is the code:

<html>
<head>
<!-- TemplateBeginEditable name="doctitle" -->
<title>h2o is gas!</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
	background-color: #464646;
}
-->
</style>
<link href="../public_html/main_css.css" rel="stylesheet" type="text/css">
<link href="../public_html/text_css.css" rel="stylesheet" type="text/css">
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
  <!-- ImageReady Slices (website 01.psd) -->
  <div id="Website">
	<table width="1001" height="1001" border="0" cellpadding="0" cellspacing="0" bgcolor="#464646" id="Table_01">
	  <tr>
		<td colspan="2">
		  <img src="../public_html/images/Upper_Left_Grainy_Box.jpg" width="251" height="228" alt=""></td>
	  <td colspan="7">
			<img src="/public_html/images/top_car.jpg" width="749" height="228" alt="Water Car"></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="228" alt=""></td>
		</tr>
	  <tr>
		<td colspan="2">
		  <img src="../public_html/images/H2O_IS_GAS_mini_banner.gif" width="251" height="66" alt="h2o is gas"></td>
	  <td colspan="3">
			<a href="../public_html/index.html"><img src="../public_html/images/Home_Button.gif" alt="Home" width="181" height="66" lowsrc="../public_html/images/Home_Button.gif"></a></td>
	<td>
			<img src="file:///C|/Users/Dan/Documents/images/h2oIsGasWebsite_05.gif" width="1" height="66" alt=""></td>
		  <td><a href="./public_html/about_us.html"><img src="../public_html/images/About_Us_Button.gif" width="207" height="66" alt="About Us"></a></td>
	<td>
			<a href="http://goldgt.water4gas.hop.clickbank.net"><img src="../public_html/images/Buy_Now_Button.gif" width="234" height="66" alt="Buy Now"></a></td>
	<td>
			<img src="../public_html/images/gray_box_nextToBuyNow.gif" width="126" height="66" alt=""></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="66" alt=""></td>
		</tr>
	  <tr>
		<td rowspan="5">&nbsp;</td>
		  <td rowspan="2"><!-- TemplateBeginEditable name="Page Title" --> <img src="../public_html/images/random_blue_Box.gif" width="212" height="67" alt=""><!-- TemplateEndEditable --></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/Home_Button-12.gif" width="2" height="1" alt="Home"></td>
		  <td colspan="6" rowspan="3">
			<img src="../public_html/images/TurnYourCarIntoBanner.jpg" width="747" height="68" alt="Turn your car into a water-burning hybrid."></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="1" alt=""></td>
		</tr>
	  <tr>
		<td>
		  <img src="file:///C|/Users/Dan/Documents/images/h2oIsGasWebsite_13.gif" width="2" height="66" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="66" alt=""></td>
		</tr>
	  <tr>
		<td colspan="2" rowspan="2">
		  <img src="../public_html/images/Gray_Car_Ghost.jpg" width="214" height="338" alt=""></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="1" alt=""></td>
		</tr>
	  <tr>
		<td rowspan="2">
		  <img src="file:///C|/Users/Dan/Documents/images/h2oIsGasWebsite_15.gif" width="1" height="582" alt=""></td>
		  <td colspan="5" rowspan="2"><!-- TemplateBeginEditable name="Main Text Field" -->
			<div id="text_area"></div>
		  <!-- TemplateEndEditable --></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="337" alt=""></td>
		</tr>
	  <tr>
		<td colspan="2">
		  <img src="/public_html/images/GrayFillerUnderCarGhost.gif" width="214" height="245" alt=""></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="245" alt=""></td>
		</tr>
	  <tr>
		<td colspan="9">
		  <img src="../public_html/images/Bottum-Bar.gif" width="1000" height="56" alt=""></td>
	  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="56" alt=""></td>
		</tr>
	  <tr>
		<td>
		  <img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="39" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="212" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="2" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="178" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="1" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="207" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="234" height="1" alt=""></td>
		  <td>
			<img src="file:///C|/Users/Dan/Documents/images/spacer.gif" width="126" height="1" alt=""></td>
		  <td></td>
		</tr>
	</table>
  <img src="file:///C|/Users/Dan/Documents/images/Gray_Slice_Left.gif" width="39" height="650" alt=""></div>
</div>
<div align="center">
  <!-- End ImageReady Slices -->
</div>
</body>
</html>


P.S.
No matter what the problem turns out to be, I blame Vista!

This post has been edited by TentativeChaos: 21 June 2008 - 11:11 PM

Was This Post Helpful? 0
  • +
  • -

#11 no2pencil  Icon User is online

  • Toubabo Koomi
  • member icon

Reputation: 5307
  • View blog
  • Posts: 27,208
  • Joined: 10-May 07

Re: Image and Image Link Trouble

Posted 21 June 2008 - 11:23 PM

View PostTentativeChaos, on 22 Jun, 2008 - 02:08 AM, said:

No matter what the problem turns out to be, I blame Vista!

No, the problem actually is that you are using Dream Weaver, & because it tries to automate every little function of coding for you, it must be preciecly correct, or else this is what happens.

You really have two basic choices. Either read up on the documentation on how to correct Dream Weavers setup, so that the directory structure is correct & can be transfered to the web host, or use better editing software.
Was This Post Helpful? 0
  • +
  • -

#12 TentativeChaos  Icon User is offline

  • New D.I.C Head

Reputation: -1
  • View blog
  • Posts: 24
  • Joined: 10-May 08

Re: Image and Image Link Trouble

Posted 21 June 2008 - 11:26 PM

It was a joke. Anyways, what is the correct directory structure?
Was This Post Helpful? 0
  • +
  • -

#13 no2pencil  Icon User is online

  • Toubabo Koomi
  • member icon

Reputation: 5307
  • View blog
  • Posts: 27,208
  • Joined: 10-May 07

Re: Image and Image Link Trouble

Posted 21 June 2008 - 11:29 PM

View PostTentativeChaos, on 22 Jun, 2008 - 02:26 AM, said:

It was a joke. Anyways, what is the correct directory structure?


... it's your system & your web host. Other than images, I have no idea.

But from the examples you've provided I would guess it's whatever_your_root_web_directory_is/images

Not to be a jerk, but if you have to ask what this is, then you may want to take a step back & reread things over. Both on your hosting site & within your local setup. It might make more sense moving forward.
Was This Post Helpful? 0
  • +
  • -

#14 rjolitz  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 3
  • View blog
  • Posts: 110
  • Joined: 17-May 08

Re: Image and Image Link Trouble

Posted 22 June 2008 - 01:00 AM

View PostTentativeChaos, on 21 Jun, 2008 - 11:26 PM, said:

It was a joke. Anyways, what is the correct directory structure?


how are you uploading your files?

Are you doing it with a seperate FTP program or are you doing it through dreamweaver?
Was This Post Helpful? 0
  • +
  • -

#15 gabehabe  Icon User is offline

  • GabehabeSwamp
  • member icon




Reputation: 1382
  • View blog
  • Posts: 10,962
  • Joined: 06-February 08

Re: Image and Image Link Trouble

Posted 22 June 2008 - 03:42 AM

Replace your current code on your site (not on DreamWeaver) with the following:
<html>
<head>
<!-- TemplateBeginEditable name="doctitle" -->
<title>h2o is gas!</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
	background-color: #464646;
}
-->
</style>
<link href="main_css.css" rel="stylesheet" type="text/css">
<link href="text_css.css" rel="stylesheet" type="text/css">
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div align="center">
  <!-- ImageReady Slices (website 01.psd) -->

  <div id="Website">
	<table width="1001" height="1001" border="0" cellpadding="0" cellspacing="0" bgcolor="#464646" id="Table_01">
	  <tr>
		<td colspan="2">
		  <img src="/images/Upper_Left_Grainy_Box.jpg" width="251" height="228" alt=""></td>
		  <td colspan="7">
			<img src="/images/top_car.jpg" width="749" height="228" alt="Water Car"></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="228" alt=""></td>

		</tr>
	  <tr>
		<td colspan="2">
		  <img src="/images/H2O_IS_GAS_mini_banner.gif" border=0  width="251" height="66" alt="h2o is gas"></td>
		  <td colspan="3">
			<a href="index.html"><img src="/images/Home_Button.gif" border=0  width="181" height="66" alt="Home"></a></td>
		  <td>
			<img src="/images/h2oIsGasWebsite_05.gif" border=0  width="1" height="66" alt=""></td>
		  <td>

			<a href="about_us.html"><img src="/images/About_Us_Button.gif" border=0  width="207" height="66" alt="About Us"></a></td>
		  <td>
			<a href="http://NICKNAME.water4gas.hop.clickbank.net"><img src="/images/Buy_Now_Button.gif" border=0  width="234" height="66" alt="Buy Now"></a></td>
		  <td>
			<img src="/images/gray_box_nextToBuyNow.gif" border=0  width="126" height="66" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="66" alt=""></td>
		</tr>
	  <tr>

		<td rowspan="5">&nbsp;</td>
		  <td rowspan="2"><!-- TemplateBeginEditable name="Page Title" --> <img src="/images/random_blue_Box.gif" border=0  width="212" height="67" alt=""><!-- TemplateEndEditable --></td>
		  <td>
			<img src="/images/Home_Button-12.gif" border=0  width="2" height="1" alt="Home"></td>
		  <td colspan="6" rowspan="3">
			<img src="/images/TurnYourCarIntoBanner.jpg" width="747" height="68" alt="Turn your car into a water-burning hybrid."></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="1" alt=""></td>

		</tr>
	  <tr>
		<td>
		  <img src="/images/h2oIsGasWebsite_13.gif" border=0  width="2" height="66" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="66" alt=""></td>
		</tr>
	  <tr>
		<td colspan="2" rowspan="2">

		  <img src="/images/Gray_Car_Ghost.jpg" width="214" height="338" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="1" alt=""></td>
		</tr>
	  <tr>
		<td rowspan="2">
		  <img src="/images/h2oIsGasWebsite_15.gif" border=0  width="1" height="582" alt=""></td>
		  <td colspan="5" rowspan="2"><!-- TemplateBeginEditable name="Main Text Field" -->
			<div id="text_area"></div>

		  <!-- TemplateEndEditable --></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="337" alt=""></td>
		</tr>
	  <tr>
		<td colspan="2">
		  <img src="/images/GrayFillerUnderCarGhost.gif" border=0  width="214" height="245" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="245" alt=""></td>

		</tr>
	  <tr>
		<td colspan="9">
		  <img src="/images/Bottum-Bar.gif" border=0  width="1000" height="56" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="56" alt=""></td>
		</tr>
	  <tr>
		<td>

		  <img src="/images/spacer.gif" border=0  width="39" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="212" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="2" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="178" height="1" alt=""></td>

		  <td>
			<img src="/images/spacer.gif" border=0  width="1" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="207" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="234" height="1" alt=""></td>
		  <td>
			<img src="/images/spacer.gif" border=0  width="126" height="1" alt=""></td>
		  <td></td>

		</tr>
	</table>
	<img src="/images/Gray_Slice_Left.gif" border=0  width="39" height="650" alt=""></div>
</div>
<div align="center">
  <!-- End ImageReady Slices -->
</div>
</body>
</html>

You were still using image sources that were on your computer, so I corrected it. Also, I threw in those border=0 on each img tag.

You might want to consider using something else... DreamWeaver sucks, IMO. If anything, just use code view.

Hope this helps :)
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2