Newest KB Articles in HTML

Conversion Codes

Tue, 09 Apr 2013 17:26:01 GMT

Conversion Codes are used to track the number of hits to your pages and/or the number of conversions from your pages. These codes are typically provided by a 3rd Party for you to incorporate into a page on your website that requires a form submission (ie: a My Form page or an IDX Listings page). Upon a successful submission, this data will be recorded / sent to the 3rd Party for them to track it as a hit and/or conversion.

This data will then be used by the 3rd Party to provide you with metrics on the number of hits to these pages and/or conversions from these pages, so that you will know what your conversion rates are like on these page, etc...

If you have Conversion Code that needs to be placed on either a My Form or IDX Listings page, please see below for instructions on how to do so.

My Form Page Type:

1. Login to your COOLSite Admin.

2. Click on "Pages" from the menu on the left.

3. Click on the corresponding icon under the "Edit" column, for the My Form page that you need to add Conversion Code to.

4. Click on the "Form Properties" link above.

5. Scroll down to the bottom of the page and check the "Run Conversion Code" box.

6. Copy and paste your Conversion Code into the "JS Snippet" and/or "Tracking Pixel" box (see the notes section below).

7. Click on the "Submit" button at the bottom of the page when done.

IDX Listings Page Type:

1. Login to your COOLSite Admin.

2. Click on "Pages" from the menu on the left.

3. Click on the corresponding icon under the "Edit" column, for the IDX Listings page that you need to add Conversion Code to.

4. Click on the "Search Form" link above.

5. Check the "Run Conversion Code" box.

6. Copy and paste your Conversion Code into the "JS Snippet" and/or "Tracking Pixel" box (see the notes section below).

7. Click on the "Save Settings" button at the bottom of the page when done.

Notes:

The “JS Snippet” box accepts Java Script code and must be surrounded by Script tags - <script>...</script>.

The “Tracking Pixel” box accepts HTML code and could be surrounded by Image tags - <img>...<img/> OR I-Frame tags - <iframe>...</iframe>.

The Conversion Code will only run once per User-Session.

The Conversion Code will not run if the User is already logged in to your website. This is due to the fact that you already “know” them and therefore cannot be considered as a “new conversion”.

The Conversion Code should not be displayed visually anywhere on your website, unless the 3rd Party does something unexpected, which we cannot control.

Create your own CSS Styles

Wed, 07 Sep 2011 17:43:35 GMT

Each template design has a set of default CSS Styles. Below are a couple of ways you can create your own CSS Styles.

1) Upload a .CSS file

a) Click on "File Storage" from the menu on the left in your COOLSite Admin, and upload a .CSS file by clicking on the "Upload" button above and then browse your computer to select the file to Upload, click "Open" when done. After the uploading of your .CSS file is done, right click on the corresponding file and choose"Get URL" and copy the URL shown in the pop-up window (ie: http://Storage1.Colony1.Net/xxxx/Content/FileName.css).

b) Click on "Meta Tags" from the menu on the left in your COOLSite Admin and add a Style Sheet path (see below) that includes your .CSS URL path (ie: the URL that you copied in the step above), in the "HTML HEAD TEXT" box.

<link rel="stylesheet" href="http://Storage1.Colony1.Net/xxxx/Content/FileName.css" type="text/css" media="screen" />

c) You can now call in these styles in the HTML of any page on your site (see example below).

<div class="home-table"> test </div>

2) Add CSS Styles directly to the <HEAD> section of your website

a) Click on "Meta Tags" from the menu on the left in your COOLSite Admin and add your style reference in the "HTML HEAD TEXT" box (see example below).

Example 1

