Frame our puzzles

Our tutorial page of how to display our games inside your own website.

This tutorial will be kept as brief as possible without compromising the informations you need.

Please read the special conditions you have to meet first!

Quick introduction to frames

Frames are the way to display two webpages in the same browser window. An example of a frame page is this one: http://www.crea-soft.com/frames-main.html

The HTML source code

The main page is the page that determines which 2 (or more) pages will be displayed in frames: http://www.crea-soft.com/frames-main.html.

The main page source code for frames-main.html looks like the one below:

The main page source code for frames-header.html looks like the one below:

Explications for understanding the HTML code for using frames

The main page contains only the fact that the browser will be split in two rows. the first row will have 25% of the height and the second will have the remaining 75%. If you wish to use pixels (200 pixels height) instead of percents, use <FRAMESET ROWS="200,*">.

The second page, frames-header.html, contains the header of your page. From inside this header, (which is a page designed by you!) you can switch the urls used in the footer. You can do this by using the A tag like this: <A HREF="www.a-domain-name.com" target="online-game">. This will load the www.a-domain-name.com into the frame you labeled "online-game" (check the frames-main.html code).

The URLs of our games for use with frames

Online Jigsaw Puzzles

Example : "http://www.crea-soft.com/online-jigsaw-puzzle/f-jigsaw-puzzles.html?online-game=duckling_s_1"

The fixed part of the URL you will need to place on your website is this one:
"http://www.crea-soft.com/online-jigsaw-puzzle/fjigsaw-puzzles.html?online-game="
the last part, the variable, indicates which jigsaw puzzle to load and with what difficulty
"duckling" indicates the Duckling jigsaw puzzle
"_s_1" indicates the small jigsaw puzzle difficulty setting.

All the avlaible difficulty setting are:
"_s_1" indicates the small jigsaw puzzle difficulty setting.
"_m_1" indicates the medium jigsaw puzzle difficulty setting.
"_l_1" indicates the large jigsaw puzzle difficulty setting.

All the avalaible jigsaw puzzle names are:
doggy, puppy, piggy, kitty, cinnamon, mable, ben, duckling, birds, bird2, eagle, bearsfishing, lionprince, elephant, hippo, lizard, ferrarif50, bugatti, diablo, baloons, aircraft, desert, waterfall, sunset, lake, cliffinclouds, lake2, whitemountain, everest, sucevita, hurez, avalon, garden, flower2, flower1, lily, redrose, flower3, autumnfire, leaves, dolphins, fishbank, corals, seashore, fantasia, donaldco, mickyminnie, sunrise, bridge, caliopy, sailingboat, angelwolf, perm, him, cristina, hanif, melissa, lexa2, lexa4, cage1, cage2.

Online Slide Puzzles

Example : "http://www.crea-soft.com/online-slide-puzzles/f-slide-puzzles.html?g=lilies&x=4&y=3"

The fixed part of the URL you will need to place on your website is this one:
"http://www.crea-soft.com/online-slide-puzzles/f-slide-puzzles.html?g="
the last part, the variable, indicates which jigsaw puzzle to load and with what difficulty
"lilies" indicates the lilies slide puzzle
"&x=4" indicates the number of columns (6) of the slide puzzle
"&y=3" indicates the number of rows (5) of the slide puzzle
.

The columns and the rows should range from 2 to 10.

All the avalaible slide puzzle names are:
stag, fruits, train, coast, lilies, waterfall2, waterfall, hongkong, beach, basilic, alpes, fox, duck, house, deer, rose, lexa, flowers, puppy, collie, ancient, aquarium, bay, dog, dog2, flowers2, mountain, oldcanyon, tajmahal, turkey, valley, lake.

Why so much trouble?

We could make a script that generates the URL automatically. But it's better for you to learn some HTML. It's not painfull :)) . Look at the www.w3.org web site for a deeper understanding of frames.

Mail us if you can't get there!