 BlackPurple--StdMockupCFG
|  BlackYellow--StdMockupCFG
|
-- Back To Top of This Page --
Step 3. Run The 21UpdaterCustomizer
To run the program, begin with the start button at the lower left of your screen. You'll find the program as:
Windows Start >> Programs >> IHS Software >> 21Updater-Auto >> 21UpdaterCustomizer
The program will identify itself by displaying a screen like this:
If you click on the stop sign, the program will terminate without doing anything.
If you click the Green-doorway logo, the program will move to its next step which is where you tell it which configuration file you want to use. This will look something like the graphic shown below:

Scroll the selections down and choose the configuration file you picked out when you selected the color you wanted (above). Click on this file to highlight it and it will show up in the "filename" text box. Then click the OPEN button to move to the next step in the program.
Let's take a moment and note a couple of things before we begin. There are small "?" bubbles on the form. Click on any one of these and you'll get a little help/information message to help you know what's needed for its associated entry. Notice, too, that the text entries on the screen are disabled (grayed out) at this point. Finally, notice that this program has 3 steps of its own. The first of these is to select the files in the template you want to use--remember step one above? Step two will be to enter your company's data in the text boxes on the form. Step three will be to save your template file and apply it to your files, thus building the "raw" version of your website.
Click on the Step 1 button (upper-left) to specify what files are in the project. This will open a form that looks something like the one shown here.
Take a quick look at the files listed in this form. You'll notice that they are all in the Template directory. This indicates that your website will be built using the first template layout. If you want to use one of the other template layouts available to you, click on the "Clear" button. Then click the browse button (with the eye glasses) to add files to the list. This will open a dialog box something like the one shown below:

Notice where the cursor arrow is shown on this graphic and click the drop-down arrow. This will produce a screen like the one shown below:

Move your cursor to 21Updater-Auto as shown in this graphic so that 21Updater-Auto is highlighted (as shown) and then click it.
This will allow you to select and click the Template, Template2, or Template3 folder. Once you've done that, click on the OPEN button.
Click on the first, i.e., topmost, file in the resulting list. This will cause the file to be highlighted. Now scroll the box down until you see the last file in the list. Press and hold the SHIFT button while you click on the last file in the list. All files in the list should now be highlighted. If they are not, scroll back to the top of the list and try again.
Click the OPEN button and you should see the files you selected in the 21Updater Files Selection window. Verify that you got what you wanted and then click the green-door button to move to the next step in the program.
Now click on the Step-2 button to "Fill in the form below." Note that the text boxes on the form are now enabled so you can work with them.
Begin with the "Title line for your website." This line is very important so far as search engines are concerned, plus it will show up at the top of site visitors' browser window for them to read. Use the key words you believe people would use to find your site and say something that makes sense to a human being as they read it--a short sentence is good. Never waste this space with something like, "Welcome to our site."
Next, type a couple of description lines that your customers will see when they find your website in a search engine. To get an idea of what you need here, go out to your favorite search engine and search for one or two of the key words you think you'll use. Read some of what your competition says. Notice how long (or short) the lines are before they are truncated. Now write a short description that will fit in that area and draw people to your site.
Now enter the key words you believe are important for your website--the words you think people will be searching for when they get a "hit" on you website. Enter each of these key words in one of the key-words text boxes. Use the plural for nouns, i.e., use cars, not car. The search engines are smart enough to use this properly.
Next is the "Cursor Tail Text" entry. This is the text that will follow your cursor as it moves around your web page. Keep it short and simple.
Now comes the "Local path to your logo file." You can click the browse button (eye-glasses) to browse to the file you've saved on your local hard drive. Remember this should be a .jpg or a .gif file. The file should also be approximately the size needed on the top of the form--about 300 pixels wide by 200 pixels high. If you use a huge file, it will slow downloads to site visitors to a crawl and many will just leave. If the logo file is too small, it will pixelate and look terrible to visitors...not exactly instilling confidence and trust in your company or product. When you click the browse button, you will see a scren something like this:

Use the browse button on this form to select the image you want to use as your logo--it will show up in the window to help you know you have the right image selected. Notice that menu options will allow you to resize and/or rotate the image as needed so that the image you use is the right size. When you're finished, simply hit the Green-door to move on.
We'll assume you just want to use the colors in the template, but you can feel free to experiment with other colors and combinations, too.
If you want to use a different picture file (we used the American flag), browse to that file next. Again, you will see an image something like this:

This screen will allow you to browse for the image file you want to use, and then to resize the file, as well as rotate it if appropriate. Once you're finished, it will also copy the file to your 21Updater-Auto/images folder. (NOTE that the file in question must be in the 21Updater-Auto/images folder or it won't show up on your pages.
Move to the lower-right of the form and enter your domain name and your company's name in the indicated text boxes.
Now you're ready to move to the next step. Click the Step 3 button to "Apply the Info below to your files." You will be asked the name of the configuration file you're saving. DO NOT just click the "Open" button as this will over-write the canned configuration file you've chosen. We suggest you name it something like "MyCompanyCFG" so you can recognize it easily. Now you will see the files quickly go by at the bottom of the screen and then you should be told that the job completed. At this point, an IE window will be opened and will show what your new website will look like--less contents, of course. At this point, you can go back and make minor changes in the configuration parameters you've used as necessary. Just type in your changes and then click on the Step 3 button again until you get it like you want it.
Now you're ready to close this program. Just click on the green-door button. You'll be given another chance to save your configuration file. If you've changed it since you saved it, do so. If no changes have been made, click the CANCEL button to simply end the program. Your "blank" website is now saved on your hard drive.
-- Back To Top of This Page --
Step 4. Start The 21Updater-Auto Program
- Use START -- PROGRAMS -- IHS Software -- 21UpdaterAuto -- 21Updater to start the program.
- Anytime this program starts, you will be shown the startup screen where you need to load the coniguration. This screen looks like this:

- When you click on the active button to "load configuration," you will get a "load .cfg in file:" dialog box. Select your configuration, the one you saved at the end of your 21UpdaterCustomizer run, and then click the "Open" button. Notice that the other 2 large buttons on the 21Updater screen are enabled (showing color).
-- Back To Top of This Page --
FTP Configuration
The first time you start the program there will be a few things to do that you won't have to do again. One of these is to configure the program for your FTP uploads. The FTP information comes from your web hosting vendor and you should receive it when you purchase hosting. If you did not, call their technical support number and tell them you need the FTP host-server and account information. They have to give you the server ID, your FTP account ID and password.(Be sure to store your FTP information somewhere safe because anyone who has it can change what's on your site.)
Now looking at the screen, you will notice the menu bar. Click on Edit >> FTP configuration. This will bring up a small window something like the screen at right. The IP address shown is typical of what the hosting vendor will give you for your FTP connection, though they may just as easily give you a name, i.e., ftp.xyz.com or ftp.yourdomain.com. Enter your FTP ID and password in the spaces shown for that--case counts, so enter exactly what the hosting vendor gave you.
Finally, you must enter the directory information for where your files will upload. The setup shown here is for a NetworkSolutions web site, but yours may be different. Ask your hosting vendor for a little help here if you need it. Just tell them you're setting up an FTP client to work with their system. Get the path right for your .htm files, then add "images/" to it to make it work with your images. When you're done, hit the green door to close the window.
Now, use FILE >> SAVE Configuration on the menu and save YOUR configuration file--the same name.ext you used in the 21UpdaterCustomizer step above.
NOTE:You need to create your "/images" directory on the remote server before you can use it. This needs to be done using a separate FTP client.
-- Back To Top of This Page --
21Updater-Auto Home/Front Page Content
Once you have started the 21Updater-Auto program (see paragraph above) the "Edit Front Page" button will be enabled. Click it and you will move to the next screen which looks something like this:

Take a moment to study the screen. Items shown in bright-red boxes should not be changed unless you really know what you're doing. We won't discuss them here. Most of the right-hand side of the screen is a picture-box to show the picture you've specified, so we'll just ignore that for now and concentrate on the left-hand side where the real action takes place.

