SCA integration with Liquid Pixels

PRQT-1446 :: SCA integration with Liquid Pixels

Proposal Summary 

This proposal covers the development of liquid Pixel integration with SCA to personalise the item image. 

The pages that include the updated 

  • PDP page 
  • Cart page 
  • Checkout pages 
  • NetSuite Sales Order 
  • SO email template 

Requirement 

Requirement is to integrate the liquid pixel for the personalised image from PDP page. And saved along with the transaction line item on the order 

Prerequisites 

  • Liquid Pixel account for the reference 
  • Access roles – Administrator, SC Deployer 
  • SCA version should be Suite commerce Advanced or later 
  • Suite commerce or Suite commerce Advanced Website 

Our solution 

We have to create the extensions for the implementation in the SCA site. In the extension we will create a modal for the functionality in PDP page, this will be same in the desktop and mobile view (The modal will be responsive) 

The implementation should be different phases 

  • PDP Page 
  • Cart Page and checkout 
  • NetSuite side update on Mail  

PDP page 

We will add a button to add functionality in the PDP page to add the personalisation option using Liquid pixel. We will consider the custitem_tag_show_liquid_pixels field for enable the feature for corresponding item in the SCA. 

The personalisation will only show if the option is enabled for the item. 

Please Note: For the matrix will consider the child record reference. And for the matrix item the matrix should be mandatory so we will not hide the option from the PDP page. The customer needs to choose one of the child items by choosing the matrix option(s) 

The color is mandatory (Matrix item option) 

On the Button click the modal will open and there are three sections for the configuration. We can use the same item option for saving the values 

  1. Bank & Account Information  
  1. Fields: Bank Name, Bank Address, Bank Address 2, Extra Line, Routing Number, Account Number, Check Start Number, Personalization Color, Personalization Font  
  1. Company Information  
  1. Fields: Line 1 (Company Name), Line 2, Line 3, Line 4, Line 5, Personalization Color, Personalization Font  
  1. Logo & Options  
  1. Fields: Logo Option select box, Logo Upload, Logo Layout, Number of Signature Lines, Title Above Signature Line, Secondary Title Above Signature Line, Imprint Below Signature Line, Text on Check Stub, EZ Shield 

The logo creation API will be provided by Artina.  

Each section will show one after another. We will create configuration field in the Netsuite for dynamic data. So here the Base URL will be added. 

The custom records will require if the values needed the reference from Liquid pixel. The corresponding the data from the NetSuite will be shown in the Modal. 

Please note the list of mandatory fields to be updated by customer will provided by Artina. 

After the submission of three steps, we can will show the preview image in the modal and once it verified by customer the preview image will be replace in the PDP page slider section (The zoom effect will not work for this image). And for the configurated item can be add to the cart. 

Mini Cart, Cart Page and checkout 

We will create another extension for display the configurated image in Mini Cart, Cart Page and checkout 

Currently we will not consider the updating on the image while the user updates the option from the cart page. 

NetSuite side update on Mail 

We will create the custom Email template for Website 

Column fields need to create for to store the item image reference for the mail 

  • Item Image  

The Workflow action script will create in the NetSuite for the updation in the item line on the sales order for the image. 

We will add the reference in the transaction column for the image used for the Email template. 

Please note: the default image will be shown if there is any error for the corresponding image creation while creating the order. 

Assumptions 

  • The custom record created and mapped in the corresponding record required 
  • Changes in the website setup and configuration are needed. 
  • Development will be initially done in sandbox and then will be pushed to production. Once verified in sandbox. 
  • The pre requisites will be provided by Artina. 
  • All photos of products are placed in: Need to be shared by Artina for the reference 
  • All personalization placement information is placed in: Need to be shared by Artina for the reference 
     

Doubts &Clarification 

  1. Please check and let us know the static value used for the parameters 

2 We can use the given section as static in the end section of the URL creation 

‘set=tables[file:(%27global.tempDevPath%27)tables/]&set=apps[file:(%27global.tempDevPath%27)foundation/]&call=url[file:(%27global.tempDevPath%27)main]&sink’ 

Could you please check and confirm? 

Please note: We will consider the functionality and the image creation for all the website is common. So, we will implement the common configurator for all 

Leave a comment

Your email address will not be published. Required fields are marked *