Various Codes

ogeretla's

~ Simple ~

H T M L

Home Page Building

For Webtvers

~ Various Codes You Will Want ~

This page consists of a collagé of what seems to be the most fequently asked questions in help newsgroups. There are a core of very talented, learned people that generously keep answering the same questions over and over for newcomers. This list includes such people as Stncold (Kevin), Dr. Gonzo (Draac), Warp-Speed, Poverty Stricken, Net Freak (Brian B.) and the list goes on and on. Please don't feel slighted it I didn't include you on the list as it would take the whole page. On behalf of myself and all the newcomers these generous people have helped, We would like to say a great big Texas size, "Thank You!!"

Because there are so many newcomers coming on line I will put this page on in it's rough draft form and add all the examples and bells and whistles at a later time.

To test a code, copy it, then hold down the "Cmd" (command) key and hit "Scroll Down" and test it in the test bed provided at the bottom of this page.

NOTE: If you see in a code:
img src="//www.oocities.org/Heaartland/Park/3904/URL" safehtml
Don't let that confuse you it should only read "URL" and is a Geo Cities bug that sometimes put the address of this site in. URL simply means the address of the page, image or sound you want to insert there.

ANOTHER NOTE: Anytime you work in a write area where you can edit like an email write screen, the "Sig In A Box," a web page editor or any forms textarea if you don't have your text setting on "small" you may run into problems with things not working due to "ghost spaces" that you won't be able to "see" with your text setting on "medium" or "large." This hold true for both typing and cut, copy & pasting.