Take a second to notice the little "i" bubbles on the page. Clicking on these will give you a quick information/help message about the item the bubble is connected with.
Also, look at the 6 buttons along the bottom of the form. They are:
- Restore using last backup -- If you've backed up the front/home page using the next page over, you can hit this page to return to the page as it was when you backed it up.
- Backup the web page -- This will make a backup copy of the page in case you screw it up. We recommend that you always back up the page before making changes to it. It only takes a second and can save you lots of grief.
- Build Web Page -- Once you have the enries on this form as you think you want them, click on this button to make the indicated changes on your hard disk.
- View In Browser -- This button will show you the default.htm page as it is curently stored on your hard disk in the Microsoft Internet Explorer browser.Remember that you're looking at the page as stored on your computer's hard drive.
- FTP Upload (Gears) -- The Gears will always be on a button where you can upload either the .HTML or the image that the button is associated with. In this case, since it is not associated with an image, it will be for the .htm page.
- Green Door -- This will terminate the program, giving you a chance to save your changed site configuration file.
As you can see, some of the buttons are not enabled. You have to backup your existing .htm page before you can "Build Web Page." File upload will only be enabled after you have hit "View In Browser." This is intentional and is designed to help keep you out of trouble.
Notice the tabs section of the form--it's shown in a lighter color than the rest of the form. We'll concentrate on it next, but for now we're skipping over it to look at the bottom 1/2 of the form. First, look at the "Alt= data" box. Search engines can't look at images. Period. But each image can have an alternate text associated with it and search engines do look at that text...the text you can enter here in this text box. In general, use your company name and your key words in this box.
The next text box on the page as we move down it is the "Local Image Folder." The default location for your images is
c:\testwebsite\21Updater-Auto\imagesand unless you're sure you know what you're doing, you should leave this entry unchanged. Notice that all the images you use on your website MUST be saved (on your hard drive) in this location if the program and your web site are to work properly.
The next text box on the page as we move down it is the "Local Page File Path." The default home page for your web site is
C:\testwebsite\21Updater-Auto\default.htmUnless you know what you're doing, please, don't change this entry.
Now note the tabs on the form. The form opens with the "Monthly Spcl" tab opened. This deals with the top portion of your home/front page. Basically, what you'll enter here most of the time is the name and text associated with your monthly special automobile. We'll come back to them in a moment. Since you will have a different text box (here) for the monthly special, you can enter something here about your monthly special auto. You can change this anytime you change the monthly special to show a new car. This will give you a small improvement in your search engine optimization efforts.
Now, look at the two remaining text boxes in this group. The image file we ship with is the beautiful red Ford GT250 which, by the way, is ©2007 by IHS, Incorporated. The picture used on the home/front page as the monthly-special image is named "fordgt250.jpg" and that's the name you'll see there. Just for fun, click the small gray button next to the image name and note that the picture shows up in your window's picture box. You can change your image to your image file name, but remember, it must be saved on your hard drive in the folder we discussed above. While you're at it, notice that you can use the browse button (with eye glasses) to look for where the file is located on the hard disk. Click on the browse button for the image so you see the Image Browser page. It will look something like the page shown below:

