3rd Jul 2009, 12:53:43 AM

The demos here give you an overview of how you can embed the Boxes easily into your existing html code. Best of all, you just need to know one set of small API calls to build any Box found in the TBP library!

How small exactly is the number of API calls? Just 5! And that is the maximum number if you are building a Box with a Title. If you do not need a Title for the box, you can make do with just 4!

Since the TBP Project allows any person to create a Box and add to the library, you can tap into the vast amount of Boxes that will only grow by the day. It's easy. It's free. And you can spend your time on other parts of your website, and put your mind at ease, knowing building a Box is just a-few-minutes task!

 

 

Output Code Source

 

Demo 1 Box is built with a Title.

The css markup for the Title is set by the Box Developer. However, you can overwrite the css style if you wish.
  1. <script type="text/javascript" src="http://theboxes.paradise.sg/
    sites/theboxes.paradise.sg/files/Box/75/files/theboxesparadise_75.js"> </script>
  2. <script type="text/javascript"> tbp_75_getHeader(); </script>
  3. <script type="text/javascript"> tbp_75_getStartTitle(); </script>
  4. Demo 1
  5. <script type="text/javascript"> tbp_75_getMid(); </script>
  6. Box is built with a Title. [more contents]
  7. <script type="text/javascript"> tbp_75_getEnd(); </script>

Demo 2

Box is built without a Title.

This is the simplest rounded Box found in the standard TBP library set.
  1. <script type="text/javascript" src="http://theboxes.paradise.sg/
    sites/theboxes.paradise.sg/files/Box/28/
    files/theboxesparadise_28.js"> </script>
  2. <script type="text/javascript"> tbp_28_getHeader(); </script>
  3. <script type="text/javascript"> tbp_28_getStart(); </script>
  4. <p>Demo 2</p>
  5. <p>Box is built without a Title. [more contents]</p>
  6. <script type="text/javascript"> tbp_28_getEnd(); </script>
Demo 3

Box is built with a Title.

Notice that you have to call an additional getMid() if your Box has a Title.
  1. <script type="text/javascript" src="http://theboxes.paradise.sg/
    sites/theboxes.paradise.sg/files/Box/28/
    files/theboxesparadise_28.js"> </script>
  2. <script type="text/javascript"> tbp_28_getHeader(); </script>
  3. <script type="text/javascript"> tbp_28_getStartTitle(); </script>
  4. Demo 3
  5. <script type="text/javascript"> tbp_28_getMid(); </script>
  6. <p>Box is built with a Title. [more contents]</p>
  7. <script type="text/javascript"> tbp_28_getEnd(); </script>
Demo 4

Box is built with a Title, with pillow emboss effect.

More fanciful Boxes can be found in the TBP library, and the best thing is, you just build the Box with the same simple set of API calls!

Neat.
  1. <script type="text/javascript" src="http://theboxes.paradise.sg/
    sites/theboxes.paradise.sg/files/Box/95/
    files/theboxesparadise_95.js"> </script>
  2. <script type="text/javascript"> tbp_95_getHeader(); </script>
  3. <script type="text/javascript"> tbp_95_getStartTitle(); </script>
  4. Demo 4
  5. <script type="text/javascript"> tbp_95_getMid(); </script>
  6. <p>Box is built with a Title, with pillow emboss effect.</p>
  7. <script type="text/javascript"> tbp_95_getEnd(); </script>
Copyright © 2009 Sym Paradise. All rights reserved. Terms of Use | Copyright Information