Technical Overview
This section is meant for those who already know how to place images on a web
page using the HTML tag <IMG SRC>. If you do not know how to do this, you may want
to move on to the next section.
Still here? OK, as you have noticed, you can upload images on different portions of
your site like a Calendar Event, FAQ, or a web page. You may also use different options
such as Mouse Text(Alt Tag), Weblink, etc. Whether you use the options or not, all we do
is build the images <IMG SRC> tag for you. If you include options such as the Alt Tag, we add
that as well. There's no mystery behind the way images work on DataPitStop, including their
tags.
That being said, the <!UPLOADX:X!] tag enables you to embed the image anywhere on the page
you want. What does this tag do? As mentioned, all it does it pull your image options, such
as Mouse Text, then slap an <IMG SRC> tag in it's place. This retains the user friendly aspect
of specifying Mouse Text, Image Descriptions, etc, while still being able to place your images
anywhere on your page you want.
You would rather use the <IMG SRC> tag instead? No problem, with 2 caveats. First, when you
use the <IMG SRC> tag, the image options you specified when you upload the image will not
be used. You need to build all options yourself. The <IMG SRC> tag knows nothing about the
options you specified when you uploaded your image.
Second, you need to know the path to your image. You do not know this.
That's why we created the <!FILENAME:X!] tag. This tag simply replaces itself
with the full path to your image. In other words, to place an image with <IMG SRC>, you would
use something like <IMG SRC="<!FILENAME:X!]">. There are other situations where the <!FILENAME:X!]
tag will come in handy. The tag was actually created so we could use image maps.
You can use it anywhere that a full path to the image is needed.
See, there's no trickery behind using images on DataPitStop. The 2 new tags can actually make your
life easier, especially the <!UPLOADX:X!] tag. Read on to find out how to use these tags.
DataPitStop Image Tag- <!UPLOADX:X!]
This is the special DataPitStop image tag. When you want to place an image on your
page this is the easiest tag to use. This tag uses all of your image options you
specified with your image (i.e. Description, Mouse Text, Full size Image, Weblink).
The 2 options this tag takes are ALIGNMENT and the reference number for your image.
Syntax
<!UPLOADX:Y!]
X = l|r|t|m|b (left|right|top|middle|bottom)
Y = Image Reference Number
Examples
Example 1- Left
<!UPLOADL:262!] Aligned to the left.
Aligned to the left.
Example 2- Right
<!UPLOADR:262!] Aligned to the right.
Aligned to the right.
Example 3- Top
<!UPLOADT:262!] Aligned to the top.
Aligned to the top.
Example 4- Middle
<!UPLOADM:262!] Aligned to the middle.
Aligned to the middle.
Example 5- Bottom
<!UPLOADB:262!] Aligned to the bottom.
Aligned to the bottom.
Placing an image- <IMG SRC=?>
This tag enables you to place images on your web pages. This is the standard HTML
image tag. Most of the time you will want to use the UPLOAD tag
described above instead. The drawback to using this tag with DataPitStop is that it DOES NOT
use your image options! This means that your image
Description, Mouse Text, Full size Image, and Weblink you specified when you uploaded
your image will not work. If you would like to retain these options please use the UPLOAD
tag described above. Also note that the <IMG SRC> tag needs the path to your image on
our server. You will need to use the <!FILENAME:X!] tag for this.
Syntax
<IMG SRC="YOUR-IMAGE" ATTRIBUTE="VALUE">
This simply places the image wherever you put this tag. It also has several
attributes such as aligning the image in a certain fashion or giving it Mouse Text(Alt Tag).
These will be briefly outlined in the following examples.
Examples
Example 1- Border of 1
<IMG SRC="myimage.jpg" BORDER="5">
Example 2- Mouse Text(Alt Tag)
<IMG SRC="myimage.jpg" ALT="My Alt Tag">
Example 3- Width and Height
<IMG SRC="myimage.jpg" WIDTH="50" HEIGHT="30">
Example 4- Alignment
<IMG SRC="myimage.jpg" ALIGN="LEFT"> Aligned to the left.
Aligned to the left.
<IMG SRC="myimage.jpg" ALIGN="RIGHT"> Aligned to the right.
Aligned to the right.
<IMG SRC="myimage.jpg" ALIGN="TOP"> Aligned to the top.
Aligned to the top.
<IMG SRC="myimage.jpg" ALIGN="MIDDLE"> Aligned to the middle.
Aligned to the middle.
<IMG SRC="myimage.jpg" ALIGN="BOTTOM"> Aligned to the bottom
Aligned to the bottom
These are just a few of the <IMG SRC> attributes available to you. For
a better list please view the
HTML Quick Reference Guide.
File Path Tag- <!FILENAME:X!]
The <!FILENAME:X!] tag is very simple to use. The only option it takes is the
images reference number. The sole purpose of this tag is to give you a way to
insert the full path of your image onto your web page. You can use this tag
with the <IMG SRC> tag or anywhere that required the full path to your image.
Syntax
<!FILENAME:X!]
X = Your images Reference Number
Result
As mentioned, all this tag does is insert the full path to your image. Here is an
example of this. I am not going to use it within any tag, I am simply going to give the full
path to one of my images.
If you do this:
<!FILENAME:262!]
You'll get this:
http://help.datapitstop.us/DATA/MENUDATA/FLD00001/00000262T.GIF
As you can see, all this did was give the full path to my image that has the Reference
Number of 262. If you wanted to use this tag with the <IMG SRC> tag, you could do the
following.
If you do this:
<IMG SRC="<!FILENAME:262!]">
You'll get this:
<IMG SRC="http://help.datapitstop.us/DATA/MENUDATA/FLD00001/00000262T.GIF">
Note that you won't get exactly this, the image will be placed on your page instead. This is the
actual code it will produce.
Final Thoughts
You have all the flexibility you need with images. How you go about it is up to you.
If your new to HTML and want to embed an image, use the UPLOAD tag. This is by far
the easiest one to use. The other tags are easy to use, however they do not take advantage
of the options you specified for your image. If you find yourself needing to use an
image option, such as BORDER or image maps, you will need to use the <IMG SRC> and FILENAME tags instead.
Finally, if you still need further assistance, or something doesn't make sense, you may want to
read Using Images. It contains
more detailed information on how to use images on your site.
|