/* Custom CSS */
<style type="text/css">
.home-table {color:#000000; font-size:14px; font-weight:bold;}
.home-table a {color:#000000; font-size:13px;}
.home-table a:hover {color:#FC020C;}
</style>

Example 2

/* Custom CSS */
<style type="text/css">
.home-table a:link { color: #2233ff; }
.home-table a:visited { color: #6633ff; }
.home-table a:hover { color: #6666cc; }
.home-table a:active { color: #2233ff; }
</style>

b) You can now call in these styles in the HTML of any page on your site (see example below).

<div class="home-table"> test </div>

Insert Windows Media Player object into web page

Thu, 28 Jul 2011 20:41:09 GMT

Instructions for inserting Windows Media Player object/embed code:

1) Upload File to Website
Click on "File Storage" in your website admin area. Next, click on the "Upload" button, then browse your computer for the audio file. Once you locate the file, click on it and select, click "Open" when done. Once the file is done uploading, you should now see the file listed. Right click on the file and select "Get URL" and Highlight & Copy the URL supplied in the popup box and save it somewhere like notepad.

2) Insert object/embed code
Within any Page Editor click the Source Button, so that you can insert the object/embed Media Player control code into that HTML document. Insert this cross-browser Media Player object/embed code into your web page.

Cross-browser Media Player object/embed code ...

3) File Path
Values indicated in red above code should be changed to the URL you save in step 1.

4) Other settings
All values indicated in blue in the above code can be changed if needed. Autostart settings determine if the music starts playing automatically or not. If you want it not to start automatically, and you would rather have the site visitor press the play button to start/stop the music/audio, then change both those values to false and 0, respectively. BOTH values must be changed, to ensure that the music plays the same way in all major browsers. Volume settings are just that... sets the volume level. A value of -300 is about mid-range. You can change that too if you like. BOTH values must be changed to be the same values, to ensure that the volume level is the same in all major browsers.

5) Click "Process Page Update" to save your changes.

Embedding Videos from Popular Services such as YouTube & Vimeo

Mon, 24 Aug 2009 17:39:39 GMT

Overview:

You can embed videos from popular services such as YouTube and Vimeo, which will allow your visitors to view these videos directly on your website. This eliminates the need for your visitors to click on a separate link and also keeps them on your website.

Instructions:

1. Find the video that you would like to embed on your website from a popular service such as YouTube or Vimeo.

2. Copy the related embed code that is provided for the video.

YouTube: Right-click on the video as it is being viewed and select the option for "Copy embed code". This will copy the embed code to your clipboard, which you will need in step # 5 below.
Vimeo: Mouse over the video as it is being viewed and click on the Share icon (bottom icon) in the upper right corner of the video. Next, click into the "Embed" box and copy the selected code provided. This will copy the embed code to your clipboard, which you will need in step # 5 below.

3. Decide where you would like to embed the video on your website. Possible areas are:

On a specific page on your website.
In a particular region on your website / template (such as the Header area).
In the Header or Footer area of a specific page on your website.

4. Edit the page / area on your website in which you would like to embed the video on (see below).

Specific Page:

Click on "Pages" from the menu on the left in your COOLSite Admin and then click on the corresponding icon under the "Edit" column, next to the page in which you would like to embed the video on.

Particular Template Region (Header, Footer, etc...):

Click on "Configure Layout" > "Configure Layout" from the menu on the left in your COOLSite Admin and then click into the appropriate region in which you would like to embed the video on.

Header / Footer on a Specific Page:

Click on "Pages" from the menu on the left in your COOLSite Admin and then click on the corresponding icon under the “Header/Footer” column, next to the page in which you would like to embed the video on. A pop-up window will appear with two editor boxes (Header and Footer) and you will need to click into the appropriate editor box.

5. Click on the "Source" button on the editor toolbar and paste the embed code provided in step # 2 above, into the editor box. You can then update the Height and Width values accordingly if needed.

NOTE: If there is existing HTML code in the editor box, you will need to know exactly where to paste the embed code, to avoid interfering with the existing content on this page / area. If you are not sure where to paste the embed code exactly, please let us know so that we can further assist you with this.

6. Click on the "Process Page Update" / "Apply to Site Now" / "Save" button below the editor box, to save your changes.

7. View your website to ensure that the embedded video is showing up and can be played.

Character Limit when submitting content

Wed, 07 May 2008 19:49:31 GMT

There is a 64,000 character limit on any area/field that is submitted in the COOLSite Admin. When the page is submitted/saved it will cut off any characters past 64k. If you see some of your content being cut-off then view the html section for that area and copy/paste the html in an editor or tool that can give you a character count.

Adding HTML to Page Types other than Free Form

Wed, 07 May 2008 19:46:30 GMT

You can only add HTML to the Header/Footer areas of your non Free Form Page Types and cannot add HTML into the actual body area itself on these pages.

To add HTML to these pages:

Click on "Pages" from the menu on the left in your COOLSite Admin
Then click on the corresponding button under the "Header/Footer" column for any of your non Free Form Page Types.
- If you are inserting standard HTML code on this page,
  - Click on the "Header/Footer" tab.
  - Click on the "Source" button on the editor toolbar, on the corresponding editor box.
  - You can now paste your HTML into the editor box.
  - Click on the "Save" button at the top or bottom of the editor boxes.
- If you are inserting a script on this page
  - You can paste your script into the "Header Script" or "Footer Script" box.
  - Click on the "Save" button at the top or bottom of these boxes.

Orders Confirmation Page with Script

Wed, 07 May 2008 19:45:22 GMT

You can place a browser supported script in the Orders Confirmation Page on your site, by doing the following.

1) Click on "Pages" from the menu on the left in your COOLSite Admin.

