Posted on 11/10/2001 6:31:33 AM PST by Seniram US
Could someone please explain to me how to post a photo with an article? I can't figure out how to post the photo as part of the item. Thank you very much.
Another way:
/1/ Right click on the image. A drop down menu will appear. Click on "properties", it will give you the "URL", that long alphanumeric ID tag. /2/ Left mouse click on the left most letter (usually h of http) and hold down the button, sliding across the whole thing. It will all turn another color.
/3/ Right click on that entire highlighted URL, and another menu will appear. Left click on "copy". That entire long URL is now saved.
/4/ Now go to the "preview box" just like you were writing any reply on a thread. Use this HTML formula to post an image, but do NOT put a space next to the < > signs. The < > signs right next to URL formulas enables HTML. Here is the formula:
< IMG SRC="URL" >
So type < IMG SRC=", and then "right click" your mouse. The menu will give you the choice to "paste". Left click "paste", and your entire copied URL will appear. Just put a " > after it, and then hit "Preview". The image will appear in the preview box, if it doesn't, something is fouled up, don't hit "end" until you see the iimage preview correctly.
Hey it works!!!!
The basic syntax for images looks like this:
<img src="http://www.somewebsite.com/somedirectory/thepicture.jpg">If a picture lives within an article you are trying to post at FreeRepublic, the most common problem you will encounter is HTML code that uses a relative URL instead of an absolute URL. For instance, if your article contains the following code
<img src="/somedirectory/thepicture.jpg" >and you post that article at FreeRepublic, a Freeper's web browser will resolve the code by appending the FreeRepublic domain, resulting in
<img src="http://www.freerepublic.com/somedirectory/thepicture.jpg">Because the picture isn't at FreeRepublic, this won't work, and the Freeper's web browser will produce some sort of error message.
If you want your post to look nice, then you must scrutinize the code you are about to post, and make sure that all the relative URLs have been resolved to absolute URLs. Be aware that if the relative URL does not start with a forward slash (/), then the image lives in a subdirectory of the directory that holds the page you are viewing. For instance, if you are viewing the page whose URL is
http://www.somewebsite.com/somedirectory/somepage.htmand within that page the programmer has written the HTML code
<img src="somesubdirectory/thepicture.jpg">then the code that you want to post at FreeRepublic will look like this:
<img src="http://www.somewebsite.com/somedirectory/somesubdirectory/thepicture.jpg">Also, be aware that programmers use a trick with double periods (..) to move up (backwards) and down (forwards) within a directory structure. In general, double periods (..) mean "move back one directory towards the root of the directory tree". For instance, if you are viewing a web page whose URL is
http://www.somewebsite.com/somedirectory/somesubdirectory/somepage.htmand within that page the programmer has written the HTML code
<img src="../images/thepicture.jpg">then the code that you want to post at FreeRepublic will look like this:
<img src="http://www.somewebsite.com/somedirectory/images/thepicture.jpg">[In this example, note that somesubdirectory was killed by the .. double periods.] Programmers can do this as many times as they want; for instance, if you are viewing a web page whose URL is
http://www.somewebsite.com/dir0/subdir1/subdir2/subdir3/subdir4/subdir5/somepage.htmand within that page the programmer has written the HTML code
<img src="../../../altdirA/altdirB/altdirC/thepicture.jpg">then the code that you want to post at FreeRepublic will look like this:
<img src="http://www.somewebsite.com/dir0/subdir1/subdir2/altdirA/altdirB/altdirC/thepicture.jpg">[In this example, note that subdir3/subdir4/subdir5 was killed by the ../../.. succession of double periods.]
Often the easiest way to get the absolute URL of a picture is to open the original web page in a web browser, right click on the picture, scroll to Properties, and look at the Address (URL). The address you see there will be the absolute address; if you highlight the address with your mouse, you can copy the address using Ctrl-C, and then paste the address into a word processor using Ctrl-V. [This works for Internet Explorer; I imagine Netscape to be similar.] Indeed, if you start with the code fragment
<img src="">then you can paste the absolute address between the double quotes and you're ready to go.
There are several keywords you can use to alter the appearance of your image. Often there will be some ambient (surrounding) code that causes a border to appear around your image. For instance, the following code will give you a link to Matt Drudge's site, using Matt Drudge's logo, but Matt's logo will be surrounded with a border:
<a href="http://www.drudgereport.com"><img src="http://www.drudgereport.com/logo9.gif"></a>produces
To get rid of the border, use the border="0" directive:
<a href="http://www.drudgereport.com"><img border="0" src="http://www.drudgereport.com/logo9.gif"></a>produces
You can give the picture an alternate title by using the alt="" directive:
<a href="http://www.drudgereport.com"><img border="0" alt="CLICK HERE TO GO TO MATT DRUDGE'S WEB PAGE" src="http://www.drudgereport.com/logo9.gif"></a>produces
You see the alternate title when you scroll your mouse over the picture (without actually clicking the picture).
Finally, you can resize the picture using the width="" and height="" directives. For instance, if you think Matt's logo, at 610 x 85 pixels, is too large, then you can force the browser to resize it, say, to 122 x 17 pixels (note that 122 is exactly one-fifth of 610, and 17 is exactly one-fifth of 85):
<a href="http://www.drudgereport.com"><img width="122" height="17" border="0" alt="CLICK HERE TO GO TO MATT DRUDGE'S WEB PAGE" src="http://www.drudgereport.com/logo9.gif"></a>produces
(To get the pixel size of an image, open it in Internet Explorer, right click on the image, scroll to Properties, and view the Dimensions; the dimensions are listed, in pixels, as width x height.) When altering the dimensions of a picture, it's very important that the ratio of width to height (or height to width) remain constant; in this case, you have
610 / 85 = 13.934426... = 122 / 17I knew would work in advance, because all I did was cast out a factor of five:
610 / 85 = (122 X 5) / (17 X 5) = 122 / 17You can make things really screwy if you alter one of the dimensions without altering the other. For instance, if you quadruple the default height of Matt's logo, from 85 to 340, without quadrupling the default width, you get this:
<a href="http://www.drudgereport.com"><img width="610" height="340" border="0" alt="CLICK HERE TO GO TO MATT DRUDGE'S WEB PAGE" src="http://www.drudgereport.com/logo9.gif"></a>which produces
On the other hand, sometimes you will want to make a picture smaller, but in your calculations you will discover that one of the new dimensions is not a whole number. For instance, if you want to halve the width and the height of the Matt's logo, you are faced with
610 / 2 = 305and you have to decide whether to round 42.5 down to 42 or up to 43. Usually this won't make much difference in picture quality; for instance, if you round up to 43, you get
85 / 2 = 42.5
<a href="http://www.drudgereport.com"><img width="305" height="43" border="0" alt="CLICK HERE TO GO TO MATT DRUDGE'S WEB PAGE" src="http://www.drudgereport.com/logo9.gif"></a>producing
If you decide you want to use width and height in your code, it's very important that you spell them correctly. If you've just finished typing
width=""where the t comes before the h, and you immediately try to type
height=""where the (second) h comes before the t, it's very easy to type
heigth=""by mistake. Your browser's HTML interpreter is very stupid; it doesn't know
heigth=""from
Tuesdayand any code that contains this typo will be useless.
To see a summary of the directives you can use with the <img> tag, visit the W3C's web site:
http://www.w3c.orgThe W3C is the official guardian of HTML (the Hypertext Markup Language). At the time of this writing, the home page for the <img> tag was
http://www.w3.org/TR/html401/struct/objects.html#h-13.2
I'm supposed to teach it for a living [although, in the teaching bidness, you quickly discover that teaching for a living, and getting someone to pay you to teach for a living, with, God forbid, a check that doesn't bounce, are two entirely different things.]
When you write a long post like that, it's funny how many typographical errors you make. I must have re-read that thing four or five times before I posted it, but now, as I look back over it, I can spot three or four typos.
Good grief, man! warn us before you post that crap!
I know what you mean about typos...when I really want to make sure I'm clean I read the thing backwards.
you might try teaching a night school course at a jr college once/twice a week, and have some fun, while supplamenting your income from a normal job. I always learned best and most useful stuff, like your post, from teachers like that, people in the business, who love to teach, and not those who got paid for teaching as a profession.
Just practicing
Disclaimer: Opinions posted on Free Republic are those of the individual posters and do not necessarily represent the opinion of Free Republic or its management. All materials posted herein are protected by copyright law and the exemption for fair use of copyrighted works.