Clickable Links
Text
<a href="URL">Text Here</a></plaintext><br> <p> <i>Change Link Text Color:</i><br> <p> If your email background is dark and the standard blue link color should be lightened to be readable use this:<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle><br> <p> <font color="red"><a href="link.html" nocolor>LINK TEXT</a></font></textarea></form></center><br> <p> My red example used here if clicked on will take you to he first page of ogeretla's Simple HTML Webtv Home Page Building. Use your back key to return.<br> <p> <center><font color="red"><a href="notebook.html" nocolor> Simple HTML</a></font></center><br> <p> <b><i>Image</i></b><br> <plaintext><a href="URL"><img src="URLofimage" height="#" width="#" alt="Image Description"></a> </plaintext><br> <p> <b><i>Adding sound to clickable image></i></b><br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <a href="urlofsound"><img src="url of image" height="#" width="#" alt="Image Description"></a></textarea></form></center><br> <p> <b><i>Align text to the right.</i></b><br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <p align="right"><font size="4" color="blue">the text goes here</font></p></textarea></form></center><br> <p> <p align="right"> <font size="4" color="blue">the text goes here </font></p><br> <p> If you don't want a different color and size text just leave out the <plaintext><font size="?" color="?"></plaintext> tag.<br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Spacer Methods.</i></b><br> There are several ways to do this. Here are just a few.<br> <p> <plaintext><p></plaintext> makes a single line space between paragraphs. Adding more than one will only show one. To get more distance you must use a line break command. For each command you get another blank line space. If you wanted three spaces you would use.<br> <plaintext><br></plaintext><br> <plaintext><br></plaintext><br> <plaintext><br></plaintext><br> <p> ~~~~~~~~~~~~~~~~<br> <p> You can put a space in by pressing your alt key + spacebar.<br> <p> ~~~~~~~~~~~~~~~~~<br> <p> <plaintext><img src="url of image" hspace="50"></plaintext><br> <p> <<>spacer type="block" height="1" width="50"><<>/spacer><br> <p> <<>spacer type="block" width="1" height="50"><<>/spacer><br> <p> <plaintext><spacer type="horizontal" width="50"></spacer> </plaintext><br> <p> <plaintext><spacer type="vertical" height="50"></spacer> </plaintext><br> <p> The above are Webtv only tags.<br> <p> The number 50 is in pixels. You can adjust that number to get the desired horizontal or vertical space you need.<br> <p> <b><i>NOTE:</i></b> The above spacer type commands are NOT supported by all browsers! If you want ALL browsers to be able to see your images where you want them to see them you MUST use a spacer gif. This one is 2x2 pixels. Transload it to YOUR FILES! If I should move it to organize, your image would crash against the left margin. When you click on it you won't be able to see it but it is there.<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="1" cols="55" autoactivate usestyle> http://www.oocities.org/Heartland/Park/3904/code/space.gif </textarea></form></center><br> <p> It is used like this:<br> <p> <plaintext><img src="URLspace.gif" width="adjust-number-to-needs"></plaintext><br> <p> <plaintext><img src="URL" height="adjust-number-to-needs"></plaintext><br> <p> ~~~~~~~~~~~~~~~~~~<br> <p> <b><i>Animated image becomes fuzzy when centered.</i></b><br> <p> Instead of using <<>center><<>/center> tags use the above examples and that will clear it up. Spacer.gif method the best.<br> <p> Another way to clear it up in a sig box is to put it in a simple table.<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <table background="same-as-body-bg" height="100%" width="100%" border="0"> <tr><td> Entire conents here. </td></tr></table></textarea></form></center><br> <p> ~~~~~~~~~~~~~~~~~~<br> <p> <b><i>Spacing for Bordered Backgrounds</i></b><br> If you have a page with a vertical border on the left use blockquotes between the <<>body> tags. If you don't want to write it out it can be abreviated like this <<>bq><<>/bq> (not supported by all browsers) and that will work as well. The code is like this:<br> <p> <<>body><br> <<>blockquote><br> <blockquote>Contents of page.</blockquote><br> <<>/blockquote><br> <<>/body><br> <p> To get more space use two or as many as you need.<br> <p> <<>bq><<>bq><br> <bq><bq>Contents here.</bq></bq><br> <<>/bq><<>/bq><br> <p> Spacing for Bordered Backgrounds (In a Table)<br> Warp-Speed has a great page on this.<br> <a href="http://www.warpspeedhelp.com/border.html">http://www.warpspeedhelp.com/border.html</a><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Logo in save in Favorite Folders.</i></b><br> Web Page only.<br> <p> <plaintext> <body background="URL of the background here" text="color" link="color" vlink="color" logo="URL of the window image"> </plaintext><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Colored Seperater Lines.</i></b><br> You can use tables to create colored lines. The seperater lines used on this page are this code.<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="3" cols="55" autoactivate usestyle> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"><td></td></table></textarea></form> </center><br> <p> Copy the code and paste in test bed. Width % can be changed from 1 - 100%. Use a higher number for cellpadding to make it thicker.<br> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Changing image size.</i></b> Physical not file size.<br> Use a width (or height) only attribute like this:<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="3" cols="55" autoactivate usestyle> <img src="//www.oocities.org/Heartland/Park/3904/img/trophy.jpg" width="?" alt="Trophy"> </textarea></form></center><br> <p> You don't need the height. Let the browser adjust it to maintain the proper shape. The ? is numbers in pixels. Just play with it until you get what you want. You can use the height only if you wish as long as you only use ONE of them.<br> <p> <center><img src="//www.oocities.org/Heartland/Park/3904/img/trophy.jpg" width="68"></center><br> <p> This picture's dimensions are height="203" width="298" Size shown width="68"<br> <p> Copy the code and paste in the test bed, change the width of "68" to any other number (up to page width of 544), test it to different sizes.<br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Button.</i></b><br> Here's an easy button anyone can see.<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="3" cols="55" autoactivate usestyle> <center> <form><input type="submit" value="Main Site Directory" text="black" onClick="parent.location='http://URL'"></form> </center> </textarea></form></center><br> <p> <center> <form><input type="submit" value="Main Site Directory" text="black" onClick="parent.location='http://www.oocities.org/Heartland/Park/3904/mainpage.html'"></form> </center><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Marquee speed.</i></b><br> Add a scrollamount to the code, like this:<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="1" cols="55" autoactivate usestyle> <marquee scrollamount="4">Text Here</marquee> </textarea></form></center><br> <p> You can play with the number to get what you're after. There are more marquee examples here.<br> <p> <a href="http://www.warpspeedhelp.com/marquee.html">Warp Speed's Marquee Page</a><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Blink Text:</i></b><br><center><marquee scrollamount="400" scrolldelay="500">LOOK AT THIS BLINK</marquee></center><br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="3" cols="55" autoactivate usestyle> <marquee scrollamount="400" scrolldelay="500">LOOK AT THIS BLINK</marquee> </textarea></form></center><br> <p> Change numbers to adjust speed.<br> <p> Another effect:<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <font size="5" color="blue"><marquee scrollamount="140" scrolldelay="30" behavior="alternate">LOOK AT</marquee></font><br><font size="5" color="red"><marquee scrollamount="140" scrolldelay="30" behavior="alternate">ME BLINK</marquee></font> </textarea></form></center><br> <p> <font size="5"color="blue"><marquee scrollamount="140" scrolldelay="30" behavior="alternate">LOOK AT</marquee></font><br><font size="5" color="red"><marquee scrollamount="140" scrolldelay="30" behavior="alternate">ME BLINK</marquee></font><br> <p> More info from <a href="http://www.warpspeedhelp.com/blink.html">Warp Speed's.</a><br> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Transparency</i></b><br> <p> The transparency (Webtv only) attribute to the <<>img> tag is as follows:<br> <center><form> <textarea bgcolor="silver" text="#000000" rows="3" cols="55" autoactivate usestyle> <img src="//imagename.gif" height="?" width="?" transparency="50%" alt="image name"> </textarea></form></center><br> <p> Change the value of the % to gain the desired effect.<br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Evil Black Box</i></b> shows up in Sig in posts or emails. A big unwanted space that messes up your background around an image.<br> <p> You can put the contents in a simple table with table background the same as the body background. This is a newsgroup bug that we aquired during a server side upgrade.<br> Like this:<br> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <body background="URL" text="color"> <table background="SAME AS BODYBG" height="100%" width="100%" border="0"> <tr><td> All your codes go here just like normal. </td></tr></table></body> </textarea></form></center><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table> </center><br> <p> <b><i>Border color around image.</i></b><br> Done with a table. Here is the code.<br> <p> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <cemter> <table bgcolor="blue" border="8"> <tr><td align="center"> <img src="//url of pic here"> </tr></td></table> </center> </textarea></form></center><br> <p> You can change the border size or color. If you want to use a background instead of the color, do this:<br> <center><form> <textarea bgcolor="silver" text="#000000" rows="6" cols="55" autoactivate usestyle> <center><table background="http://www.oocities.org/Heartland/Park/3904/code/pine.jpg" border="8"> <tr><td align="center"> <img src="//url of image here"> </td></tr></table></center> </textarea></form></center><br> <p> This one is for a wood grain border, you may change it to any you like.<br> <p> <center> <table background="code/pine.jpg" border="8"> <tr><td align="center"> <img src="//www.oocities.org/Heartland/Park/3904/img/trophy.jpg" width="100"> </tr></td></table> </center><br> <p> <center> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table><br> <p>   HTML tags not required but MAY be used.<br> <table border="2" bgcolor="tan"> <tr><td align="center"> <form name="testbed" method="post" action="http://www.expert-html.com/cgi-bin/testbed.cgi"> <textarea rows="12" cols="56" name="source" text="black" cursor="black" bgcolor="lightgrey" autoactivate></textarea> </td></tr> <tr><td align="center"> <input type="submit" name="submit" value="TEST"> <input type="reset" name="reset" value="RESET"> </td></tr></table><br> <br> <p> For quick html help and answers try these newsgroups:<br> <p> <a href="news:alt.discuss.clubs.public.html.help.knockmedown-">news:alt.discuss.clubs.public.html.help.knockmedown-</a><br> <a href="news:alt.discuss.clubs.public.html.help.warp-speed">news:alt.discuss.clubs.public.html.help.warp-speed</a><br> <a href="news:alt.discuss.advanced.html">news:alt.discuss.advanced.html</a><br> <p> <table bgcolor="blue" width="80%" border="0" cellpadding="1" cellspacing="0"> <td></td></table><br> <p> <p> <font size="4"<b><i>BACK TO:</i></b></font><br> ogeretla's Simple HTML Webtv Home Page Building<br> <p> <a href="notebookweb5.html">Page In A Box</a><br> <a href="notebooksig4.html">Sig In A Box</a><br> <a href="notebook3.html">HTML Table</a><br> <a href="notebook2.html">Web Tools Introduction</a><br> <a href="notebook.html">ogeretla's Simple HTML Webtv Home Page Building</a><br> <p> <form><input type="submit" value="Main Site Directory" text="black" onClick="parent.location='http://www.oocities.org/Heartland/Park/3904/mainpage.html'"></form><br> <p> <p> <table bgcolor="#D9D9FF" border="6" cols="2"width="70%"> <caption><center><b><i>FYI</i></b></center></caption> <tr><td align="center>> If you've been helped<br> or enjoyed this page.<br> </td> <td align="center"> Any comments or q's<br> feel free to...<br> </td></tr> <tr><td align="center"> <a href="/cgi-bin/geoplus_apps/ans_entry">SIGN GUEST BOOK</a> </td> <td align="center"> <a href="mailto:ogeretla@webtv.net">E-MAIL ME</a> </td></tr></table><br> <p> <a href="/cgi-bin/geoplus_apps/ans_entry">Sign Guestbook</a> <a href="geobook.html">View Guestbook</a><br> <p> Have a geat day! Be kind to bridge trolls! :-)</center<br> <p>  <A HREF="http://www.cdnow.com/from=sr-894694"><IMG src="//gs.cdnow.com/MN/cdnow.buyweb_credit/upgrade/graphics/xswfb_468x60.gif" height="60" width="468" BORDER="0" ALT="Cosmic Weekly Sales Banner"></A><br>  <p> <a href="http://www.webmillion.com/members/join1.html?referer=977301"><img src="img/webmillion.gif" height="70" width="100" hspace="10" border="0" alt="webmillion gif"></a><br> <p> <table bgcolor="lightgrey" border="4"> <tr><td align="center"> <a href="http://members.tripod.com/~ogeretla/trips.html">The Kings Banquet</a> </td></tr></table><br> <P> <HR> <P> <B> This page hosted by <A HREF="/"><IMG SRC="/pictures/gc_icon.gif" ALIGN=MIDDLE ALT="GeoCities" BORDER=0></A> Get your own <A HREF="/">Free Home Page</A></B></CENTER> <BR><BR> </BODY> </HTML>