2) Click on the "Hidden Pages" tab at the top.

3) Click on the "Add New Page" button at the top (below the tabs) and select "Free Form" as the Page Type to add, and also enter a Page Name for this new page (ie: "Orders Confirmation").

4) Click on the "Add Page" button at the bottom.

5) Click on the "Save" button at the top (below the tabs).

6) Click on the corresponding button under the "Edit" column for this new page.

7) Click on the "Source" button in the editor box.

8) Enter your script into the box provided and click on the "Process Page Update" button at the bottom of the page when done.

9) Navigate to "Configuration > General" from the menu on the left and select the page that you added above, from the "Page to show customer after ordering" drop-down selection box.

10) Click on the "Save Settings" button at the bottom of the page.

Adding HTML to Free Form Page Types

Wed, 07 May 2008 19:44:10 GMT

To add HTML code to any Free Form Page Type on your site, you will need to do the following.

Click on "Pages" from the menu on the left in your COOLSite Admin, and then click on the corresponding button under the "Edit" column for the Free Form page that you would like to add HTML code to. Next, click on "Source" in the first row of the editor box and place your cursor at the end of the last line of existing HTML code, and press the "Enter" key on your keyboard to move the cursor down to a new line.

Next, copy and paste your HTML code into the box and click on the "Process Page Update" button at the bottom of the page when done.

Adding Background Music to Website

Wed, 07 May 2008 19:39:47 GMT

Adding Background Music to your site:

1)

Before you can upload the audio file in your COOLSite Admin, please make sure that the file is in a .WAV or .MP3 format and then click on "File Storage" from the menu on the left in your COOLSite Admin. Click on the "Upload" button and then select the file that you want to Upload and click "Open" when done. Once the file is done uploading, you should now see the file listed. Right click on the file and choose "Get URL" and Highlight & Copy the URL from the popup box and save it somewhere like notepad.

2)

Click on "Meta Tags" from the menu on the left and then copy and paste the following into the HTML HEAD TEXT box:

<embed src="http://Storage1.Colony1.Net/XXXXX/Content/message.wav" autostart="true" loop="true" width="2" height="0"></embed>
<noembed><bgsound src="http://Storage1.Colony1.Net/XXXXX/Content/message.wav" mce_src="http://Storage1.Colony1.Net/XXXXX/Content/message.wav" loop="infinite"></noembed>

*NOTE: YOU WILL NEED TO REPLACE "http://Storage1.Colony1.Net/XXXXX/Content/message.wav" IN THE THREE INSTANCES ABOVE WITH THE URL THAT YOU COPIED PREVIOUSLY FROM YOUR UPLOAD FILES SECTION. ALSO, WHEN YOU REPLACE THIS URL, PLEASE BE SURE TO KEEP THE "" AT THE BEGINNING AND END OF THE ADDRESS AS IT IS SHOWN IN THE HTML CODE ABOVE.

When you are done making the changes to the URL, you will need to click on the "Submit" button below to save your changes.

3)

You can now view your website and the background music should begin playing automatically (this may take some time to start playing, depending on the file size of your .WAV or .MP3 file and your Internet connection speed). If at any point you would like to stop the music, you can click on the "Stop" button on your browser or press the "Esc" key on your keyboard.

*NOTE: There may be some incompatibility issues with this, depending on your browser / plugins.