Close Window

Print

Integration Guidelines

Put your best foot forward. Review this section (and SBI! Built-in Functions, which comes next) before you start building your pages.

Follow this advice and you won't have to spend extra time later to make them compatible with the Upload Your Own HTML process. Your goal is to achieve the best Search Engine rankings and maximum traffic!

SBI! Integration Guidelines

Please take your time and read the guidelines carefully to ensure that every page you create uploads flawlessly and works perfectly.

Understand that, like any Web host, we cannot support HTML errors (i.e., "Why does my page look funny?") or problems with your HTML editor. We do, of course, support any technical glitches with the actual page-uploading/re-uploading process.

And you can also "help and be helped" at the special SBI! Forum dedicated to HTML...

http://forums.sitesell.com/viewforum.php?f=8

Ready to begin?

In a nutshell, here are SBI!'s uploading and integration "rules" (detailed instructions will follow)...

• All HTML files must use the .html extension (not ".htm") or SBI! will not allow you to upload your page.
  

  Unlike in SiteBuilder, you must add the extension to every file name.

• Place all your images in a folder called image-files.
  Supported image file types: .gif, .jpg, .jpeg, .png

• Place all media files in a folder called media-files.
  Supported media file types: avi, .mov, .mp3, .mpeg, .mpg, .pps, .ppt, .qt, .wav, .wma, .wmv

• Place all other supporting files in a folder called support-files.
  Supported support file types: .css, .exe, .flv, .js, .pdf, .swf, .txt, .xml, .zip

• Your HTML files will go at the root (same) level as the image, media, and support folders (see below for details).
• SBI! will not accept any file types other than those listed above.
• Important note: Do not create any other additional folders or nested folders (a folder inside another folder).

Here are the detailed instructions for duplicating the SBI! site structure on your computer...

Setting Up Your Local Folder Structure

On your computer, create a "root folder" and label it the name of your domain (ex., "anguilla-beaches.com"). Now create three other folders inside your root folder...

• image-files folder
• media-files folder
• support-files folder

Upon completion, your folder structure should look like this...

Local Folder Structure Checklist and Tips

• Do not create any additional folders, or any nested folders (ex., do not create a new folder called "baby-movies" and place it inside your media-files folder). SBI! will not accept them. All image, media and supporting files must be called directly from one of the three folders listed above!
• Absolute-reference the files (ex., top.gif) for any Thank You pages that you create for Form Built It! forms and for any MailOut Manager customizable pages you create. These pages are created "on-the-fly" by SBI! and do not reside in your root folder on the SBI! server. Also do this for your Content 2.0 utility template. If you customize your RSS box, absolute-reference the button images as well.
• Do you want to use Cascading Style Sheets (CSS) for your site? Click here for more information about how to use CSS with SBI!.

Now let's cover the details for each file type, and where you must place them in your folder structure.

HTML files

Create and edit all of your HTML files (adding the ".html" extension to each of them) in the root folder. This matches the "root level" where SBI! builds all HTML pages, and where your HTML files go when you upload them.

For example, if you add two HTML files to your site, your folder should now look like this...

Images

All image files (.gif, .jpg, .jpeg, .png) must be placed in the image-files folder that you created above.

When correctly inserted into your page, you will be prompted to select and upload these images in Step 3 of the Upload Your Own HTML process.

Tips

• When creating your HTML pages, relative-reference your images, and make sure that image-files/ appears before each file name, like this...

  <img src="image-files/myimg1.gif">

  Relative referencing ensures proper display of your images when you preview pages in your editor or locally in your browser (use File > Open to view files locally).

• Add width and height dimensions for each image, along with an alt attribute description (using your main page keyword in the alt text may give you bonus traffic from image searches). You could also add (optional) a title attribute -- title="description of the image" -- which displays a short "tool tip" message in a small yellow window when visitors hover their mouse over the image (this works in all browsers except Internet Explorer, which is the only one that displays the alt attribute text).

  So a complete image tag might look like...

  <img src="image-files/beach-sunset.gif" alt="Anguilla beach at sunset" title="Anguilla beach at sunset" width="250" height="180">

