iWeb B2C Integration Guide

iWeb B2C Integration Guide EN2305
 Imaxel Lab SL 2
History
Date Doc version Description Author
29.05.2009 1.0 Created by Imaxel
04.07.2013 1.2 Last update Imaxel

 Imaxel Lab SL 3
TABLE OF CONTENTS
INDEX
INDEX 3
How to integrate iWeb in my web page? 4
Introduction.....................................................................................................................................4
Direct link method...........................................................................................................................4
New window method ......................................................................................................................4
Iframe method.................................................................................................................................5
iWeb calling parameters 6
Forcing language by default for iWeb .............................................................................................6
Start working in a concrete folder...................................................................................................6
Leading end user to a concrete product code.................................................................................8
Starting iWeb with a product name ................................................................................................8
Limiting the navigation to a folder or product................................................................................9
Restrict navigation to a single product..........................................................................................10
Identifying client codes or affiliates ..............................................................................................10
Customizing iWeb logo..................................................................................................................11
Limiting navigation to a single folder ............................................................................................11
Start using iWeb with a predefined image....................................................................................12
Calling iWeb by POST method 14

 Imaxel Lab SL 4
How to integrate iWeb in my web page?
Introduction
There’re many ways to integrate iWeb in your web page. In this document we’ll show them, trying to
explain to positive and the negative side of each option.
Direct link method
The easiest way this is to create a link in your web page to the Imaxel iWeb application.
Example:
<a href=”[imaxel provided link]” target=”_self” >Click here to order albums</a>
Advantages: Simple. No Pop-up blocks.
Disadvantages: Client Web context is lost (it could be avoided by defining target = “_blank” to open the
link in the new window). If the end user clicks on the “go back” button, the application may close
unexpectedly.
New window method
This method is the recommended by Imaxel
The recommended size is 1024x768 pixels, and the minimum size accepted 998x629 pixels, but the
window must be resizable, for users with bigger screens can maximize it.
Example:
Enter this code below your section <head></head>:
<script type="text/javascript">

</script>
And this code in the link:
<a href="javascript:void()" onclick="openNewWindow('[imaxel provided
link]','ImageWeb','resizable=yes,width=1024,height=768')">Click here to order
albums</a>
Tip: You can detect the window size and maximize it according to the end user screen size. For more
information: http://www.javascriptkit.com/howto/newtech3.shtml
Advantages: Do not lose context at client’s web page. Avoids end user clicking in the back button .We
have more room to show the application (Explorer, URL, Favorites, etc. Buttons can’t be seeing)

 Imaxel Lab SL 5
Disadvantages: Problems because of popup blocking (It’s necessary to inform the end user that the
application will start in a new window).
Iframe method
Use this method when you want to embed iWeb in your web page. Remember that the minimum size
for the application is 998x629 pixels.
Example:
<iframe src ="[imaxel provided link]" width="1024" height="768">
<p>Your browser does not support iframes.</p>
</iframe>
Advantages: Client web context is not lost.
Disadvantages: Depending on the web design, the user may get a very reduced space for the iWeb
application.
Important: PayPal payment method is not compatible with the iframe method.

 Imaxel Lab SL 6
iWeb calling parameters
This is the link we’ll be using to show you the calling parameters we can use for the iWeb application
you can use it to immediately check the examples in the Web browser.
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47
To add new calling parameters, we must always use the character ‘&’ at the end of the link in our
iWeb program, and every time we use a different parameter.
Forcing language by default for iWeb
 lang: This parameter is used to set up the language by default for iWeb
The format to be used must be “es-ES”, “en-EN”, etc… If no parameter has been specified, the end
user will be prompted to choose a language:
We’ll use the parameter lang=en-EN or es_ES at the end of the iWeb link.
For example, to force iWeb to start in English, we’ll do the following:
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-EN
Start working in a concrete folder
 fnm: Initial folder name
When this parameter has a value, iWeb will show this folder in the beginning. You’ll need to define the
original name of the folder, and not the translated name used in the language section.

 Imaxel Lab SL 7
Important: If the folder contains non ASCII characters, such as “ü”, “Â” o “ñ”, these must be written in
the search chain with its substitutes. In this web http://www.motobit.com/util/url-encoder.asp you’ll
find an interesting utility to find these substitution characters. You’ll need to specify UTF-8 as the
destination character set.
Whenever a blank space must be used for the folder or product name, we’ll have to substitute this
blank space by %20
In this example, we can see the folder structure we created to browse this iWeb
Let’s take as starting folder Photobooks and English as default language:
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-EN&fnm=Photobooks
Fnm = Photobooks
Fnm = Photo%20Layouts
Fnm = Photo%20Calendars
Fnm = Original%20Ideas
Fnm = Posters
Fnm = Greeting%20Cards
Fnm = CARDS%20%26%20SIGNAGE

 Imaxel Lab SL 8
Leading end user to a concrete product code
 pc: Initial product code
When pc is specified, iWeb will start with the product belonging to this code.
In our example, we’re going to use the parameter so that iWeb loads initially an existing product in the
Database with code number 87700
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-EN&pc=87700
Starting iWeb with a product name
 pnm: Initial product name
When pnm is specified, iWeb will load the product belonging to this name. Notice that you will need to
specify the original product name, not the name in the language translation.
For example, we’re going to use the product name of the previous example, this is Photobooklet A4.
Whenever a blank space must be used for the folder or product name, we’ll have to substitute this

 Imaxel Lab SL 9