With just a couple of differences, this page looks like the one you saw in the 21UpdaterCustomizer. That's because it is. But, note that we've added a couple of things to it:
- We've added an FTP-upload button (Gears again) to the page. This will upload the image to your remote server if you click it. Notice that it will use the image file shown in the lower textbox when it does this.
- We've also added entries for width and border-width. This window can be used when you're working on other pages to generate an HTML "<IMG" tag. Don't let that worry you if it sounds like greek, just be assured that it will help you later on. For the front page work, you can just ignore these two fields.
You'll also see the "Monthly Special 'Title' text" textbox. We recommend just using the model and name of the vehicle here.
So, for your first time in this program:
- Configure your FTP (Done above and only done the first time in or if you change web hosting vendors)
- Click the "Backup The Web Page" button.
- Now change your 2 ALT= entries on this form.
- Click the "Build Web Page" button. (Click cancel on the backup question--you've already done it.)
- Click the "View in Browser" button.
- Now use CTRL+Tab to move to the browser window. Inspect the web page to be sure everything looks OK. If it does NOT, CTRL+Tab back to the program and click the "Restore using last backup" and try again. If it does look OK, CTRL-Tab back to the program and click the "Backup The Web Page" button OK.
For the next step, you'll need to have an image file suitable for your monthly special picture already stored on the hard disk in your images folder. As an example here, we'll use "YourPic.jpg" to represent the name of the picture file. We'll assume the vehicle in question is a "1964 Your Coupe." You'll just substitute your picture-file name and vehicle description where we use this.
- Click the "Backup The Web Page" button if you haven't already done it.
- Place your mouse-cursor in the text box labeled "Monthly Special Image File Name." Type YourPic.jpg in this box.
- Place your mouse-cursor in the text box labeled "Monthly Special 'Title' Text" and type in "1964 Your Coupe."
- Now change your Monthly Special ALT= entry by adding "Your Coupe" to it.
- Click the "Build Web Page" button.
- Click the "View in Browser" button.
- Now use CTRL+Tab to move to the browser window. Inspect the web page to be sure it looks OK. If it does NOT, just CTRL+Tab to return to the program and start with step 2 or 3 above again until you get it right. If, by some mistake, you really, really screw it up, use the Restore button.
That's it for the monthly-special part of your home/front page. Now, what about the 21 small images that are below the monthly special? In order to reference the images, we line it up with 3 columns. Each column is keyed to a column-tab on the program's form. Click on the tab labeled "Column-1" and notice the tabbed portion of the screen changes to something like this:

There are 7 rows on the front/home page and these are numbered as 1 through 7.
| Row | Col 1 | Col 2 | Col 3 |
| 1 | 1x1 | 1x2 | 1x3 |
| 2 | 2x1 | 2x2 | 2x3 |
| 3 | 3x1 | 3x2 | 3x3 |
| 4 | 4x1 | 4x2 | 4x3 |
| 5 | 5x1 | 5x2 | 5x3 |
| 6 | 6x1 | 6x2 | 6x3 |
| 7 | 7x1 | 7x2 | 7x3 |
You should already be able to guess what goes in the text boxes on this form--image names (for your small pictures) and auto "Year-Make & Model" entries. Now, again notice that all the images you use on your website MUST be saved (on your hard drive) in the same images folder as discussed above or they will not show up on output. You can use the now-familiar browse button to help find and resize the image file. You can also use the Gears-button to upload a particular image to the remote server. (You can also use the small gray button next to the image name to refresh the large presentation of the image that shows up to the right on the window. Remember that these are small images and they won't look as clear and sharp in the large picture box--that's normal and is OK.)
Before you start making changes, click that "Backup" button.
What if you don't want to show all 21 images? Just leave the image file and its text entry blank and they won't show up on the output. For the best looks, we recommend you fill up lines until you run out of vehicles to sell.
Once you have a vehicle image and description like you want it, use the "Build Web Page" and the "View In Browser" buttons to be sure it looks like you want. As before, use CTRL+Tab to move to the browser window. Inspect the web page to be sure it looks OK. If it does NOT, just CTRL+Tab to return to the program and start with step 2 or 3 above again until you get it right. If, by some mistake, you really, really screw it up, use the Restore button.
Repeat this procedure until you have all products' pictures and descriptions as you want them, including any that you are leaving blank. Remember you're only looking at Column 1...you have 3 columns to work with. (See the layout table above.)
Once you have the images and descriptions defined, your front/home page is ready to upload. BUT remember that for each of those vehicles, there's a page that describes it more fully. Moreover, there's still the general-content pages for things like "About Us", "Contact Us", etc. That's in the next section, just below. Since you're finished with this page, click the Green-door button to exit the page. Save your configuration button again.
-- Back To Top of This Page --
21Updater-Auto General Content Pages
Once you have started the 21Updater-Auto program (see paragraph above) the "Edit Other Pages" button will be enabled. The first time you are ready to update content on the "other" pages, you want to get back to the form that looks like this:

and use menu item EDIT -- Files Configuration. This will bring up a form similar to one you've already seen while you were using the 21UpdaterCustomizer program. Look at the screen and if, as it should on the first run, it shows template files, you'll need to point toward the locally-stored website files instead of the template files. Click the "Clear List" button and the list of template files will disappear. Now click the "Add files" browse button (eye glasses). Navigate to the point where your website files are stored--the default is
c:\testwebsite\21updater-autoUsing the mouse, click the 1x1.htm file. Scroll down to the last .htm file, SiteMap.htm. Hold down the shift button while you click the SiteMap.htm file. All the .htm files should now be highlighted. Click the Open button and the list of files should be in your Files-Selection list. Click the Green-door button to leave the form. Save YOUR configuration file as you exit from this form.
Now and every subsequent time you enter the program, click on the "Edit Other Pages" button. This will move you to the next screen which looks something like this:

You have two options. If you can find the file you want to work on in the list, just double-click on it to edit it. If you can't you can get a better listing by using the "Select File To Work On" button. Find the file you want in the list and double-click on it to edit it.
Let's begin with a special page--find the "ContactUs.htm" page and double-click on it. The screen will change to look like this:

Guess what comes next! Click the Backup button.
You'll see your HTML code in the window on the page, but since "Contact Us" is easily defined, you really don't need it yet. Find the "Contact-us page" button that has been added to the top of the form and click it. This will bring up a form like this:

Now you simply enter 1 or 2 phone numbers, your FAX number, your company's snail-mail address, and the email address you're using for potential visitors to communicate with your company.
If you don't want to use a 2nd phone number, a FAX number, etc., just leave the text box empty.
When you have this information in the form, click the green-door button.
Just for your own edification, take a quick look at the newly-generated HTML code and you'll see your entries embedded within it.
Click the button labeled "Finished This File--Save It." Then click the button to "Preview In Browser."
Wow, that was easy! Now, let's look at another special-feature kind of entry you'll make over and over again...the car table.
Click the "Select File To Work On" and this time find file monthly.htm. Double-click it. Now notice that 2 new buttons are showing in the middle of the form. The first is the "Make New Monthly Special" button and the second is the "Car Table" button. The "Car Table" button will show up anytime you are doing a vehicle page. Let's take the 2 buttons in that order--right after we click the Backup button.
If you click the "Make New Monthly Special" button, your monthly special page will be cleared and the current front/home page monthly image will be used as the main image for your new page. Be aware that if you have not clicked the Backup button and you hit the "Make New Monthly Special" button your current monthly.htm file will be irrevocably lost. If you're ready to make a new monthly special page, go ahead and hit the button now.
If you click the "Car Table" button, it will bring up the car table entries currently in use. This will look something like the image at the right.
If you want something different on one of the car table lines, just type it in at this point. Otherwise, click the OK button.
Next up is a screen something like the one shown below:

Here you can fill in the blanks for the items you want to show, i.e., Make/model, body style, etc. If you don't want one of the lines to show up for this particular vehicle, simply leave the entry blank.
For table width, may we suggest that you enter "400px" and a border width of 5. For background color, you can use white. For font color, use a color that contrasts well with the background color--we suggest blue or black on a white background, but some other color may be better depending upon what color combination you've used for your web site.
Now consider the vehicle page you're working on. You have the picture and the car table information. Look at the last few lines on the file. They look like this:
<!--CarTable--> </TD><TD><img src="images/fordgt250.jpg" width=335 border=3></TD></TR></TABLE> <P> <font color="blue" size="2"><B>YOUR SALES PITCH GOES HERE--TELL'EM HOW GREAT IT IS. </TD></TR></TABLE>
|
You can see where we have inserted a picture, our favorite fordgt250.jpg image, to the right of our car table. You can easily type in the name of your own image file where we have fordgt250.jpg--as always, just be sure your image is in the right place (see above). Whether or not you have moved the picture to the proper folder, you can use the EDIT -- ADD IMG TAG AT CURSOR option to build an image tag. see below To do this, you'll have to delete the existing <IMG...> information and place your cursor where it was. Then use the option to insert the <IMG tag for your image as well as copy it to the proper folder if that needs to be done, too.
Now look at the line that says, "YOUR SALES PITCH GOES HERE--TELL'EM HOW GREAT IT IS." What we need to do is type a description and/or sales pitch in this area. You can also put more images of the vehicle on the page if you want. Unfortunately, we've come about as far as we can without a few HTML things--don't worry, what's left is easy. Let's consider a handful of HTML commands that will get you through:
| HTML Command | Information/Usage |
| <i>...</i> | Text between the two HTML tags will be shown in italics. |
| <u>...</u> | Text between the two HTML tags will be underlined |
| <BR> | This is the line-break tag because it causes a line-break on output in the browser |
| <P> | This is the paragraph tag--it will cause a blank line to be inserted in the output in the browser |
| <center>...</center> | This will center the text between the tags on the current line |
| <Hn>...</Hn> | Change the text size between the tags. H1 is the largest. H3 is the norm. H6 is too small to read. |
| build an un-numbered list |
| <UL> | Start the list--be certain you end it when it's appropriate |
| <LI> | List line--start each line in your list with this tag |
| </UL> | End the list |
| build a numbered list |
| <OL> | Start the list--be certain you end it when it's appropriate |
| <LI> | List line--start each line in your list with this tag |
| </OL> | End the list |
Let's consider one last thing--the <IMG tag is used to put an image on the web page. The form for this is shown in the text and is like this:
<img src="images/fordgt250.jpg" width=335 border=3>Notice that you can change the width if you want to, too. Hence, you might use a width=400 in your statement to make the photo render a little larger, or you might use width=200 to make it render smaller in the browser. Again, whether or not you have moved the picture to the proper folder, you can use the EDIT -- ADD IMG TAG AT CURSOR option to build an image tag using the screen shown below. To do this, place your cursor where you want the <IMG tag to show up in your text. Then use the option to insert the <IMG tag for your image as well as copy it to the proper folder if that needs to be done, too. (By now you know you can resize, rotate, and FTP-upload from this window.)

Now, the last thing we might have said about our Ford 250GT could look something like this:
| <P>This beautiful automobile was only driven by a little old lady who used it to go to church twice a year--Easter and Christmas--in rain-free Phoenix, Arizona. Other than that, the car has been garaged since its manufacture date. References are available on demand. |
Don't forget to use the "Finished This File--Save It" button to save your changes. Then always preview the page--it can save you lots of embarassment, trust us.
Now imagine you want to edit one of the other web pages. Let's look at the AboutUs.htm page. The drill should be looking more familiar by now. First click the "Select File to Work On" button and double click the AboutUs.htm page. You'll see only 2 lines that make up the page as shipped. The first is our image file--the American Flag.jpg image file. The second simply says, "Tell them all about your company here."
Guess what button you want to hit next...the Backup button.
Now, use the HTML tags in the table above and build your content that tells visitors about your company. Remember these are potential customers so anything you can say to add credibility is going to help bring business in your door.
When you think you have the page content as you want it, click the button to save it and then preview it. That's all there is to it.
-- Back To Top of This Page --
About Using FTP
Once you have your site or a changed page looking like you want it, you still face one more task. Remember that the site you're looking at is only on your local computer's hard drive. You have to place a copy of it on the remote computer (called a server) before anyone else in the world can see it. That means you have to copy the images as well as your .htm pages to the server. The way we do that is called FTP (which is short or File Transfer Protocol.) To do it, you'll find our simple FTP upload buttons will handle most cases to put files on the web site. However, from time to time, you'll find you have to use a program called an FTP client that will allow you to connect to the server.
We recommend the use of FTP explorer as your FTP client. This is partly because of its similarity to Windows software you're already familiar with. The program is a venerable one that works well without too much learning curve. Of course, there are other FTP clients available and you are welcome to use the program of your choice.
When you setup your web hosting, you received an FTP logon site, an FTP account and an FTP password. You've probably already used this to configure the 21Updater-Auto program and you can use EDIT >> FTP Configuration (See above.) (Be sure to store your FTP information somewhere safe because anyone who has it can change what's on your site.) Now, use this same information in the FTP client you've chosen. Use it to logon to the hosting server. The first time you logon, you'll need to create an images folder and a 21UpdaterFiles folder. For each of these folders, upload the files from your hard drive to the remote server, being sure to upload the files to the same folder on the server as they are stored under on your computer's hard drive. Since you're uploading a number of photos, this first time will take several minutes to complete. (Normally, you'll only be uploading one or two files, so it won't take so long.) Now upload all the .htm, .js, .jpg, and .gif files from the c:\testwebsite\21update-auto folder on your hard drive to the main folder on your server. Finally, if there's an index.htm file in the main folder on your server, delete it.
Now, to be sure everything works right, open IE and visit your website. If you've uploaded everything, you'll see it at work and so will anyone else on the world-wide web who visits it.
-- Back To Top of This Page --
©2007 IHS, Incorporated--all rights under all applicable copyright laws reserved.
ITSBITS® is registered in the U.S. Patent and Trademark Office as the property of IHS, Incorporated. Office® is a registered trademark of the Microsoft Corporation.