diff --git a/frontend/src/Editor/Components/FilePicker.jsx b/frontend/src/Editor/Components/FilePicker.jsx
index dcdffb956d..1f31f375ad 100644
--- a/frontend/src/Editor/Components/FilePicker.jsx
+++ b/frontend/src/Editor/Components/FilePicker.jsx
@@ -14,6 +14,8 @@ export const FilePicker = ({
   styles,
 }) => {
   //* properties definitions
+  const instructionText =
+    component.definition.properties.instructionText?.value ?? 'Drag and Drop some files here, or click to select files';
   const enableDropzone = component.definition.properties.enableDropzone.value ?? true;
   const enablePicker = component.definition.properties?.enablePicker?.value ?? true;
   const maxFileCount = component.definition.properties.maxFileCount?.value ?? 2;
@@ -316,7 +318,7 @@ export const FilePicker = ({
         ) : (
           <FilePicker.Signifiers
             signifier={!isDragAccept && !accepted & !isDragReject}
-            feedback={'Drag & drop some files here, or click to select files'}
+            feedback={instructionText}
             cls={`${darkMode ? 'text-secondary' : 'text-dark'} mt-3`}
           />
         )}
diff --git a/frontend/src/Editor/Components/PDF.jsx b/frontend/src/Editor/Components/PDF.jsx
index de749705f4..31a940ea00 100644
--- a/frontend/src/Editor/Components/PDF.jsx
+++ b/frontend/src/Editor/Components/PDF.jsx
@@ -1,4 +1,5 @@
 import React, { useState, useCallback, useRef, useEffect } from 'react';
+// eslint-disable-next-line import/no-unresolved
 import { Document, Page } from 'react-pdf/dist/esm/entry.webpack';
 
 export const PDF = React.memo(({ styles, properties, width, height }) => {
diff --git a/frontend/src/Editor/WidgetManager/widgetConfig.js b/frontend/src/Editor/WidgetManager/widgetConfig.js
index 1e17371576..a4b714fbdc 100644
--- a/frontend/src/Editor/WidgetManager/widgetConfig.js
+++ b/frontend/src/Editor/WidgetManager/widgetConfig.js
@@ -1307,6 +1307,7 @@ export const widgets = [
       showOnMobile: { type: 'toggle', displayName: 'Show on mobile' },
     },
     properties: {
+      instructionText: { type: 'code', displayName: 'Instruction Text' },
       enableDropzone: { type: 'code', displayName: 'Use Drop zone' },
       enablePicker: { type: 'code', displayName: 'Use File Picker' },
       enableMultiple: { type: 'code', displayName: 'Pick multiple files' },
@@ -1340,6 +1341,7 @@ export const widgets = [
         showOnMobile: { value: '{{false}}' },
       },
       properties: {
+        instructionText: { value: 'Drag and Drop some files here, or click to select files' },
         enableDropzone: { value: '{{true}}' },
         enablePicker: { value: '{{true}}' },
         maxFileCount: { value: '{{2}}' },
diff --git a/plugins/packages/woocommerce/lib/operations.json b/plugins/packages/woocommerce/lib/operations.json
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/server/migrations/1653472569828-addedInstructionTextPropInFilePickerWidget.ts b/server/migrations/1653472569828-addedInstructionTextPropInFilePickerWidget.ts
new file mode 100644
index 0000000000..9ec3b042c3
--- /dev/null
+++ b/server/migrations/1653472569828-addedInstructionTextPropInFilePickerWidget.ts
@@ -0,0 +1,42 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+import { AppVersion } from '../src/entities/app_version.entity';
+
+export class addedInstructionTextPropInFilePickerWidget1653472569828 implements MigrationInterface {
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    const entityManager = queryRunner.manager;
+    const appVersions = await entityManager.find(AppVersion);
+
+    for (const version of appVersions) {
+      const definition = version['definition'];
+
+      if (definition) {
+        const components = definition['components'];
+
+        for (const componentId of Object.keys(components)) {
+          const component = components[componentId];
+          if (component.component.component === 'FilePicker') {
+            component.component.definition.properties.instructionText = {
+              value: 'Drag and Drop some files here, or click to select files',
+            };
+            components[componentId] = {
+              ...component,
+              component: {
+                ...component.component,
+                definition: {
+                  ...component.component.definition,
+                },
+              },
+            };
+          }
+        }
+
+        definition['components'] = components;
+        version.definition = definition;
+
+        await entityManager.update(AppVersion, { id: version.id }, { definition });
+      }
+    }
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {}
+}