blank space by %20
For example, to use the product name Photobooklet A4 we’ll have to enter Photobooklet%20 A4
The link we’ll use to show it, this will be:
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-
EN&pnm=Photobooklet%20A4
Limiting the navigation to a folder or product
 lmtcat: Values: true or false
This limits the navigation to the initial folder or to the product code. These parameter only makes
sense when used together with: fnm , pc or pnm.
iWeb will initially show the folder or product specified with its parameters, and can only be opened
those products which are in the same folder or subfolders, but never those in different folders.
In our example, we’ll use the following link to restrict the navigation to other folders different from the
Photobook folder
EN&fnm=Photobooks&lmtcat=true

 Imaxel Lab SL 10
Restrict navigation to a single product
 Lmtpr: Values: true or false
In this case, the end user will only have the choice to choose a single product. It only makes sense
when used together with these parameters: pc o pnm.
The aim of this parameter this is to avoid adding new jobs to an order. For example, in the following
link, we’re limiting the navigation to a single product:
EN&pc=87700&lmtpr=true
Identifying client codes or affiliates
 Ref: The parameter ref can be used to identify from which affiliate iWeb was accessed. This
way, a commission can be assigned according to. Usage is as follows: &ref=client name, code,
etc
The value of the parameter ref will be saved in the field Activation Code of the order. This will be very
helpful to manage valuable data concerning this activation code.
It’s important to know that this field doesn´t filter the pick-up points in iWeb.
When the parameter is used, a cookie will be saved for 30 days at the end user web browser software.
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-EN&ref=3567

Customizing iWeb logo
 lg: URL image logo (PNG or JPEG size 228x46 pixels)
When using parameter lg, iWeb will be customized with a logotype (usually, the iWeb commercial
brand offering the service). This image must always be 228x46 pixels JPG or PNG format file.
For Flash to load images from a different domain, it will need a file called crossdomain.xml in this
domain. This file must be in a superior level to the folder where we’ll leave these customized logos
images.
Example:
If http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47 tries to load the image from
http://www.mydomail.com/imagenes/logos/logo1.jpg, the following link must be accessible:
http://www.mydomain.com/crossdomain.xml and must have a crossdomain.xml file. You can ask a
crossdomain.xml file to Imaxel.
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lg=http://demo.imaxel.com/almac
en_owm/Laboratorio%20Xerox/Demo%20Xerox/ImageWeb/IMAGES/imaxel.jpg
Limiting navigation to a single folder
 lmtcatfnm: Parameter lmtcatfnm in iWeb will not allow end users to access a folder
outside the specified one
This parameter will be used to limit the offer to some concrete products along with showing a
customized logo. We’ll need to create a folder below the Root with the lmtcatfnm. iWeb will not allow
the end user to access any folder outside it.
Look at the following example:
Imagine you have this folder structure and you want to allow end user accessing the Booklets folder,
but you don’t want end user to go outside the Photobooks folder.

http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lg=http://demo.imaxel.com/almac
en_owm/Laboratorio%20Xerox/Demo%20Xerox/ImageWeb/IMAGES/imaxel.jpg&fnm=Booklets&lmtca
tfnm=Photobooks
Start using iWeb with a predefined image
 imgUrls: When using imgUrls parameter, iWeb application will be shown with a
preloaded image. You may need to add some predefined in iWeb from an external
server. Once the end users have selected a product, they will get the edition screen with this
image to complete and order
For example, this is an image we have in a server:
http://demo.imaxel.com/almacen_owm/Laboratorio%20Xerox/Demo%20Xerox/ImageWeb/IMAGES/5
392204.jpg
http://demosites.imaxmanager.es:8080/WebCounter/WebCounter.aspx?dlrid=47&imgUrls=http://de
mosites.imaxmanager.es:8094/Files/JoomlaFiles/dmdocuments/img/30398729.jpg

Calling iWeb by POST method
As you can see in this document, there’re several parameters to call iWeb. If you’re a Web developer,
we recommend you to use this POST method to call these parameters. The reason is that every time
you add a parameter, the link text is becoming longer, and you may find problems with concrete
Internet Explorer versions.
At the following example, we’ll force the language by default to English, starting with product code
87700, limiting to this single product, and leading end user back to Imaxel main web page when order
is finished. As we can see, the resulting link will be extremely long:
EN&pc=87700&lmtpr=true&endurl=http://www.imaxel.com
This is an example of the static POST method (example POST.html) using the previous link call:
<html>
<head>
</head>
<body>
<form action="http://demosites.imaxmanager.es:8080/WebCounter/WebCounter.aspx "
method="POST">
<input type="hidden" name="dlrid" value="47" />
<input type="hidden" name="lang" value="en-EN" />
<input type="hidden" name="pc" value="87700" />
<input type="hidden" name="lmtpr" value="true" />
<input type="submit" value="Jump to iWeb" />
</form>
</body>
</html>

iWeb B2C Integration Guide

Recommended

Recommended

More Related Content

What's hot

What's hot (9)

Similar to iWeb B2C Integration Guide

Similar to iWeb B2C Integration Guide (20)

More from Heo Gòm

More from Heo Gòm (20)

Recently uploaded

Recently uploaded (20)

iWeb B2C Integration Guide