CONTENTS

Site Home

General News

Site Top 20

iHigh FAQ

AdScore

Broadcast FAQ

Manage Online Forms

Mobile Broadcast FAQ

Photo FAQ

Production Truck Lite FAQ

Site Administration FAQ

Site Settings FAQ

WHAT IS?

iHigh

A Tag

A Unique Visitor

HOW DO I?

Make Money With My Website

Edit My Banner

Change My Left Links Bar

Tag Other Schools

Increase Traffic

Create a Custom Page

Change My Login Information

Redirect My Current URL to My iHigh.com Website

Clear my Cache

Link to a Document

BROADCAST ISSUES

Bandwidth Info For Air Cards

Production Truck Information

Dual Audio/Video Broadcast Tutorial

Using Ad Trigger

Error Messages

Notes for IT Adminstrators

Minimum upload speed for broadcasts

BROADCAST TIPS

Football

Basketball

Baseball-Softball

Soccer

MEDIA

Headlines

Live Broadcasts

Archived Broadcasts

Video Clips

Photo Galleries

Announcements

Calendar/Schedule

iCal Calendar

Tournaments

Content Pages

Documents

Forums

Polls

Scoreboard

Contact Us

RSS Feed

iHigh.com Widget



How to use the iHigh Widget to Increase Your Traffic



The iHigh widget is a small application that can be added to a non-iHigh.com site. It can include thumbnails of your school's videos and photos and a live news feed from the iHigh article submissions. The widget is easy to add to your school's main home page or to a local newspaper site or a school sponsor site.

Each iHigh site now has a link to the HTML code for the widget. You can just cut and paste this code and send it to the webmaster of the site you would like the widget to appear on. If they add it to their site, every hit to their site becomes a hit to your iHigh site and every unique visitor to their site becomes a unique visitor to your iHigh site even if they do not actually go to YOUR site!

To access this widget just logon as an administrator, go to your Website Tools section, click on "iHigh.com Widget Code". You will then copy and paste the code into the HTML page for your school or sponsor's site.

There are currently nine different widget options to choose from:

Customizable Widgets



These all-new widgets were created in response to many schools asking if they could customize a widget to fit a particular size, incorporate their school colors, or adjust the fonts and thumbnail images. So we designed three different widgets to do exactly that!

Global Customizable Widget



Here is the complete widget code:

<iframe
  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=50&fontsize=8&background=white&textcolor=black&linkcolor=black"
  framespacing="0"
  frameborder="no"
  scrolling="auto"
  allowTransparency="true"
  width="300"
  height="600"
  style="position:relative;z-index:0;"
  border="0">
</iframe>


The code contains several variables that you can customize to suit your needs. First, we'll look at the "imagesize" variable.

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=50&fontsize=8&background=white&textcolor=black&linkcolor=black"

The "imagesize" variable lets you adjust the size of the thumbnail images in your widget. Here's an example of the imagesize set to 50:



Now let's change that imagesize variable to 20:

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=white&textcolor=black&linkcolor=black"



Now we'll adjust the "fontsize" variable. Here's an example of the fontsize set to 8:



Now let's change that fontsize variable to 12:

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=12&background=white&textcolor=black&linkcolor=black"



Now we'll look at the "background" variable. You can use standard named web colors or use hexadecimal color codes to match your iHigh website. Here's an example of the background set to white:



Now let's say your school colors are gold and black. You can change the background variable to "gold":

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=gold&textcolor=black&linkcolor=black"



Or, you can use your school's specific hexadecimal color code (for example, #D0AC24) for an exact match:

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=D0AC24&textcolor=black&linkcolor=black"



Now we'll look at the "textcolor" variable. Like with the background, you can use standard named web colors or use hexadecimal color codes as your textcolor. Here's an example of the textcolor set to black:



Let's say your school colors are navy blue and gray. We'll set our background as "gray" and our textcolor as "navy":

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=gray&textcolor=navy&linkcolor=black"



You'll notice the actual links to your iHigh content are still black. This is where the "linkcolor" variable comes in:

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=gray&textcolor=navy&linkcolor=black"



Now, to better distinguish the links from the regular text, let's change that linkcolor variable to a lighter shade of blue:

  src="http://www.ihigh.com/yourschool/widget.html?journalonly=1&imagesize=20&fontsize=8&background=gray&textcolor=navy&linkcolor=0071FF"



You can also adjust the dimensions of the widget to fit any space you need. These settings are easily adjustable by pixel height and width. Let's start with a 400x400 widget:

  width="400"
  height="400"



Let's change the widget's width to 250:

  width="250"
  height="400"



Now we'll change the height to 250 as well:

  width="250"
  height="250"



You can change the dimensions to fit any size you need:

  width="750"
  height="150"



Whether you want to customize your widget with your school colors, or you have to make it fit into a specific space on a website, the new Global Customizable Widget gives you all the flexibility you need.

Upcoming Broadcast Customizable Widget



Like the Global Customizable Widget, this widget can also be tailored to suit your particular needs - but it will only display your iHigh website's upcoming live broadcasts. Here is the complete widget code:

