Bigcommerce Widget Migration

Dev-Sandbox — Sun, 31 Dec 2023 10:17:00 +0000

Hi Everyone,
In BigCommerce, currently there is no option to move the widgets from one store to another store. This will be a big problem in the case of having the staging and production account.

I am having a partial automated and partial manual solution for this.

The below is a postman script which needs the below inputs. These inputs can be set in the environment variable.

Env Variables
source_widget_template_id
source_template_file
source_store_hash
source_access_token
destination_widget_template_id
destination_template_file
destination_store_hash
destination_access_token

Code(Put in the "Tests" tab in Postman).

// Get Source Placement
const sourceWidgetRequest = {
  url: 'https://api.bigcommerce.com/stores/'+pm.environment.get('source_store_hash')+'/v3/content/placements?template_file='+pm.environment.get('source_template_file')+'&widget_template_uuid='+pm.environment.get('source_widget_template_id'),
  method: 'GET',
  header: {
    'Content-Type': 'application/json',
    'X-AUTH-TOKEN': pm.environment.get('source_access_token')
  }
};

const destinationWidgetRequest = {
  url: 'https://api.bigcommerce.com/stores/'+pm.environment.get('destination_store_hash')+'/v3/content/placements?template_file='+pm.environment.get('destination_template_file')+'&widget_template_uuid='+pm.environment.get('destination_widget_template_id'),
  method: 'GET',
  header: {
    'Content-Type': 'application/json',
    'X-AUTH-TOKEN': pm.environment.get('destination_access_token')
  }
};

let widgetUpdateRequest = {
  url: 'https://api.bigcommerce.com/stores/'+pm.environment.get('destination_store_hash')+'/v3/content/widgets',
  method: 'PUT',
  header: {
    'Content-Type': 'application/json',
    'X-AUTH-TOKEN': pm.environment.get('destination_access_token')
  }
};


pm.sendRequest(sourceWidgetRequest, (srcError, srcResponse) => {
    if(srcError){
        console.log("srcError", srcError);
    }else{
        // Get the widget configuration.
        let srcWidgetResponse = srcResponse.json();
        console.log(srcWidgetResponse.data);
        if(srcWidgetResponse.data.length > 0){
            let srcWidgetConfiguration = srcWidgetResponse.data[0].widget.widget_configuration;
            console.log("source_widget_configuration",srcWidgetConfiguration);

            // Get Destination Placement.
            pm.sendRequest(destinationWidgetRequest, (destError, destResponse) => {
                if(destError){
                    console.log("destError", destError);
                }else{

                    let destWidgetResponse = destResponse.json();
                    console.log(destWidgetResponse.data);
                    if(destWidgetResponse.data.length > 0){
                        let destWidgetConfiguration = destWidgetResponse.data[0].widget.widget_configuration;
                        console.log("destination_widget_configuration_id",destWidgetConfiguration._.id);
                        widgetUpdateRequest.url = widgetUpdateRequest.url+"/"+destWidgetConfiguration._.id;
                        delete srcWidgetConfiguration._;
                        widgetUpdateRequest.body= {
                            mode: 'raw',
                            raw: JSON.stringify({ "widget_configuration": srcWidgetConfiguration,"upgrade": true })
                        };
                        console.log("final_update", widgetUpdateRequest);

                        pm.sendRequest(widgetUpdateRequest, (finalError, finalResponse) => {
                            if(finalError){
                                console.log("finalError",finalError);
                            }else{
                                console.log("update_done", finalResponse);
                            }
                        });
                    }
                }
            });

        }
    }
});

Once setting up the script and the environment variables the widget configuration will be copied from source to the destination store.

Before running the script,

The Widget template must be created in the destination store.
Wherever needed, the widget template must be dragged and dropped in the page and published from page builder.

CORE ALGORITHM FOR SCRIPT

Get the placements using source widget template id and the source template file.

In this, we will get the widget configuration configured for the widget template file in that specific template.

Get the placements using destination widget template id and the destination template file.

In this get the destination widget id.

Update the source widget configuration in destination widget.

Open for any suggestions for upgradation or any ideas. Thanks.
Happy Hacking :)

FPUTCSV Custom Function

Dev-Sandbox — Wed, 24 May 2023 07:10:12 +0000

Requirements
Values Surrounded by Double Quotes Always.
Escape Character is "
CR+LF is the newline

function fputcsv_custom($stream, $fields, $delimiter = ",", $enclosure = '"', $escape_char = '\"', $eol = "\r\n") {
    $field_arr = [];

    foreach($fields as $field) {
        $field_arr[] = $enclosure . stripslashes(str_replace($enclosure, $escape_char . $enclosure, $field)) . $enclosure;
    }

    fwrite($stream, implode($delimiter, $field_arr) . $eol);
}

Ref: https://stackoverflow.com/questions/16942531/alternative-to-fputcsv/66682050#66682050

Analytics/ Tracking

Dev-Sandbox — Thu, 18 May 2023 05:31:43 +0000

Scenario Needed: Get Order, Customer Details on Order Confirmation Page

We don't have separated firstname and lastname in stencil.

Solution
If customerId: 0
Get the customer details from Billing address
2 scenarios
- Already customer present, he chose to have the first name.
- New customer, we only have his info via the Billing address. So we will get this from Billing Address.

If Customer is logged in - Get via Graphql.

query Customer {
  customer {
    firstName
    lastName
    email
    entityId
  }
}

BigCommerce New Store

Dev-Sandbox — Mon, 10 Apr 2023 05:05:31 +0000

Hey guys,
We are going to look into a super simple task of creating New Store. It can be super easy by filling all the details here. And boom, we now have the new store and an confirmation email that the store has been created.

Enjoy Folks.

DEV Community: Dev-Sandbox

Bigcommerce Widget Migration

FPUTCSV Custom Function

Analytics/ Tracking

BigCommerce New Store