FrontPage Tutorial 4 page1 of 2

OK, time to get real low and dirty now...that section will teach you some advanced features of FrontPage that'll make you feeling like a pro.

columns: Columns are extensively used by a lot of sites these days; it adds a lot more organization and style to your page. Before we continue...please make sure you are absolutely comfortable with basic table inserts, and if not, please go back to tutorial 2 to clear up your doubts. All set? Ok, let's wrap out of here and get going. Here we go.

Frames: Ok, so you've tried numerous times to get the FrontPage frame wizard to whip up a frame for you, but have failed and threw your hands in the air more than once. Of course, the reason is because FrontPage will only allow you to create frames with a FrontPage Web loaded. Why is that? Well, because frames are actually NOT a webpage, but simply a "container" that has more than one page contained in it. Therefore, you can't even open a frame "page" using the FrontPage editor, since there's nothing to open! (its just a container, nothing more!) This tutorial on frames will inform you on two things: 1) How to get the FrontPage Web going so you can use the Wizard to do frames, but also, 2) Why you should NOT use the wizard, and learn HTML for creating frames instead. But first, lets see how its done with FrontPage. Like I said, you need a web open to create frames, but if you're like me, and never used FrontPage Explorer, but rather, only FrontPage Editor, what do you do? No sweat. What you need to do is import everything you've created before into the web. Everything will be copied, (not moved-don't worry) from the previous directory to C:\webshare\wwwroot\nameofyourweb\ Upon doing so, you can use all the features of FrontPage Explorer, including the frame wizard, to verify links, check spelling for the entire site, create a map of your site, make frames, etc. All changes will be saved to the webshare\...directory, and not the old directory. What you basically have than, is two copies of your entire site. Ok, to import everything from your old directory to the web, open FrontPage Explorer, select file, than import. Type in a name for your web (could be anything), than press ok. Follow the import wizard, and everything will be imported to FrontPage Explorer. Now, what is the problem with doing the above, than? First of all, if you're like me, and simply don't want to use FrontPage Explorer ( I find it easier to keep track of broken links, spelling etc manually, since I have a small site), why start now just because you want frames? Second, and thirdly:

It really is up to you how you want your frames done, but my advise: Use HTML, because WHAT YOU SEE IS NOT WHAT YOU GET!

Image Alignments: There are many ways to align your images, and I'm not just talking about putting them to the upper left or lower right of the page. Image alignment in this case means how a image is integrated into the surrounding text. Don't worry, it'll all be clear real soon.
An image can be integrated into text in various ways, the most common are right, left, middle. To align an image in any way, right click the image, and select appearance. At the top, you'll see layout, which is what we're talking about here.

This is "ordinary" alignment. (bottom) This is what you get when you simply just add an image, without applying any manipulation to the alignment. This is what the default setting is.

This is, however, left alignment. Everything to the right of the image is integrated with the image as if the image does not exist there, thus allowing many lines of text to be written right alongside of the image. Note: You could also use tables to achieve a similar, but not completely the same effect. The left alignment wraps the text around, and surrounds the image.

This is, right alignment. Everything to the left of the image is integrated with the image similar to the above. If you go to ESPN or any other site that include photos with text, this is how they align the images. Note: You could also use tables to achieve a similar, but not completely the same effect. The right alignment wraps the text around, and surrounds the image.

Of course, there's a whole bunch of other alignments-feel free to explore them. We're end this section here, though.

HTML markup: Want to add external HTML code to your page, but really don't want to violate the rule: Thou shaw not open notepad to do any HTML? Well, here's another way. The HTML Markup option allows you to not only insert HTML, but also, Javascript or any other external code to your FrontPage-made page. There's also another good reason to insert code this way, that is, it keeps all external code organized and tucked away in this neat little container.

If you may wish to delete this external code in the future, it saves you a lot of time and pain -you don't have to open notepad and dig through the mess to delete it, and also, since everything within this yellow container is independent of all other code, rest assured that if it ever occurs that you're going to modify or delete it, no harm will come to your existing webpage. (Unlike if you're unfamiliar with HTML, and tried to delete it in notepad.) Ok, lets give two examples of "external" codes-An HTML and a JavaScript code that you may wish to add to your page someday using HTML Markup.

Lets say you want to add the HTML code below that'll open another window when you click it. Here's the code:

<A HREF="http://www.cnn.com" TARGET="resource window">Click here to open another window and go to cnn!</A>

Credit for code goes here.
If you want to add this code (which opens another window and takes you to cnn, do this: Position the cursor to exactly where you want the code to be inserted. Click insert, HTML markup. A box will pop up. Enter (cut and paste) the code into the box, and click ok. When you view the page in the browser, this is what you'll see right after the cursor position:

Just to make it clear that HTML isn't the only thing you can insert using HTML Markup, lets add a JavaScript code, which is what you're most likely insert for the most part, since there're so many pre-made javascripts on the web which you can just cut and paste into your page.

<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
<BODY onLoad="startclock()">

<form name="clock" onSubmit="0">
<INPUT TYPE="text" NAME="face" SIZE=11
VALUE ="....Initializing....">
</form>

Credit for code goes here.
To add this code to your page, simply copy this code into your clipboard, click insert HTML Markup, and paste the whole thing into the box. You're done.

Meta Tags: Meta tags are lines of code that are inserted in between the <head> section of your page that help search engines find and categorize your site, assuming you have submitted your site to the various search engines. FrontPage supports the input of Meta Tags. Many sites now use it, including commercial sites such as GameSpot and Cnet. Meta Tags have two fields: "keywords" and."description". You enter in the "keywords" field keywords that search engines will than use as words that will lead others to your page when others enter them during a search.. Ok, if you entered in the "keywords" field: " JavaScript, Graphics, web resources, FrontPage help," when search engine users enter in "JavaScript " in hopes of finding something pertaining to that, your site will likely pop up, since you have told the search engines to correspond the word "JavaScript", among other keywords, to your site. "Description" tells search engines what description to give your site once it displays it. If you're still not too clear what's going on, don't worry, I will give an example below that'll clear things up for sure. Before we move on; Meta Tags are not all powerful codes that will guarantee that everyone can easily find you on popular search engines (since some search engines don't support it, and also, so many sites now utilize Meta Tags), but they are for sure better than nothing. Lets insert Meta Tags via FrontPage now:
To input Meta Tags, right click mouse anywhere within the page, and select Page properties. Ok, after doing so, select Custom on top. What you see now are two fields: System Variables on the top, and User Variables below. We will be working with the USER VARIABLES ONLY when inputting Meta Tags. Ok, so to add Meta Tags, click add beside the User Variable field.

Now, we will first input the "keywords" part, in an attempt to categorize this site. (My site)

After pressing ok, we're ready to add the "Description" part of the Meta Tag. To do so, click Add again.

ImageComposer-an introduction : ImageComposer is a powerful graphics program that is integrated into FrontPage97. For those with the older version, this section will not be of any help..if you do have ImageComposer though, this section will only touch upon the basics of IC, so please don't expect too much out of this tutorial. OK, to begin this tutorial:
Click Here