Posting an Image on your own webspace ...

Started by Admin aka Dan, April 21, 2004, 12:31:38

Previous topic - Next topic

Admin aka Dan

With thanks to Gavin,

I'll have a go at getting this started - but once again, I need the help of the "cr*p-busters" among us, to iron out the many wrinkles!


Step 1 - the "holder file".

1.1 - Right click on your desktop, choose "new", and "folder" - and make a folder; let's call it webpics.

1.2 - Click Start, then Run;  enter notepad, and then "OK"

Now type in (or copy and paste)

Quote
<html>

<head>
<title>My web pictures</title>
</head>

<body>


</body>
</html>


1.3 - Save this file in your "webpics" folder - call it index.html (no capitalisation!).



Step 2 - the photos you want

Save a copy of the photos you want to use in your "webpics" folder as a .jpg file.  A few fiddly tricks and hintsto save frustration later.

- Use recognisable short names, like plot1.jpg, pumpkin1.jpg, pumpkin2.jpg, pumpkin3.jpg - etc
- remember the .jpg at the end of the file name
- don't use capital letters in the file names!  Yes, I know it sounds silly - but it is a bit of good practice which may avoid all sorts of frustration later on!


Step 3 - Linking your photos to the "holder file", index.html

3.1 - Open Notepad again, and open your index.html file in the "webpics" folder

3.2 - For each photo you want to add, add the extra line in the "body" section, including the appropriate photo file name within "".

Quote
<html>

<head>
<title>My web pictures</title>
</head>

<body>

<img src="plot1.jpg" border="0">
<img src="pumpkin1.jpg" border="0">
<img src="pumpkin2.jpg" border="0">
<img src="pumpkin3.jpg" border="0">

</body>
</html>

SPELLCHECK - go back and check that you have included all the < and  > brackets;  now check you've included all the slashes - the /'s; and now check all the ""s.


3.3 - Save the file, and close Notepad

3.4 - now, just for fun, click on index.html in your webpics folder - and your browser SHOULD open up, and display your first webpage!  It won't be beautiful - but your photos should be!  (and by now you may have the bug - start learning a bit more HTML?)


Step 4 - Uploading the file to your free web-space - the quick, dirty, easy, and freest way of all! :) :) :)

4.1 - You need some information from/for your ISP.   I had a look at a couple of ISPs; the information can be found - don't be put off by the huge amounts of info you don't need at the moment.

A - the address your ISP uses to store your files, for the FTP transfer programme (it will be somewhere in the help section - the address you are looking for will be something (?) like uploads.webspace.ISPname.net).

B - your user ID and your password, from the initial connection information you got from your ISP;  you can also see it in your dial-up window.


4.2 - Connect to the internet, and open Internet Explorer.

  • Enter in the address box ftp://and the address at A  (eg ftp://uploads.webspace.isp.net/)
  • Click on File, Log-in, and enter the user ID and password from B.
  • Click "Save Password", and "Log-in"
You now have a wonderful blank space in your browser page - I hope!


4.3 - transfer

  • Now reduce your browser window, and adjust its size to fill about half your screen.
  • Open your webpics folder in My Computer, or Windows Explorer - so that you can see the list of files in the folder
  • Select all the files you want to transfer - with Shift and Click, or Ctrl and Click
  • Now, click and drag your chosen files to your empty browser window.  Simple as that.
Yup - you've just done a simple FTP file transfer!  Without ANY fancy bits of kit! :) :) :)


4.4 - Now go back to the help pages for your ISP, and somewhere you will find what http address you need, so you can find your site (and link the photos to A4A - eg mine is http://keirg.freeserve.co.uk.

Go on - type the right http address;  are you on?  Has it worked?  


Step 5 - If all has gone well, you now have a very basic page on the web!   It is crude, but will work as a "holder" for your photos that you want to link to A4A  (as in the post much further up this thread).

6.1  To add more pics, just copy the new photo to your webpics folder, open Notepad, and add another <img src="pumpkin3.jpg" border="0"> line.

6.2  To remove pics, just delete the relevant <img src="pumpkin3.jpg" border="0"> line, and delete the photo from the "webpics" folder.

And then use the same FTP trick in Internet Explorer to upload your new index.html file and new photos to your webspace.  You can also delete unwanted files from your ISP server from the same ftp page!


Fiddly?  Yes, it is the first time - but you are setting up a "system".  maintaining your photo page and updating it, is very quick and easy afterwards.  

Go on - have a go!  And tell me where it doesn't work, please!

Good luck - Gavin

Admin aka Dan


Powered by EzPortal