Champro Custom Builder Integration
Champro Custom Builder integration allows dealers to:
– Use API to access customer designs, rosters, SKUs and PDF art proofs.
– Purchase customer designed products via the Champro website or API.
1. Embedding Custom Builder
Embedding Custom Builder (CB) allows your customers to build custom uniforms on your website. After the customer saves the design on the embedded CB, it will appear in your “My Designs 3D” page on Champro website ( https://champrosports.com/cslockerroom/index/#/locker-room )
My Designs 3D page allows you to make necessary adjustments to the custom product design, roster and place the order online.
Embedding CB is a two step process requiring minimal technical knowledge.
1.1 Generate Customer Key
You can generate your CB API key on the Account & Contact Info page ( https://champrosports.com/AccountAndContactInfo ):
1.2 Embed The Code
When embedding Custom Builder please use one of the Embed URLs from the table below:
Category | Embed URL |
All Categories | "https://cb.champrosports.com/V2/Index?lic=EnterYourCustomerKeyHere" |
BASEBALL | "https://cb.champrosports.com/V2/Index/1335?cat=s&Name=BASEBALL&lic=EnterYourCustomerKeyHere" |
FASTPITCH | "https://cb.champrosports.com/V2/Index/1344?cat=s&Name=FASTPITCH&lic=EnterYourCustomerKeyHere" |
MEN'S BASKETBALL | "http://cb.champrosports.com/V2/Index/1391?Name=MEN%27S%20BASKETBALL&lic=EnterYourCustomerKeyHere" |
WOMEN'S BASKETBALL | "http://cb.champrosports.com/V2/Index/1387?Name=WOMEN%27S%20BASKETBALL&lic=EnterYourCustomerKeyHere" |
FOOTBALL | "https://cb.champrosports.com/V2/Index/1368?cat=s&Name=FOOTBALL&lic=EnterYourCustomerKeyHere" |
HOCKEY | "http://cb.champrosports.com/V2/Index/1389?Name=HOCKEY&lic=EnterYourCustomerKeyHere" |
MEN'S SPORTSWEAR | "http://cb.champrosports.com/V2/Index/1406?Name=MEN%27S%20SPORTSWEAR&lic=EnterYourCustomerKeyHere" |
WOMEN'S SPORTSWEAR | "http://cb.champrosports.com/V2/Index/1407?Name=WOMEN%27S%20SPORTSWEAR&lic=EnterYourCustomerKeyHere" |
WOMEN'S VOLLEYBALL | "http://cb.champrosports.com/V2/Index/1400?Name=WOMEN%27S%20VOLLEYBALL&lic=EnterYourCustomerKeyHere" |
SPLASH | "https://cb.champrosports.com/V2/Index/1352?cat=s&Name=SPLASH&lic=EnterYourCustomerKeyHere" |
CAPS | "https://cb.champrosports.com/V2/Index/1312?cat=s&Name=CAPS&lic=EnterYourCustomerKeyHere" |
FACE COVERINGS | "https://cb.champrosports.com/V2/Index/1302?cat=s&Name=FACE%20COVERINGS&lic=EnterYourCustomerKeyHere" |
2. Custom Builder API:
Using the Custom Builder API requires more technical knowledge and time commitment, but allows full automation in processing of custom uniform orders. You can use CB API to :
– Place orders
In order to use the Custom Builder API, you must have a Customer Key and should have Custom Builder Embedded on your website (see instructions above). You can use source code of the Custom Builder API Demo as a reference.
2.1 Get Design Session IDs
Design Session ID is sent back to you via AddEventListener() method after Save Design button is clicked. The following function is the event listener on the parent page for events in the child iFrame.
//cb_action - code of action sent from child iFrame. For saving of design it returns as "ProcessDesign"
//cb_id - "Design Session ID" - session id for stored design - you can use this Session Id to get additional information or placing the order
//not mandatory JS code
2.2.1 Download Proof file
You can call the following API address to download the PDF file
2.2.2 Download FrontImage file
You can call the following API address to download the FRONT image
2.2.3 Download BackImage file
You can call the following API address to download the BACK image
2.2.4 Download LeftImage file
You can call the following API address to download the LEFT image
2.2.5 Download RightImage file
You can call the following API address to download the RIGHT image
2.2.6 Retrieve Order data
You can call the following API address to download the ORDER DATA (JSON file)
The JSON file has the following structure:
"CreatedDataTime":"string",
"RosterLineId":"GUID",
"ProductName":"string",
"DesignName":"string",
"DesignColor":"string",
"Notes":"string",
"SelectedFabric":"string",
"SelectedLeadTime": {
"LeadTimeName":"string",
"LeadTimeDays":"integer"
"AvailableLeadTimes": [ {
"LeadTimeName":"string",
"LeadTimeDays":"integer"
"Quantity":"integer",
"Teams": [ {
"TeamName":"string",
"Quantity":"integer",
"Players": [ {
"PlayerNumber":"string",
"PlayerSize":"string",
"Quantity":"integer",
"SKU":"null",
2.3 Place Order Method
In order to place orders via API, you must provide your IP address(es) on the Account & Contact Info page ( https://champrosports.com/AccountAndContactInfo )
To place the order via our API you can send POST request
(JQuery example: $.post( 'https://cb.champrosports.com/api/Order/PlaceOrder', OrderData))
With JSON data following structure
"SessionId":"string",
"PONumber":"string",
"LeadTimeId":"string",
"ShipTo": {
"LastName":"string",
"Company":"string",
"Phone":"string",
"Address1":"string",
"Address2":"string",
"Suite":"string",
"City":"string",
"State":"string",
"Zip":"string",
"Country":"string"
Once order is placed we return the response following structure
"Order":"string",
"Message":"string",
"MessageCode":"string",
"AllowedValues":"string",
"ValidatedShippingAddress": {
"LastName":"string",
"Company":"string",
"Phone":"string",
"Address1":"string",
"Address2":"string",
"Suite":"string",
"City":"string",
"State":"string",
"Zip":"string",
"Country":"string",
"AddressClassification":"string",
"Description":"string"
“Order”: {placed order number if Result is "OK"}
“Message”: {error text description if Result is "ERROR"}
“MessageCode”: {"01" = "Lead Time is not entered" || "02" = "wrong Lead Time code" || "03" = "error in address validator service" || "04" = "address is not validated" || "05" = "Design session ID or Customer Key are wrong, does not match or roster is empty" || "06" - not able to resolve SKU || "07" = "Do not allow to place order with your Terms of payment" || “08” = “It does not allow to place order from your IP address”}
“AllowedValues”: {comma separated list of available values if it is applied s.a. for MessageCode "02"}
"02" = "wrong Lead Time code"
"03" = "error in address validator service"
"04" = "address is not validated"
"05" = "Design session ID or Customer Key are wrong, does not match or roster is empty"
"06" = "not able to resolve SKU"
"07" = "Do not allow to place order with your Term of payment"
"08" = "It does not allow to place order from your IP address"
You can see how it was implemented in sources on our Example page