Shoutbox

Since the shoutbox maintains visibility by keeping itself positioned above the fold at all times, it's inherently optimized for viewable impressions and yields 2-3x higher CTRs as a result!

Customization

  • Optional close button
  • Left or right alignment
  • Responsive design support
  • Frequency capping
  • Polite option to disable for current browser session after being closed by user

Media Support

  • Graphic banners (GIF/JPG/PNG)
  • Flash banners
  • HTML5 banners
  • Custom HTML banners, including forms with CSS and JavaScript
  • Third-Party banners from agencies and ad networks such as DoubleClick, Google, Sizmek and others

Deployment

Deploying shoutboxes on your web site couldn't be easier. Our code wizard will generate all of the HTML code for you. All you have to do is copy and paste that code into the bottom of your web page near the </body> tag.

Recommendations

  • Shoutboxes are best implemented with square or rectangular banners since they appear in the bottom corners of the browser window.
  • Desktop and tablet users are best served a 336x280 or 300x250 banner, but larger or custom sizes are also possible.
  • Smaller sizes such as 180x150 can be substituted for mobile phones users, which will improve the usability of your web site on those devices.
  • To make the shoutbox a bit more polite you can optionally set it to disable itself for the remainder of the current browsing session if a visitor clicks the close button.

Advanced Techniques

Border

Want to add a border to the top of your shoutbox? Simply add the following CSS to your stylesheet or place it just above the code for the shoutbox:

<style type="text/css">
#shoutbox { border-top: 2px solid #000000; }
</style>

For a live demonstration of this, click here to add the border and then click here to remove the border.

Close Button

Don't like the default close button? You can change it by going to Settings > Basic > Code Wizard

Close Callback Function

The ability to include a JavaScript callback function in custom creatives is useful to stop audio or video from playing promptly when the shoutbox is closed by the user:

<script type="text/javascript">
function shoutboxCloseCallback() {
// your custom close logic here...
}
</script>

Remember this needs to be a global function in order for it to be visible to the shoutbox wrapper code. Using this callback is not necessary with HTML5 banners or video banners. Those types of banners are designed to destroy any audio/video components upon closing so they stop playing automatically.

Quirks Mode Considerations

If your web site happens to render in Quirks Mode you will need to correct that in order for the shoutbox to show up correctly in Internet Explorer, however, this can usually be accomplished by simply specifying a doctype if one is missing or by switching to a standards compatible HTML doctype.

The HTML5 doctype as well as all of the XHTML 1.0 or 1.1 doctypes, which are the most commonly used for modern or relatively modern web sites are already rendered in standards compliant mode and require no changes.

On older web sites that use HTML 4.01 you must use the complete doctype with system identifier which would be one of the following:

  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">