iWeb B2C Integration Guide
En2308 i web b2c integration guide
Oct 19, 2014
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
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
iWeb B2C Integration Guide EN2305
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
iWeb B2C Integration Guide EN2305
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">
<!--
functionopenNewWindow(theURL,winName,features)
{
window.open(theURL,winName,features);
}
//-->
</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)
iWeb B2C Integration Guide EN2305
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.
iWeb B2C Integration Guide EN2305
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.
iWeb B2C Integration Guide EN2305
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
iWeb B2C Integration Guide EN2305
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
iWeb B2C Integration Guide EN2305
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 http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-EN&fnm=Photobooks&lmtcat=true
iWeb B2C Integration Guide EN2305
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: http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-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
iWeb B2C Integration Guide EN2305
Imaxel Lab SL 11
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/almacen_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.
iWeb B2C Integration Guide EN2305
Imaxel Lab SL 12
http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lg=http://demo.imaxel.com/almacen_owm/Laboratorio%20Xerox/Demo%20Xerox/ImageWeb/IMAGES/imaxel.jpg&fnm=Booklets&lmtcatfnm=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/5392204.jpg
http://demosites.imaxmanager.es:8080/WebCounter/WebCounter.aspx?dlrid=47&imgUrls=http://demosites.imaxmanager.es:8094/Files/JoomlaFiles/dmdocuments/img/30398729.jpg
iWeb B2C Integration Guide EN2305
Imaxel Lab SL 13
iWeb B2C Integration Guide EN2305
Imaxel Lab SL 14
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: http://demo.imaxel.com/WebCounter/WebCounter.aspx?dlrid=47&lang=en-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>
Related Documents
