Bigcommerce Widget Migration
Tags: bigcommerce, widget, pagebuilder, migration
Published: 2023-12-31 10:17:00

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,**

1. The Widget template must be created in the destination store.
2. 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 :)