• Images you reference in a CSS stylesheet file will also be found, and you will be asked to upload them, if you store them in the image-files folder. You can absolute reference these files or relative reference them using "../image-files/."

  If you edit an image that you reference in your CSS file (ex., make the background darker, or change the image completely but keep the same file name), you can use Quick Re-Upload It! to upload the file. However, if you change the file name in the CSS file, you will need to edit an existing page, or upload a new one, to be able to upload the new image.

• Before uploading, verify that all image references are correct. If you do not reference your images correctly, SBI! will not be able to ask you to upload them in Step 3.

• If you need to edit any of your images (resize, crop, add a watermark, etc.), Picnik is a free browser-based graphics system that lets you do just about anything you need to do to an image. For instructions on using Picnik, see this TNT article...

  http://sbitips.sitesell.com/picnik.html

Media Files

All media files (.avi, .mov, .mp3, .mpeg, .mpg, .pps, .ppt, .qt, .wav, .wma, .wmv) must be placed in your media-files folder.

When correctly inserted into your page, you will be prompted to select and upload these media files in Step 3 of the Upload Your Own HTML process.

Tips

• Relative-reference all of your media files for easy previewing and/or testing.
• The HTML coding of these media files is dependent on the type of media and options that you want to use. If you do not know how to add a particular media file (or its coding options) into your HTML page, visit the Audio, Video, Flash, XML/RSS, Other forum, where you will get excellent help and advice from some of SBI!'s resident experts.

Supporting Files

All supporting files (.css, .exe, .flv, .js, .pdf, .swf, .txt, .xml, .zip) must be placed in your support-files folder. Like the rest of your files, you should relative-reference your supporting files when coding your HTML page. Do this, and your pages will preview correctly on your computer before you upload them to SBI!'s servers.

When correctly inserted into your page, you will be prompted to select and upload these support files in Step 3 of the Upload process.

Automatic Tracking (Outgoing) Links

One of SBI!'s features is built-in tracking for each link that you create that goes off of your site (outgoing). SBI! will automatically re-code all of your outgoing links in order to track and report the Click Through Rate. These stats are reported in the Click Data section of the TrafficCenter in Site Central, and also in SiteSell's Value Exchange (if applicable).

Let's say, for example, that you have an affiliate link to refer visitors to your merchant partner's site at...

<a href="http://www.abc.com/youraffiliateID">

You insert the link on this page...

your-domain.com/referring-page.html

After you upload your referring-page.html page, you'll see that SBI! has added some tracking information to your http://www.abc.com/youraffiliateID affiliate link (do a View > Source on your Web page). It will look like this...

<a href="http://www.abc.com/youraffiliateID" onClick="window.location.href='http://www.your-domain.com/cgi-bin/counter.pl?url=http%3A%2F%2Fwww.abc.com%2FyouraffiliateID&referrer=http%3A%2F%2F
www.your-domain.com%2Freferring-page.html'; return false;">

Note: The actual URL is all on one line, NO line breaks.

You can now track Click Throughs from the origin ("your-domain.com/referring-page.html") to the destination ("http://www.abc.com/youraffiliateID").

If you do not want SBI! to reformat and track your links...

Simply add the following to your link code...

***no_tracking** and ***/no_tracking**

The format looks like this...

<a href="***no_tracking***http://www.externaldomain.com/
filename.html***/no_tracking***">anchor text</a>

The added code must be inside the quotation marks.

This extra code tells SBI! not to add tracking code to the link. When the page is built, the added code will disappear, leaving only your original link code.

---

Now that your local folder structure is set up and you know the proper folder location for each type of file, proceed to the second part of Step 1 of the Upload Your Own HTML process...

SBI!'s Built-in Functions

© and ™ SiteSell.com. All Rights Reserved.

Close Window