How To Add New Props To Your Double-Click DollMaker
This tutorial will provide you with the information you need to successfully add more props to your double-click dollmaker. This tutorial and all images are © 2001-2002-2003 by www.DollieGirl.com
  • It's not hard...
    Greetings, and welcome to the tutorial! Adding new props to your dollmaker isn't hard, but it's important for you to carefully read and follow the instructions to ensure you don't accidentally change critical script components. A boo-boo like that could lead to a dollmaker that no longer works, and that's no fun for anyone!

  • Already an expert?
    If you are already quite expert at creating and editing html pages, the dollmaker code is well commented, and probably already contains all the instructions and help you will need.

  • Still learning?
    If you're still learning, or just want to be sure you're taking the right approach, grab a cup of tea, settle back in your chair, and get ready to expand your knowledge base.

  • A very important "don't"...
    OK, first things first. Please, please, please, what ever you do.... *don't* use or try to use a helper application like Front Page or Easy Designer to edit your dollmaker code. Programs like that can cause unseen changes in the code that will cause improper functioning, or leave you with a dollmaker that doesn't work.

    Yes, that's right. It's time to step up and face your code, mano-e-mano. But, don't be afraid. We'll take you through it step by step.

  • Please do...
    OK, if you can't use a helper application to edit your code, how do you edit it?

    You have two choices... you can use the good-old-standby "Notepad", that comes with every Windows computer, or you can use an html editor such as EditPlus.

    DollieGirl has used EditPlus for years, in fact, all of MyCartoonDolls.com was coded with EditPlus. EditPlus is a shareware program, so you can try it for free. If you like it and decide to purchase it, you'll find it to be a real bargain at a mere $30.

    An html editor like EditPlus can offer you some advantages, like a browser preview and color-coding so you know your code is correct, but anyway, enough about that.

  • We'll Use NotePad
    For purposes of this tutorial, we will use NotePad.

    NotePad comes with every Windows computer, you will most likely find it under your "accessories" group. Be sure you use NotePad and *not* WordPad. WordPad won't work.

  • Upload Your New Props
    Let's talk about your new props.

    Be sure they are the right format (transparent gif files). Putting your new props in the same folder where you have your "old" props will make testing changes to your dollmaker easier. This tutorial assumes that you've done just that... you've put your new props in to the same folder on your computer as your "old" props... and all of them are in the same folder with your dollmaker code file (which is called doubleclickdollmaker.html).

    OK... now, upload the new props to your web site, just like you did with the original "old" props that came with your dollmaker. Be sure you upload them to the same folder or place on your web site that you put all of the other props.

    Be sure you make a list of the prop names, so you can add them. It's very important to get the file names correct. Got a list? Great!

    Everything ready? Terrific! On to the next step.

  • Organize Your Prop List
    OK... Of course, you want the natural layering in your dollmaker to function properly, so it's important for you to put the new props in the right place so that natural layering will continue. You don't want to end up with a dollmaker that sticks the wings on the front of the chest, now, do you? I didn't think so. *smile*

    The props that came with your dollmaker were already organized for natural layering, to help guide you in adding new props.

    So, on your prop list, be sure that you note which props go where - top of page = back of doll, bottom of page = front of doll.

    As an example, the wings go towards the back of the doll, so they are at the top of the props on the page. Then the doll torsos, tops, pants, dresses, etc., ending with the things that go in the front, like the heads and hair.

  • Open your dollmaker code page
    OK, crank up NotePad, and open the file named "doubleclickdollmaker.html".

  • Add Your First New Prop

    Let's say you've got a really cool new background you'd like to add.... its file name is "newbg1.gif".

    That goes in the back, right? In fact, it goes really really in the back, even more in the back than the wings.

    So you'll want to add it to the top of the page, and before the wings.

    So, let's find a quick way to locate where the wings go in the code.

    Click on "Search" then "Find" in the menu of Notepad.

    When the "Find" window opens, type in "wings", then click the "Find Next" button.

    Presto, you will be popped down to where the wings are coded in.

    See that line that says "<img src="wings101.gif" class="drag">"

    Copy / paste it so that you have two of the same line....

    Then, edit the first one so that it has the name of your new background prop (remember, that was "newbg1.gif") instead of wings101.....

    OK, you've made a change to your code. What do you do?

  • Save and Test
    OK... this "save and test" process will only work if you've put your new props in the same folder on your computer as your "old" props....

    First, save your work. Using the NotePad menu, click "File" and "Save As". Be sure to save the new version of the code in the same folder on your computer as the props, otherwise, your test won't work properly.

    When you do this, NotePad will tell you that a file with that name already exists, and will ask if it's OK to replace it. The answer is "Yes". Click the "yes". But... wait! Don't close down NotePad, just leave it open, because we're going to add more props.

    OK... now, crank up your browser (internet explorer). In your browser menu, click "File" then "Open".

    When the file open window appears, click the "Browse" button and browse to your doubleclickdollmaker.html file that you just saved.

    Once you've got the file name in the "open" window, click "OK".

    Your dolllmaker should open, with the usual little alert box asking you to read the instructions. Just click the OK on the little alert window like you usually do.

    Go ahead, be brave - double-click your newly added background. It will pop up to the Creation Zone.

    Now, double-click a pair of wings... they will also pop up to the Creation Zone.

    Well, look at that! It worked! You're a genius!

    Hey... wait a second... does that look a little awkward? That big background right next to the wings, sort of pushing them out of the way?

    No problem. Let's add a "break" to move the wings down to start a new line.

    Back to NotePad... But!!! Don't close your browser yet... just leave it where it is, we'll use it again...

    Add a code tag of <br> between the background and the wings, like this:

    Save the file like we did before, pop back over to your browser, and click the "refresh" button (or just press F5 on your keyboard).

    There we go. That looks better.

    OK, now what? Tops, you say? You've got tops to add? No problem. You can handle it.

    In NotePad once again, click "Search" and "Find" and type in "top". Click the "Find Next" button.

    Bam!

    No, no, wait... something is wrong..... this says "grayskirtop.gif"... and it's in the "dresses" section. We wants to go to the tops section. What's up with dat?

    Don't panic.... Just click the "Find Next" button again...

    Bam! Ah.. that's better... here we go... "bluediamondtop.gif"... now we are in the tops, and you can add your new top using the same process that we did before. Just copy / paste the "bluediamondtop.gif" line, modify it, save... test...

    Woohoo! Look at you go! You're adding new props like a pro. And you didn't need no steenkin' helper application either. Nahnahana! Easy Designer can kiss your booty!

    New props all added? Wonderful...

    Now all you have to do is upload your newly modified code to your web site, just like you did the first time.

    Don't forget to check it out to be sure everything still works.

    Oops... Uh oh.... you uploaded your new code, and one of those stupid annoying little red Xs showed up where a new prop should be?

    Don't panic, check... are you sure you uploaded that prop? Oops... forgot that one, huh? *grin* No problem, upload it, and life will be good.

    Have fun.

    Blessings

    		•
    This is a non-profit, educational web site.
    Important Site Info
    All html code, logos and other content on this site are © 2001-2002-2003 by www.MyCartoonDolls.com and www.DollieGirl.com, and is the exclusive intellectual property of the site owner, publishing under the screen name of DollieGirl. All Rights Reserved. Any re-use or re-distribution, in whole or in part, even if modified, is strictly prohibited and will be prosecuted.
    All dollmaker code, functions, individual functions, elements, and javascript contained herein on this site is the exclusive intellectual property of RLDuckett and is © 2001-2002 by SpringBird Inc. All Rights Reserved. Use of the linkware double-click dollmaker code is valid only when used according to the terms and conditions of use, and when all copyright information and credits to the developer are left fully intact and visible. Re-distribution, in whole or in part, even if modified, on any other site, is strictly prohibited and will be prosecuted.