<iframe
  src="http://www.ihigh.com/campbell/widget.html?journalonly=1&spacing=20&fontsize=8&fontfamily=Arial&fontweight=normal&background=white&textcolor=black &linkcolor=black&broadcastjournal=1&broadcastjournaltype=upcoming"
  framespacing="0"
  frameborder="no"
  scrolling="auto"
  allowTransparency="true"
  width="300"
  height="600"
  style="position:relative;z-index:0;"
  border="0">
</iframe>
iFrame Variables:
  width - Width of the Widget.
  height - Height of the Widget.
  border - Widget border width.

iFrame src URL Variables:
  spacing - Height (in pixels) of each row.
  fontsize - Size (in points) of font.
  fontfamily - Font family. Examples: Arial, Verdana, Courier, Serif. Feel free to comma separate values for fallback font.
  fontweight - Font weight. Examples: normal, bold, bolder, lighter. Also can use values 100 through 900 (normal being 400).
  background - Background color. Examples: red, white, black. Also can use hex values (without the preceding #).
  textcolor - Text color. Examples: red, white, black. Also can use hex values (without the preceding #).
  linkcolor - Link color. Examples: red, white, black. Also can use hex values (without the preceding #).

Notes:
  - Use contrasting background and text/link colors. White on black, black on white, etc.
  - Do not go much over 75 on imagesize width. The original thumbnail image size is 75 pixels wide.
  - If the widget is under or above a DHTML element on the web site you are implementing on, change the z-index value.



Here is a working example of the Upcoming Broadcast Customizable Widget:



Archived Broadcast Customizable Widget



Like the previous widgets, this one can also be tailored to suit your particular needs - but it will only display your iHigh website's archived broadcasts. Here is the complete widget code:

<iframe
  src="http://www.ihigh.com/campbell/widget.html?journalonly=1&imagesize=50&fontsize=8&fontfamily=Arial&fontweight=normal&background=white&textcolor=black &linkcolor=black&broadcastjournal=1&broadcastjournaltype=archived"
  framespacing="0"
  frameborder="no"
  scrolling="auto"
  allowTransparency="true"
  width="300"
  height="600"
  style="position:relative;z-index:0;"
  border="0">
</iframe>
iFrame Variables:
  width - Width of the Widget.
  height - Height of the Widget.
  border - Widget border width.

iFrame src URL Variables:
  imagesize - Width (in pixels) of each thumbnail. Max should be around 75 (full size thumbnail).
  fontsize - Size (in points) of font.
  fontfamily - Font family. Examples: Arial, Verdana, Courier, Serif. Feel free to comma separate values for fallback font.
  fontweight - Font weight. Examples: normal, bold, bolder, lighter. Also can use values 100 through 900 (normal being 400).
  background - Background color. Examples: red, white, black. Also can use hex values (without the preceding #).
  textcolor - Text color. Examples: red, white, black. Also can use hex values (without the preceding #).
  linkcolor - Link color. Examples: red, white, black. Also can use hex values (without the preceding #).

Notes:
  - Use contrasting background and text/link colors. White on black, black on white, etc.
  - Do not go much over 75 on imagesize width. The original thumbnail image size is 75 pixels wide.
  - If the widget is under or above a DHTML element on the web site you are implementing on, change the z-index value.



Here is a working example of the Archived Broadcast Customizable Widget:



Standard Widget Configurations



Now we'll look at some fully functioning examples of the other widgets iHigh offers. You can find the code for these widgets by clicking on "iHigh.com Widget Code" under your Website Tools section:

Standard 300x600 Widget





Wide Format 800x265 Widget





Wide Format 575x265 (No Journal) Widget





Upcoming and Completed Broadcast Guide 530x700 Widget





Upcoming Broadcast Guide 530x350 Widget





Completed Broadcast Guide 530x375 Widget





New iHigh Tutorials

Tutorial Name Date Posted/Updated
AdScore 04-10-2012
Online Forms 08-17-2011
Tagging 08-04-2011
Mobile Video 06-27-2011
Offline Recording 06-27-2011
Streaming Quick Start Guide 06-27-2011
Automatic Updates on Content 12-05-2010
Calendar/Schedule Usage 11-15-2010
iHigh Live Broadcasting with Ad Insertion 11-15-2010
Mailer/Email Lists 10-20-2010
iHigh Widget 12-05-2010
Registration Process 10-15-2010
Dual Audio/Video Broadcast 10-15-2010
Document Upload 10-15-2010
Photo Upload 08-25-2010
Create Sponsors' Ads 08-16-2010
Countdown Widget 08-16-2010
Live Streaming Tool 08-16-2010
Mascot/Banner 08-16-2010
NVU 08-16-2010
Offline Broadcast 08-16-2010
Prism 08-16-2010
Site Quick Start Guide 08-16-2010
School Settings 08-16-2010
Upper Links 08-16-2010

Old iHigh Tutorials

Tutorial Name Date Posted
Mascot/Banner Tutorial 10-16-2009
iHigh Website Overview 10-16-2009
Live Broadcast Quick Start Guide 02-17-2010
Offline Recording Tutorial 02-17-2010
Ad Creation Tutorial 10-15-2009
Live Broadcast Tutorial 10-15-2009
Offline Broadcast Tutorial 10-15-2009
NVU Tutorial 10-16-2009
Prism Tutorial 10-16-2009