Custom Link Graphics!

If you have more than one site with us or you'd like to link to any other site from your Baby's First Site web page, you can create custom link graphics with just a few simple lines of code.



You choose the text and place it right in the code for a completely custom button that links to anywhere you choose.

The following code was used to create the button in the example above:

<div id="sitelink_bigboy"><br /><div class="sitelink"><a href="http://www.babysfirstsite.com/Brandon">Click here to visit Brandon's web site!</a></div></div>


1. This is where you'll place the ID of the button style you'd like to use:

<div id="sitelink_bigboy">

There are 6 button styles currently available:

ID = sitelink_whitediaper


ID = sitelink_pinkdiaper


ID = sitelink_bigboy


ID = sitelink_biggirl


ID = sitelink_blueplain


ID = sitelink_pinkplain


2. Change this address to the address of the site you'd like to link:

<a href="http://www.babysfirstsite.com/Brandon">


3. Change this text block to the text you'd like on your button:

Click here to visit Brandon's web site!</a>

For a 3 line button, remove the <br /> in the example code. If you use too much text, your text will run off the button and you will need to trim it to fit in the space. More button styles will be available soon!

Logo Kid Images

Our popular logo kid images can be used on your web site, too. Just click the link below to find the image or images you'd like to place on your site, e-mail or blog post.

http://www.babysfirstsite.com/blogger/logokids/logokids.html

Right click the image you'd like to use, then copy the Address/Location of the file. Paste the address of the image in the code below:

<img src="address-of-photo-here">

Then place the code in any custom text area on your site!

You can use basic HTML to add decorative text to your images, too:

Brandon Connor

The text above was created with this code:

<font face="arial" color="navy" size="4">Brandon Connor</font>

Check out this basic HTML guide for more details.

Additional Home Page Photos

If you'd like a larger main image or multiple images, you can pull images directly from your photo albums to display on your home page.

If you'd like to replace your main image with a larger photo, first uncheck the "show image" check box in the left side customization area.

Then paste the following code in the custom text area where you'd like your image to appear:

<img src="LocationOfYourImageHere"/>

Next, find the photo you want to use in your photo album and copy the location (right click the photo and select "properties" from the menu).

Paste the location of your photo in the image tag.

You can place the code in your "Page Title" section so that it will be the very first thing on the page.

For bordered images, you can apply a CSS class to your img tag like this:

<img class="photoalbum" src="LocationOfYourImageHere"/>

That puts a neat border around any image of any size.

Free Photo Hosting

If you have photos you'd only like to use on your home page and would prefer to have your HTML code generated automatically, you can take advantage of our free photo hosting service at http://www.holdthatpic.com.

You can upload single images or sets of images and our software will generate all the code you need to immediately post your photos on your Baby's First Site home page or anywhere else on the web!

Additional Web Sites

You can maintain up to 4 web sites on your account at no additional charge. To have additional sites set up for other children in your household, simply send the following information to support@babysfirstsite.com.

* Your User ID
* Child's full name (if you have one)
* Birth or Due Date
* Web address you'd like to use

Photo Management Primer

There are 2 ways to delete photos. First, you can go into the "Add Captions" section of your album, where you can see the thumbnail view. Under each image is a "delete" button that will delete the image from your album.

You can also access the "File Manager" in your site profile section. This method is a a bit tougher because it does not show thumbnails, but will allow you to delete a photo if you don't know which album it is in.

You can add photos from one album to another album in the "Add Captions" section, too. At the top of the page there is a section labeled "Add Photo" where you can select any photo you've already uploaded and add it to the album you're currently modifying.

You can delete entire albums and either delete their contents or move all photos to another album in the "Rename/Delete Album" section within the album you'd like to delete.

Neat tip: If you have a photo you'd like to use in your home page customization or on another site, but you do not want it to appear in any of your albums, here's a trick that might help:

- Upload the photo to any album

- View the photo on your web site and copy the location of the photo
* in IE, right click the photo, choose properties, and copy the contents of the "Address" field
* in Firefox, right click the image and choose "Copy Image Location"

The URL should look like this: http://www.babysfirstsite.com/members_imag...oname_large.jpg

- Use the "Add Captions" view to delete the photo from your album.

The photo will still remain in your account, but will no longer be visible in your album. Now you can use custom HTML to add that photo to your home page or use it as a forum or e-mail signature!

Column Widths

Your site has 3 main customization areas -- left, middle, and right. If you add extra wide custom content to the middle column, it will stretch the center column of your entire site. Sometimes, this will push the content in the right column off your viewer's screen.

If you'd like to avoid stretching your site beyond a reasonable resolution, try adding your wider custom content to the "Add Ticker" customization box instead of the main customization areas. This box allows you to add content that can fill the entire width of the screen without stretching the rest of your site.

Check out http://www.babysfirstsite.com/bailey and take a look at the pregnancy photo collage. It spans the entire width of the page, but doesn't disturb the widths of the rest of the columns. This collage was added to the ticker area.

It's always a good idea to make sure your site can be viewed without forcing your visitors to scroll to the right. You can do this by keeping the content in each column close to the width of the standard elements. The measurements below are a good guideline.

Left: 400 pixels maximum
Middle: 200 pixels maximum
Right: 250 pixels maximum

Thought Bubble Tip

Does your thought bubble look like this?


HoldThatPic.com - Free Image Hosting

If you find your thought bubble text doesn't fit inside the bubble, keep in mind that you may have to trim your lines depending on the width of the letters you're using.

The bubbles are a bit of a manual process. Since all letters vary in their widths, the content you use in the bubble ultimately decides how many words you'll have space for. We have set a limit on the amount of text on each line, but it's not possible to calculate the width of each letter.

We have provided extra space on the line to to account for narrower letters. If you use words with lots of narrow letters like l, i, or t, you'll have a bit more space to use than if you are using a lot of capital letters or wider letters like m or w.

You may need to shorten the lines of text until they all reside on a single line. Unless your combination of letters is very narrow, you'll rarely be able to use the entire length of the line provided. If you go over into the next line, your content will be uneven and your last lines will overflow your bubble.