diff --git a/backend/Actions/PostCreation/PostCreationController.php b/backend/Actions/PostCreation/PostCreationController.php
index 9206ee36d..09619d45a 100644
--- a/backend/Actions/PostCreation/PostCreationController.php
+++ b/backend/Actions/PostCreation/PostCreationController.php
@@ -120,20 +120,30 @@ public static function mbFileMapping($metaboxMapField, $fieldValues, $metaboxFie
     {
         foreach ($metaboxMapField as $fieldPair) {
             if (property_exists($fieldPair, 'metaboxFileUpload')) {
-                if (!empty($fieldValues[$fieldPair->formField])) {
-                    $triggerValue = $fieldPair->formField;
-                    $actionValue = $fieldPair->metaboxFile;
-                    $fieldObject = $metaboxFields->{$actionValue};
+                if (empty($fieldPair->formField) || empty($fieldPair->metaboxFileUpload)) {
+                    continue;
+                }
 
-                    if ($fieldObject['multiple'] == false) {
-                        static::uploadMBFile($postId, $fieldValues[$triggerValue], $fieldObject);
-                    } elseif ($fieldObject['multiple'] == true) {
-                        $attachMentId = Helper::multiFileMoveWpMedia($fieldValues[$triggerValue], $postId);
+                if (empty($fieldValues[$fieldPair->formField])) {
+                    continue;
+                }
+
+                $triggerValue = $fieldPair->formField;
+                $actionValue = $fieldPair->metaboxFileUpload;
+                $fieldObject = isset($metaboxFields[$actionValue]) ? $metaboxFields[$actionValue] : null;
+
+                if (empty($fieldObject)) {
+                    continue;
+                }
+
+                if (empty($fieldObject['multiple'])) {
+                    static::uploadMBFile($postId, $fieldValues[$triggerValue], $fieldObject);
+                } else {
+                    $attachMentId = Helper::multiFileMoveWpMedia($fieldValues[$triggerValue], $postId);
 
-                        if (!empty($attachMentId) && \is_array($attachMentId)) {
-                            foreach ($attachMentId as $attachemnt) {
-                                add_post_meta($postId, $fieldObject['field_name'], $attachemnt);
-                            }
+                    if (!empty($attachMentId) && \is_array($attachMentId)) {
+                        foreach ($attachMentId as $attachemnt) {
+                            add_post_meta($postId, $fieldObject['field_name'], $attachemnt);
                         }
                     }
                 }
@@ -286,6 +296,10 @@ public function execute($integrationData, $fieldValues)
         if (\in_array($fieldValues['bit-integrator%trigger_data%']['triggered_entity'], $triggers)) {
             $fieldValues = Helper::splitStringToarray($fieldValues);
         }
+        $actionType = isset($flowDetails->action_type) ? $flowDetails->action_type : 'createNewPost';
+        if ($actionType !== 'createNewPost') {
+            return $this->executeWordPressPostAction($flowDetails, $fieldValues, $actionType, $integrationData->id);
+        }
 
         $postData = $this->postFieldData($flowDetails);
         $postFieldMap = $flowDetails->post_map;
@@ -363,6 +377,49 @@ public function execute($integrationData, $fieldValues)
         }
     }
 
+    private function executeWordPressPostAction($flowDetails, $fieldValues, $actionType, $integrationId)
+    {
+        $defaultResponse = [
+            'success' => false,
+            'message' => wp_sprintf(
+                // translators: %s: Plugin name
+                __('%s plugin is not installed or activated', 'bit-integrations'),
+                'Bit Integrations Pro'
+            ),
+        ];
+
+        $response = Hooks::apply(
+            Config::withPrefix($actionType),
+            $defaultResponse,
+            $this->buildRequestDataFromPostMap(isset($flowDetails->post_map) ? $flowDetails->post_map : [], $fieldValues),
+        );
+
+        $responseType = isset($response['success']) && $response['success'] ? 'success' : 'error';
+        LogHandler::save($integrationId, ['type' => 'WP Post Creation', 'type_name' => $actionType], $responseType, $response);
+
+        return true;
+    }
+
+    private function buildRequestDataFromPostMap($postMap, $fieldValues)
+    {
+        $dataFinal = [];
+
+        foreach ($postMap as $mapItem) {
+            if (empty($mapItem->formField) || empty($mapItem->postField)) {
+                continue;
+            }
+
+            $triggerValue = $mapItem->formField;
+            $actionValue = $mapItem->postField;
+
+            $dataFinal[$actionValue] = $triggerValue === 'custom' && isset($mapItem->customValue)
+                ? Common::replaceFieldWithValue($mapItem->customValue, $fieldValues)
+                : ($fieldValues[$triggerValue] ?? '');
+        }
+
+        return $dataFinal;
+    }
+
     private static function setPostCategories($postId, $postCategories)
     {
         if (empty($postCategories)) {
diff --git a/backend/Actions/Registration/RegistrationController.php b/backend/Actions/Registration/RegistrationController.php
index f865e5995..98a3efe0c 100644
--- a/backend/Actions/Registration/RegistrationController.php
+++ b/backend/Actions/Registration/RegistrationController.php
@@ -2,7 +2,9 @@
 
 namespace BitApps\Integrations\Actions\Registration;
 
+use BitApps\Integrations\Config;
 use BitApps\Integrations\Core\Util\Common;
+use BitApps\Integrations\Core\Util\Hooks;
 use BitApps\Integrations\Flow\Flow;
 use BitApps\Integrations\Log\LogHandler;
 
@@ -46,6 +48,14 @@ public function createUser($userData, $flowDetails, $fieldValues)
     public function execute($integrationData, $fieldValues)
     {
         $flowDetails = $integrationData->flow_details;
+        $actionType = isset($flowDetails->action_type) ? $flowDetails->action_type : 'new_user';
+
+        if (!\in_array($actionType, ['new_user', 'updated_user'], true)) {
+            $this->executeWordPressUserAction($flowDetails, $fieldValues, $actionType);
+
+            return;
+        }
+
         $userFieldMap = $flowDetails->user_map;
 
         $specialTagValue = Flow::specialTagMappingValue($userFieldMap);
@@ -57,13 +67,54 @@ public function execute($integrationData, $fieldValues)
             $userData['role'] = $flowDetails->user_role;
         }
 
-        if (isset($flowDetails->action_type) && $flowDetails->action_type == 'updated_user') {
+        if ($actionType === 'updated_user') {
             $this->updateUser($userData, $flowDetails, $updatedvalues);
-        } elseif (isset($flowDetails->action_type) && $flowDetails->action_type == 'new_user') {
+        } else {
             $this->createUser($userData, $flowDetails, $updatedvalues);
         }
     }
 
+    private function executeWordPressUserAction($flowDetails, $fieldValues, $actionType)
+    {
+        $defaultResponse = [
+            'success' => false,
+            'message' => wp_sprintf(
+                // translators: %s: Plugin name
+                __('%s plugin is not installed or activated', 'bit-integrations'),
+                'Bit Integrations Pro'
+            ),
+        ];
+
+        $response = Hooks::apply(
+            Config::withPrefix($actionType),
+            $defaultResponse,
+            $this->buildRequestDataFromUserMap(isset($flowDetails->user_map) ? $flowDetails->user_map : [], $fieldValues),
+        );
+
+        $responseType = isset($response['success']) && $response['success'] ? 'success' : 'error';
+        LogHandler::save($this->_integrationID, ['type' => 'WP User Registration', 'type_name' => $actionType], $responseType, $response);
+    }
+
+    private function buildRequestDataFromUserMap($userMap, $fieldValues)
+    {
+        $dataFinal = [];
+
+        foreach ($userMap as $mapItem) {
+            if (empty($mapItem->formField) || empty($mapItem->userField)) {
+                continue;
+            }
+
+            $triggerValue = $mapItem->formField;
+            $actionValue = $mapItem->userField;
+
+            $dataFinal[$actionValue] = $triggerValue === 'custom' && isset($mapItem->customValue)
+                ? Common::replaceFieldWithValue($mapItem->customValue, $fieldValues)
+                : ($fieldValues[$triggerValue] ?? '');
+        }
+
+        return $dataFinal;
+    }
+
     private function userFieldMapping($user_map, $fieldValues, $flowDetails)
     {
         $fieldData = [];
diff --git a/backend/Actions/WordPress/RecordApiHelper.php b/backend/Actions/WordPress/RecordApiHelper.php
new file mode 100644
index 000000000..f4ec7ac5a
--- /dev/null
+++ b/backend/Actions/WordPress/RecordApiHelper.php
@@ -0,0 +1,247 @@
+<?php
+
+namespace BitApps\Integrations\Actions\WordPress;
+
+use BitApps\Integrations\Config;
+use BitApps\Integrations\Core\Util\Common;
+use BitApps\Integrations\Core\Util\Hooks;
+use BitApps\Integrations\Log\LogHandler;
+
+class RecordApiHelper
+{
+    private $_integrationID;
+
+    private $_integrationDetails;
+
+    public function __construct($integrationDetails, $integId)
+    {
+        $this->_integrationDetails = $integrationDetails;
+        $this->_integrationID      = $integId;
+    }
+
+    public function execute($fieldValues, $fieldMap, $integrationDetails)
+    {
+        $fieldData  = $this->generateReqDataFromFieldMap($fieldMap, $fieldValues);
+        $mainAction = isset($this->_integrationDetails->mainAction) ? $this->_integrationDetails->mainAction : '';
+
+        $defaultResponse = [
+            'success' => false,
+            'message' => wp_sprintf(
+                // translators: %s: Plugin name
+                __('%s plugin is not installed or activated', 'bit-integrations'),
+                'Bit Integrations Pro'
+            ),
+        ];
+
+        if (strpos($mainAction, 'get') === 0) {
+            $response = [
+                'success' => false,
+                'message' => __('Get data actions are no longer available in WordPress integration.', 'bit-integrations'),
+            ];
+
+            LogHandler::save($this->_integrationID, ['type' => 'WordPress', 'type_name' => $mainAction], 'error', $response);
+
+            return $response;
+        }
+
+        switch ($mainAction) {
+            // === Post Types ===
+            case 'registerPostType':
+                $response = Hooks::apply(Config::withPrefix('wordpress_registerPostType'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'unregisterPostType':
+                $response = Hooks::apply(Config::withPrefix('wordpress_unregisterPostType'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'addPostTypeFeatures':
+                $response = Hooks::apply(Config::withPrefix('wordpress_addPostTypeFeatures'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            // === Post Tags ===
+            case 'createPostTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createPostTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updatePostTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updatePostTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deletePostTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deletePostTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            case 'addTaxonomyToPost':
+                $response = Hooks::apply(Config::withPrefix('wordpress_addTaxonomyToPost'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'removeTaxonomyFromPost':
+                $response = Hooks::apply(Config::withPrefix('wordpress_removeTaxonomyFromPost'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'addTagsToPost':
+                $response = Hooks::apply(Config::withPrefix('wordpress_addTagsToPost'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'removeTagsFromPost':
+                $response = Hooks::apply(Config::withPrefix('wordpress_removeTagsFromPost'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            // === Media ===
+            case 'addNewImage':
+                $response = Hooks::apply(Config::withPrefix('wordpress_addNewImage'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deleteMedia':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deleteMedia'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'renameMedia':
+                $response = Hooks::apply(Config::withPrefix('wordpress_renameMedia'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            // === Taxonomies ===
+            case 'registerTaxonomy':
+                $response = Hooks::apply(Config::withPrefix('wordpress_registerTaxonomy'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'unregisterTaxonomy':
+                $response = Hooks::apply(Config::withPrefix('wordpress_unregisterTaxonomy'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            // === Terms ===
+            case 'createNewTerm':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createNewTerm'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updateTerm':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updateTerm'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'termDelete':
+                $response = Hooks::apply(Config::withPrefix('wordpress_termDelete'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            // === Categories ===
+            case 'createCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updateCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updateCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deleteCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deleteCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'addCategoryToPost':
+                $response = Hooks::apply(Config::withPrefix('wordpress_addCategoryToPost'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            // === Product Tags (WooCommerce) ===
+            case 'createProductTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createProductTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updateProductTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updateProductTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deleteProductTag':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deleteProductTag'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            // === Product Categories (WooCommerce) ===
+            case 'createProductCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createProductCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updateProductCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updateProductCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deleteProductCategory':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deleteProductCategory'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            // === Product Types (WooCommerce) ===
+            case 'createProductType':
+                $response = Hooks::apply(Config::withPrefix('wordpress_createProductType'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'updateProductType':
+                $response = Hooks::apply(Config::withPrefix('wordpress_updateProductType'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'deleteProductType':
+                $response = Hooks::apply(Config::withPrefix('wordpress_deleteProductType'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+            // === Plugin Management ===
+            case 'checkPluginActivationStatus':
+                $response = Hooks::apply(Config::withPrefix('wordpress_checkPluginActivationStatus'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            case 'activatePlugin':
+                $response = Hooks::apply(Config::withPrefix('wordpress_activatePlugin'), $defaultResponse, $fieldData, $integrationDetails);
+
+                break;
+
+            default:
+                $response = [
+                    'success' => false,
+                    'message' => __('Invalid action', 'bit-integrations'),
+                ];
+
+                break;
+        }
+
+        $responseType = isset($response['success']) && $response['success'] ? 'success' : 'error';
+        LogHandler::save($this->_integrationID, ['type' => 'WordPress', 'type_name' => $mainAction], $responseType, $response);
+
+        return $response;
+    }
+
+    private function generateReqDataFromFieldMap($fieldMap, $fieldValues)
+    {
+        $dataFinal = [];
+
+        foreach ($fieldMap as $item) {
+            $triggerValue = $item->formField;
+            $actionValue  = $item->wordPressField;
+
+            $dataFinal[$actionValue] = $triggerValue === 'custom' && isset($item->customValue)
+                ? Common::replaceFieldWithValue($item->customValue, $fieldValues)
+                : ($fieldValues[$triggerValue] ?? '');
+        }
+
+        return $dataFinal;
+    }
+}
diff --git a/backend/Actions/WordPress/Routes.php b/backend/Actions/WordPress/Routes.php
new file mode 100644
index 000000000..71ec270e8
--- /dev/null
+++ b/backend/Actions/WordPress/Routes.php
@@ -0,0 +1,10 @@
+<?php
+
+if (!defined('ABSPATH')) {
+    exit;
+}
+
+use BitApps\Integrations\Actions\WordPress\WordPressController;
+use BitApps\Integrations\Core\Util\Route;
+
+Route::post('wordpress_authorize', [WordPressController::class, 'wordPressAuthorize']);
diff --git a/backend/Actions/WordPress/WordPressController.php b/backend/Actions/WordPress/WordPressController.php
new file mode 100644
index 000000000..78382a80d
--- /dev/null
+++ b/backend/Actions/WordPress/WordPressController.php
@@ -0,0 +1,22 @@
+<?php
+
+namespace BitApps\Integrations\Actions\WordPress;
+
+class WordPressController
+{
+    public static function wordPressAuthorize()
+    {
+        wp_send_json_success(true);
+    }
+
+    public function execute($integrationData, $fieldValues)
+    {
+        $integrationDetails = $integrationData->flow_details;
+        $integId = $integrationData->id;
+        $fieldMap = isset($integrationDetails->field_map) ? $integrationDetails->field_map : [];
+
+        $recordApiHelper = new RecordApiHelper($integrationDetails, $integId);
+
+        return $recordApiHelper->execute($fieldValues, $fieldMap, $integrationDetails);
+    }
+}
diff --git a/backend/Core/Util/AllTriggersName.php b/backend/Core/Util/AllTriggersName.php
index 951b8dc7c..467479f3a 100644
--- a/backend/Core/Util/AllTriggersName.php
+++ b/backend/Core/Util/AllTriggersName.php
@@ -144,6 +144,7 @@ public static function allTriggersName()
             'WCMemberships'                  => ['name' => 'WooCommerce Memberships',  'isPro' => true, 'is_active' => false],
             'WCSubscriptions'                => ['name' => 'WooCommerce Subscriptions',  'isPro' => true, 'is_active' => false],
             'Webhook'                        => ['name' => 'Webhook',  'isPro' => true, 'is_active' => false],
+            'WordPress'                      => ['name' => 'WordPress',  'isPro' => true, 'is_active' => false],
             'WeForms'                        => ['name' => 'WeForms',  'isPro' => true, 'is_active' => false],
             'WeDocs'                         => ['name' => 'weDocs',  'isPro' => true, 'is_active' => false],
             'WPCourseware'                   => ['name' => 'WP Courseware',  'isPro' => true, 'is_active' => false],
diff --git a/frontend/src/Utils/StaticData/webhookIntegrations.js b/frontend/src/Utils/StaticData/webhookIntegrations.js
index bd468f03a..cec3a619d 100644
--- a/frontend/src/Utils/StaticData/webhookIntegrations.js
+++ b/frontend/src/Utils/StaticData/webhookIntegrations.js
@@ -94,7 +94,10 @@ export const customFormIntegrations = [
   'WeDocs',
   'UserRegistrationMembership',
   'UltimateAffiliatePro',
-  "FluentPdfGenerator"
+  'Registration',
+  'Post',
+  'WordPress',
+  'FluentPdfGenerator'
 ]
 
 export const actionHookIntegrations = ['ActionHook']
diff --git a/frontend/src/components/AllIntegrations/ACPT/ACPTAuthorization.jsx b/frontend/src/components/AllIntegrations/ACPT/ACPTAuthorization.jsx
index 0a3833bd1..b861b748a 100644
--- a/frontend/src/components/AllIntegrations/ACPT/ACPTAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ACPT/ACPTAuthorization.jsx
@@ -2,7 +2,6 @@
 /* eslint-disable no-unused-expressions */
 import { useCallback, useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -47,7 +46,7 @@ const handleInput = useCallback(e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="ACPT" links={tutorialLinks?.acpt || {}} />
+            <TutorialLink linkKey="acpt" />
 
       <div>
         <div className="mt-3">
diff --git a/frontend/src/components/AllIntegrations/AcademyLms/AcademyLmsAuthorization.jsx b/frontend/src/components/AllIntegrations/AcademyLms/AcademyLmsAuthorization.jsx
index 4e674f68a..119bec35b 100644
--- a/frontend/src/components/AllIntegrations/AcademyLms/AcademyLmsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/AcademyLms/AcademyLmsAuthorization.jsx
@@ -4,7 +4,6 @@ import { deepCopy } from '../../../Utils/Helpers'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AcademyLmsAuthorization({
@@ -46,7 +45,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Academy LMS" links={tutorialLinks?.academyLms || {}} />
+            <TutorialLink linkKey="academyLms" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ActiveCampaign/ActiveCampaignAuthorization.jsx b/frontend/src/components/AllIntegrations/ActiveCampaign/ActiveCampaignAuthorization.jsx
index 098263665..b7a63552b 100644
--- a/frontend/src/components/AllIntegrations/ActiveCampaign/ActiveCampaignAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ActiveCampaign/ActiveCampaignAuthorization.jsx
@@ -6,8 +6,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshActiveCampaingHeader, refreshActiveCampaingList } from './ActiveCampaignCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function ActiveCampaignAuthorization({
   formID,
   activeCampaingConf,
@@ -77,7 +75,7 @@ export default function ActiveCampaignAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="ActiveCampaign" links={tutorialLinks?.activeCampaign || {}} />
+            <TutorialLink linkKey="activeCampaign" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Acumbamail/AcumbamailAuthorization.jsx b/frontend/src/components/AllIntegrations/Acumbamail/AcumbamailAuthorization.jsx
index 6a8791821..d825c8d60 100644
--- a/frontend/src/components/AllIntegrations/Acumbamail/AcumbamailAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Acumbamail/AcumbamailAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { fetchAllList, handleAuthorize } from './AcumbamailCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AcumbamailAuthorization({
@@ -43,7 +42,7 @@ export default function AcumbamailAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Acumbamail" links={tutorialLinks?.acumbamail || {}} />
+            <TutorialLink linkKey="acumbamail" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/AdvancedFormIntegration/AdvancedFormIntegration.jsx b/frontend/src/components/AllIntegrations/AdvancedFormIntegration/AdvancedFormIntegration.jsx
index 0025ec7bb..8ee457890 100644
--- a/frontend/src/components/AllIntegrations/AdvancedFormIntegration/AdvancedFormIntegration.jsx
+++ b/frontend/src/components/AllIntegrations/AdvancedFormIntegration/AdvancedFormIntegration.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function AdvancedFormIntegration({ formFields, setFlow, flow, allIntegURL }) {
@@ -33,7 +32,7 @@ return (
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Advanced Form Integration" links={tutorialLinks?.afi || {}} />
+                <TutorialLink linkKey="afi" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Affiliate/AffiliateAuthorization.jsx b/frontend/src/components/AllIntegrations/Affiliate/AffiliateAuthorization.jsx
index 5dcbe7a7b..819624eb1 100644
--- a/frontend/src/components/AllIntegrations/Affiliate/AffiliateAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Affiliate/AffiliateAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AffiliateAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="AffiliateWP" links={tutorialLinks?.affiliate || {}} />
+            <TutorialLink linkKey="affiliate" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/AgiledCRM/AgiledAuthorization.jsx b/frontend/src/components/AllIntegrations/AgiledCRM/AgiledAuthorization.jsx
index 5f7929bb7..155904376 100644
--- a/frontend/src/components/AllIntegrations/AgiledCRM/AgiledAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/AgiledCRM/AgiledAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { agiledAuthentication } from './AgiledCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AgiledAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Agiled CRM" links={tutorialLinks?.agiled || {}} />
+            <TutorialLink linkKey="agiled" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Airtable/AirtableAuthorization.jsx b/frontend/src/components/AllIntegrations/Airtable/AirtableAuthorization.jsx
index a19f5505e..8c20f61af 100644
--- a/frontend/src/components/AllIntegrations/Airtable/AirtableAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Airtable/AirtableAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { airtableAuthentication } from './AirtableCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AirtableAuthorization({
@@ -41,7 +40,7 @@ export default function AirtableAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Airtable" links={tutorialLinks?.airtable || {}} />
+            <TutorialLink linkKey="airtable" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Albato/Albato.jsx b/frontend/src/components/AllIntegrations/Albato/Albato.jsx
index b452dd05b..5fac1ceef 100644
--- a/frontend/src/components/AllIntegrations/Albato/Albato.jsx
+++ b/frontend/src/components/AllIntegrations/Albato/Albato.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Albato({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [albato, setAlbato] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Albato" links={tutorialLinks?.albato || {}} />
+                <TutorialLink linkKey="albato" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/AntApps/AntApps.jsx b/frontend/src/components/AllIntegrations/AntApps/AntApps.jsx
index f4b112622..c1e0d2ebf 100644
--- a/frontend/src/components/AllIntegrations/AntApps/AntApps.jsx
+++ b/frontend/src/components/AllIntegrations/AntApps/AntApps.jsx
@@ -8,8 +8,6 @@ import { saveActionConf } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 function AntApps({ formFields, setFlow, flow, allIntegURL }) {
   const navigate = useNavigate()
   const { formID } = useParams()
@@ -35,7 +33,7 @@ const [antapps, setAntapps] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Ants and Apps" links={tutorialLinks?.antsAndApps || {}} />
+                <TutorialLink linkKey="antsAndApps" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Asana/AsanaAuthorization.jsx b/frontend/src/components/AllIntegrations/Asana/AsanaAuthorization.jsx
index 8ff08352e..2f3a19a29 100644
--- a/frontend/src/components/AllIntegrations/Asana/AsanaAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Asana/AsanaAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { asanaAuthentication } from './AsanaCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function AsanaAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Asana" links={tutorialLinks?.asana || {}} />
+            <TutorialLink linkKey="asana" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/AutomatorWP/AutomatorWP.jsx b/frontend/src/components/AllIntegrations/AutomatorWP/AutomatorWP.jsx
index 5802e573c..2cb74b385 100644
--- a/frontend/src/components/AllIntegrations/AutomatorWP/AutomatorWP.jsx
+++ b/frontend/src/components/AllIntegrations/AutomatorWP/AutomatorWP.jsx
@@ -8,8 +8,6 @@ import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 function AutomatorWP({ formFields, setFlow, flow, allIntegURL }) {
   const navigate = useNavigate()
   const { formID } = useParams()
@@ -34,7 +32,7 @@ const [automatorWP, setAutomatorWP] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="AutomatorWP" links={tutorialLinks?.automatorWP || {}} />
+                <TutorialLink linkKey="automatorWP" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Autonami/AutonamiAuthorization.jsx b/frontend/src/components/AllIntegrations/Autonami/AutonamiAuthorization.jsx
index 51e9e7f21..4afce08db 100644
--- a/frontend/src/components/AllIntegrations/Autonami/AutonamiAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Autonami/AutonamiAuthorization.jsx
@@ -5,8 +5,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import LoaderSm from '../../Loaders/LoaderSm'
 import BackIcn from '../../../Icons/BackIcn'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function AutonamiAuthorization({
   formID,
   autonamiConf,
@@ -55,7 +53,7 @@ const [isLoading, setIsLoading] = useState(false)
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="FunnelKit (Autonami)" links={tutorialLinks?.autonami || {}} />
+                <TutorialLink linkKey="autonami" />
 
         <div className="mt-3">
           <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/BenchMark/BenchMarkAuthorization.jsx b/frontend/src/components/AllIntegrations/BenchMark/BenchMarkAuthorization.jsx
index 2be98e62d..06c245288 100644
--- a/frontend/src/components/AllIntegrations/BenchMark/BenchMarkAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/BenchMark/BenchMarkAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshBenchMarkList, refreshBenchMarkHeader } from './BenchMarkCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function BenchMarkAuthorization({
@@ -76,7 +75,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Benchmark Email" links={tutorialLinks?.benchMark || {}} />
+            <TutorialLink linkKey="benchMark" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Bento/BentoAuthorization.jsx b/frontend/src/components/AllIntegrations/Bento/BentoAuthorization.jsx
index bf85717e8..cf700ef9d 100644
--- a/frontend/src/components/AllIntegrations/Bento/BentoAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Bento/BentoAuthorization.jsx
@@ -2,7 +2,6 @@
 /* eslint-disable no-unused-expressions */
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -42,7 +41,7 @@ const [error, setError] = useState({ publishable_key: '', secret_key: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Bento" links={tutorialLinks?.bento || {}} />
+            <TutorialLink linkKey="bento" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/BitForm/BitFormAuthorization.jsx b/frontend/src/components/AllIntegrations/BitForm/BitFormAuthorization.jsx
index e722eecae..787590b30 100644
--- a/frontend/src/components/AllIntegrations/BitForm/BitFormAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/BitForm/BitFormAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { fetchAllForm, handleAuthorize } from './BitFormCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function BitFormAuthorization({
@@ -43,7 +42,7 @@ const [error, setError] = useState({ dataCenter: '', api_key: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Bit Form" links={tutorialLinks?.bitForm || {}} />
+            <TutorialLink linkKey="bitForm" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/BuddyBoss/BuddyBossAuthorization.jsx b/frontend/src/components/AllIntegrations/BuddyBoss/BuddyBossAuthorization.jsx
index 6383aa401..06df0561b 100644
--- a/frontend/src/components/AllIntegrations/BuddyBoss/BuddyBossAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/BuddyBoss/BuddyBossAuthorization.jsx
@@ -5,8 +5,6 @@ import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function BuddyBossAuthorization({
   formID,
   buddyBossConf,
@@ -48,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="BuddyBoss" links={tutorialLinks?.buddyBoss || {}} />
+            <TutorialLink linkKey="buddyBoss" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/CampaignMonitor/CampaignMonitorAuthorization.jsx b/frontend/src/components/AllIntegrations/CampaignMonitor/CampaignMonitorAuthorization.jsx
index 605ae69f9..14f333c60 100644
--- a/frontend/src/components/AllIntegrations/CampaignMonitor/CampaignMonitorAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CampaignMonitor/CampaignMonitorAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshCampaignMonitorLists } from './CampaignMonitorCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function CampaignMonitorAuthorization({
@@ -94,7 +93,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Campaign Monitor" links={tutorialLinks?.campaignMonitor || {}} />
+            <TutorialLink linkKey="campaignMonitor" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/CapsuleCRM/CapsuleCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/CapsuleCRM/CapsuleCRMAuthorization.jsx
index 29e7127e3..2e5b89112 100644
--- a/frontend/src/components/AllIntegrations/CapsuleCRM/CapsuleCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CapsuleCRM/CapsuleCRMAuthorization.jsx
@@ -5,8 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { capsulecrmAuthentication } from './CapsuleCRMCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function CapsuleCRMAuthorization({
   capsulecrmConf,
   setCapsuleCRMConf,
@@ -40,7 +38,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Capsule CRM" links={tutorialLinks?.capsulecrm || {}} />
+            <TutorialLink linkKey="capsulecrm" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Clickup/ClickupAuthorization.jsx b/frontend/src/components/AllIntegrations/Clickup/ClickupAuthorization.jsx
index e94ab3bc8..1034646ca 100644
--- a/frontend/src/components/AllIntegrations/Clickup/ClickupAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Clickup/ClickupAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { clickupAuthentication } from './ClickupCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import Note from '../../Utilities/Note'
 
@@ -51,7 +50,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="ClickUp" links={tutorialLinks?.clickup || {}} />
+            <TutorialLink linkKey="clickup" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ClinchPad/ClinchPadAuthorization.jsx b/frontend/src/components/AllIntegrations/ClinchPad/ClinchPadAuthorization.jsx
index 639d49539..ef8759988 100644
--- a/frontend/src/components/AllIntegrations/ClinchPad/ClinchPadAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ClinchPad/ClinchPadAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { clinchPadAuthentication } from './ClinchPadCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ClinchPadAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="ClinchPad" links={tutorialLinks?.clinchPad || {}} />
+            <TutorialLink linkKey="clinchPad" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/CompanyHub/CompanyHubAuthorization.jsx b/frontend/src/components/AllIntegrations/CompanyHub/CompanyHubAuthorization.jsx
index b0fcb7aa7..fc29dd636 100644
--- a/frontend/src/components/AllIntegrations/CompanyHub/CompanyHubAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CompanyHub/CompanyHubAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { companyHubAuthentication } from './CompanyHubCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function CompanyHubAuthorization({
@@ -51,7 +50,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="CompanyHub" links={tutorialLinks?.companyHub || {}} />
+            <TutorialLink linkKey="companyHub" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ConstantContact/ConstantContactAuthorization.jsx b/frontend/src/components/AllIntegrations/ConstantContact/ConstantContactAuthorization.jsx
index 7983f8314..6bb5d4774 100644
--- a/frontend/src/components/AllIntegrations/ConstantContact/ConstantContactAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ConstantContact/ConstantContactAuthorization.jsx
@@ -5,7 +5,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import CopyText from '../../Utilities/CopyText'
 import { handleConstantContactAuthorize } from './ConstantContactCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { $appConfigState } from '../../../GlobalStates'
 import { useRecoilValue } from 'recoil'
@@ -83,7 +82,7 @@ const [error, setError] = useState({
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Constant Contact" links={tutorialLinks?.constantContact || {}} />
+            <TutorialLink linkKey="constantContact" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ConvertKit/ConvertKitAuthorization.jsx b/frontend/src/components/AllIntegrations/ConvertKit/ConvertKitAuthorization.jsx
index 02967242e..bd0686eb2 100644
--- a/frontend/src/components/AllIntegrations/ConvertKit/ConvertKitAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ConvertKit/ConvertKitAuthorization.jsx
@@ -5,7 +5,6 @@ import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshConvertKitForm } from './ConvertKitCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ConvertKitAuthorization({
@@ -79,7 +78,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="ConvertKit" links={tutorialLinks?.convertKit || {}} />
+            <TutorialLink linkKey="convertKit" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/CopperCRM/CopperCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/CopperCRM/CopperCRMAuthorization.jsx
index 0a93acfd1..e68db80da 100644
--- a/frontend/src/components/AllIntegrations/CopperCRM/CopperCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CopperCRM/CopperCRMAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { coppercrmAuthentication } from './CopperCRMCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function CopperCRMAuthorization({
@@ -49,7 +48,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Copper CRM" links={tutorialLinks?.coppercrm || {}} />
+            <TutorialLink linkKey="coppercrm" />
 
       <div className="mt-3">
         <bapi_email>{__('Integration Name:', 'bit-integrations')}</bapi_email>
diff --git a/frontend/src/components/AllIntegrations/CreatorLms/CreatorLmsAuthorization.jsx b/frontend/src/components/AllIntegrations/CreatorLms/CreatorLmsAuthorization.jsx
index f39404b7e..df5d019cc 100644
--- a/frontend/src/components/AllIntegrations/CreatorLms/CreatorLmsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CreatorLms/CreatorLmsAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
@@ -19,7 +18,6 @@ export default function CreatorLmsAuthorization({
 }) {
   const [isAuthorized, setIsAuthorized] = useState(false)
   const [showAuthMsg, setShowAuthMsg] = useState(false)
-  const { creatorLms } = tutorialLinks
 
   const authorizeHandler = () => {
     setIsLoading('auth')
@@ -49,10 +47,8 @@ export default function CreatorLmsAuthorization({
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-      {creatorLms?.youTubeLink && (
-        <TutorialLink title="Creator LMS" youTubeLink={creatorLms?.youTubeLink} />
-      )}
-      {creatorLms?.docLink && <TutorialLink title="Creator LMS" docLink={creatorLms?.docLink} />}
+
+      <TutorialLink linkKey="creatorLms" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/CustomAction/CustomAction.jsx b/frontend/src/components/AllIntegrations/CustomAction/CustomAction.jsx
index c6502e036..ccd835dec 100644
--- a/frontend/src/components/AllIntegrations/CustomAction/CustomAction.jsx
+++ b/frontend/src/components/AllIntegrations/CustomAction/CustomAction.jsx
@@ -9,7 +9,6 @@ import CustomActionStepTwo from './CustomActionStepTwo'
 import CustomFuncEditor from './CustomFuncEditor'
 import { checkFunctionValidity } from './CustomFunctionHelper'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 
 const CustomAction = ({ formFields, setFlow, flow, allIntegURL }) => {
@@ -61,7 +60,7 @@ const CustomAction = ({ formFields, setFlow, flow, allIntegURL }) => {
       <div
         className="btcd-stp-page"
         style={{ ...(step === 1 && { width: '70%', height: 'auto', overflow: 'visible' }) }}>
-        <TutorialLink title="Custom Action" links={tutorialLinks?.customAction || {}} />
+        <TutorialLink linkKey="customAction" />
 
         <div className="d-flx my-3">
           <div className="wdt-200 d-in-b mt-3">
diff --git a/frontend/src/components/AllIntegrations/CustomAction/EditCustomAction.jsx b/frontend/src/components/AllIntegrations/CustomAction/EditCustomAction.jsx
index 73061e068..3210f6d3c 100644
--- a/frontend/src/components/AllIntegrations/CustomAction/EditCustomAction.jsx
+++ b/frontend/src/components/AllIntegrations/CustomAction/EditCustomAction.jsx
@@ -14,8 +14,6 @@ import CustomFuncEditor from './CustomFuncEditor'
 import { checkFunctionValidity } from './CustomFunctionHelper'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 function EditCustomAction({ allIntegURL }) {
   const navigate = useNavigate()
   const { formID } = useParams()
@@ -51,7 +49,7 @@ function EditCustomAction({ allIntegURL }) {
         <div
           className="btcd-stp-page"
           style={{ ...(step === 1 && { width: '91%', height: 'auto', overflow: 'visible' }) }}>
-          <TutorialLink title="Custom Action" links={tutorialLinks?.customAction || {}} />
+          <TutorialLink linkKey="customAction" />
           <h1>custom action</h1>
           <CustomFuncEditor
             customActionConf={customActionConf}
diff --git a/frontend/src/components/AllIntegrations/CustomApi/CustomApiAuthorization.jsx b/frontend/src/components/AllIntegrations/CustomApi/CustomApiAuthorization.jsx
index 4a02daad0..1aca9a593 100644
--- a/frontend/src/components/AllIntegrations/CustomApi/CustomApiAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/CustomApi/CustomApiAuthorization.jsx
@@ -6,8 +6,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import MultiSelect from 'react-multiple-select-dropdown-lite'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function CustomApiAuthorization({
   formID,
   customApiConf,
@@ -71,7 +69,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && '1000px' } }}>
-            <TutorialLink title="Custom Api" links={tutorialLinks?.customApi || {}} />
+            <TutorialLink linkKey="customApi" />
 
       <div className="d-flx">
         <div className="wdt-200 d-in-b mt-3">
diff --git a/frontend/src/components/AllIntegrations/Demio/DemioAuthorization.jsx b/frontend/src/components/AllIntegrations/Demio/DemioAuthorization.jsx
index 943536ad4..47ef096f2 100644
--- a/frontend/src/components/AllIntegrations/Demio/DemioAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Demio/DemioAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { demioAuthentication, getAllEvents } from './DemioCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function DemioAuthorization({
@@ -53,7 +52,7 @@ const [error, setError] = useState({ api_key: '', api_secret: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Demio" links={tutorialLinks?.demio || {}} />
+            <TutorialLink linkKey="demio" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/DirectIq/DirectIqAuthorization.jsx b/frontend/src/components/AllIntegrations/DirectIq/DirectIqAuthorization.jsx
index 0aea411e4..d137bdb07 100644
--- a/frontend/src/components/AllIntegrations/DirectIq/DirectIqAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/DirectIq/DirectIqAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshDirectIqList } from './DirectIqCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function DirectIqAuthorization({
@@ -78,7 +77,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="DirectIQ" links={tutorialLinks?.directIq || {}} />
+            <TutorialLink linkKey="directIq" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Discord/DiscordAuthorization.jsx b/frontend/src/components/AllIntegrations/Discord/DiscordAuthorization.jsx
index 62a266665..9baf6df51 100644
--- a/frontend/src/components/AllIntegrations/Discord/DiscordAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Discord/DiscordAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllServers, handleAuthorize } from './DiscordCommonFunc'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function DiscordAuthorization({
@@ -61,7 +60,7 @@ export default function DiscordAuthorization({
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Discord" links={tutorialLinks?.discord || {}} />
+            <TutorialLink linkKey="discord" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Dokan/DokanAuthorization.jsx b/frontend/src/components/AllIntegrations/Dokan/DokanAuthorization.jsx
index b63102395..508b60391 100644
--- a/frontend/src/components/AllIntegrations/Dokan/DokanAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Dokan/DokanAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { dokanAuthentication } from './dokanCommonFunctions'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function DokanAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Dokan" links={tutorialLinks?.dokan || {}} />
+            <TutorialLink linkKey="dokan" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Drip/DripAuthorization.jsx b/frontend/src/components/AllIntegrations/Drip/DripAuthorization.jsx
index df6fe73e0..4035be8ef 100644
--- a/frontend/src/components/AllIntegrations/Drip/DripAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Drip/DripAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { dripAuthentication } from './DripCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import toast from 'react-hot-toast'
 
@@ -56,7 +55,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Drip" links={tutorialLinks?.drip || {}} />
+            <TutorialLink linkKey="drip" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Dropbox/DropboxAuthorization.jsx b/frontend/src/components/AllIntegrations/Dropbox/DropboxAuthorization.jsx
index 4744709a8..d82f8bea4 100644
--- a/frontend/src/components/AllIntegrations/Dropbox/DropboxAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Dropbox/DropboxAuthorization.jsx
@@ -3,7 +3,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllDropboxFolders, handleAuthorize } from './DropboxCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function DropboxAuthorization({
@@ -56,7 +55,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Dropbox" links={tutorialLinks?.dropbox || {}} />
+            <TutorialLink linkKey="dropbox" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/EditInteg.jsx b/frontend/src/components/AllIntegrations/EditInteg.jsx
index a87818398..3f8a3bf63 100644
--- a/frontend/src/components/AllIntegrations/EditInteg.jsx
+++ b/frontend/src/components/AllIntegrations/EditInteg.jsx
@@ -173,6 +173,7 @@ const EditWishlistMember = lazy(() => import('./WishlistMember/EditWishlistMembe
 const EditCreatorLms = lazy(() => import('./CreatorLms/EditCreatorLms'))
 const EditUltimateAffiliatePro = lazy(() => import('./UltimateAffiliatePro/EditUltimateAffiliatePro'))
 const EditFluentCart = lazy(() => import('./FluentCart/EditFluentCart'))
+const EditWordPress = lazy(() => import('./WordPress/EditWordPress'))
 const EditPeepSo = lazy(() => import('./PeepSo/EditPeepSo'))
 const EditNinjaTables = lazy(() => import('./NinjaTables/EditNinjaTables'))
 const EditWCAffiliate = lazy(() => import('./WCAffiliate/EditWCAffiliate'))
@@ -597,6 +598,8 @@ const IntegType = memo(({ allIntegURL, flow }) => {
       return <EditUltimateAffiliatePro allIntegURL={allIntegURL} />
     case 'FluentCart':
       return <EditFluentCart allIntegURL={allIntegURL} />
+    case 'WordPress':
+      return <EditWordPress allIntegURL={allIntegURL} />
     case 'PeepSo':
       return <EditPeepSo allIntegURL={allIntegURL} />
     case 'Ninja Tables':
diff --git a/frontend/src/components/AllIntegrations/ElasticEmail/ElasticEmailAuthorization.jsx b/frontend/src/components/AllIntegrations/ElasticEmail/ElasticEmailAuthorization.jsx
index d26e69ded..977577ad2 100644
--- a/frontend/src/components/AllIntegrations/ElasticEmail/ElasticEmailAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ElasticEmail/ElasticEmailAuthorization.jsx
@@ -7,8 +7,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllList } from './ElasticEmailCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function ElasticEmailAuthorization({
   elasticEmailConf,
   setElasticEmailConf,
@@ -60,7 +58,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Elastic Email" links={tutorialLinks?.elasticEmail || {}} />
+            <TutorialLink linkKey="elasticEmail" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/EmailOctopus/EmailOctopusAuthorization.jsx b/frontend/src/components/AllIntegrations/EmailOctopus/EmailOctopusAuthorization.jsx
index 33b628aea..8cb91ac75 100644
--- a/frontend/src/components/AllIntegrations/EmailOctopus/EmailOctopusAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/EmailOctopus/EmailOctopusAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { emailOctopusAuthentication } from './EmailOctopusCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function EmailOctopusAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="EmailOctopus" links={tutorialLinks?.emailOctopus || {}} />
+            <TutorialLink linkKey="emailOctopus" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Encharge/EnchargeAuthorization.jsx b/frontend/src/components/AllIntegrations/Encharge/EnchargeAuthorization.jsx
index e9bb3fc8d..9a2f23beb 100644
--- a/frontend/src/components/AllIntegrations/Encharge/EnchargeAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Encharge/EnchargeAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { refreshEnchargeHeader } from './EnchargeCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function EnchargeAuthorization({
@@ -61,7 +60,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Encharge" links={tutorialLinks?.encharge || {}} />
+            <TutorialLink linkKey="encharge" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Fabman/FabmanAuthorization.jsx b/frontend/src/components/AllIntegrations/Fabman/FabmanAuthorization.jsx
index 4f575a832..5bc149082 100644
--- a/frontend/src/components/AllIntegrations/Fabman/FabmanAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Fabman/FabmanAuthorization.jsx
@@ -5,7 +5,6 @@ import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { fabmanAuthentication, fetchFabmanWorkspaces } from './FabmanCommonFunc'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 const STEP_ONE_STYLE = { width: 900, height: 'auto' }
@@ -41,7 +40,7 @@ export default function FabmanAuthorization({
 
   return (
     <div className="btcd-stp-page" style={step === 1 ? STEP_ONE_STYLE : undefined}>
-            <TutorialLink title="Fabman" links={tutorialLinks?.fabman || {}} />
+            <TutorialLink linkKey="fabman" />
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
       </div>
diff --git a/frontend/src/components/AllIntegrations/FlowMattic/FlowMattic.jsx b/frontend/src/components/AllIntegrations/FlowMattic/FlowMattic.jsx
index fe635d96b..5b63db90d 100644
--- a/frontend/src/components/AllIntegrations/FlowMattic/FlowMattic.jsx
+++ b/frontend/src/components/AllIntegrations/FlowMattic/FlowMattic.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function FlowMattic({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [flowMattic, setFlowMattic] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="FlowMattic" links={tutorialLinks?.flowMatticLinks || {}} />
+                <TutorialLink linkKey="flowMatticLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Flowlu/FlowluAuthorization.jsx b/frontend/src/components/AllIntegrations/Flowlu/FlowluAuthorization.jsx
index f3d61f9f9..d7cfb7b37 100644
--- a/frontend/src/components/AllIntegrations/Flowlu/FlowluAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Flowlu/FlowluAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { flowluAuthentication } from './FlowluCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function FlowluAuthorization({
@@ -62,7 +61,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Flowlu" links={tutorialLinks?.flowlu || {}} />
+            <TutorialLink linkKey="flowlu" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/FluentCRM/FluentCrmAuthorization.jsx b/frontend/src/components/AllIntegrations/FluentCRM/FluentCrmAuthorization.jsx
index ce899ce77..2eebec83f 100644
--- a/frontend/src/components/AllIntegrations/FluentCRM/FluentCrmAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/FluentCRM/FluentCrmAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import bitsFetch from '../../../Utils/bitsFetch'
 import LoaderSm from '../../Loaders/LoaderSm'
 import BackIcn from '../../../Icons/BackIcn'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function FluentCrmAuthorization({
@@ -55,7 +54,7 @@ const [isMounted, setIsMounted] = useState(true)
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="FluentCRM" links={tutorialLinks?.fluentCrm || {}} />
+                <TutorialLink linkKey="fluentCrm" />
 
         <div className="mt-3">
           <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/FluentCart/FluentCartAuthorization.jsx b/frontend/src/components/AllIntegrations/FluentCart/FluentCartAuthorization.jsx
index c02163691..8b1949073 100644
--- a/frontend/src/components/AllIntegrations/FluentCart/FluentCartAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/FluentCart/FluentCartAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
@@ -46,7 +45,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="FluentCart" links={tutorialLinks?.fluentCart || {}} />
+            <TutorialLink linkKey="fluentCart" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/FluentSupport/FluentSupportAuthorization.jsx b/frontend/src/components/AllIntegrations/FluentSupport/FluentSupportAuthorization.jsx
index e97b681fb..65baf1b4b 100644
--- a/frontend/src/components/AllIntegrations/FluentSupport/FluentSupportAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/FluentSupport/FluentSupportAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getCustomFields, handleAuthorize } from './FluentSupportCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function FluentSupportAuthorization({
@@ -43,7 +42,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Fluent Support" links={tutorialLinks?.fluentSupport || {}} />
+            <TutorialLink linkKey="fluentSupport" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/FreshSales/FreshSalesAuthorization.jsx b/frontend/src/components/AllIntegrations/FreshSales/FreshSalesAuthorization.jsx
index b20d45537..dbb35ec97 100644
--- a/frontend/src/components/AllIntegrations/FreshSales/FreshSalesAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/FreshSales/FreshSalesAuthorization.jsx
@@ -1,6 +1,5 @@
 /* eslint-disable no-unused-expressions */
 import { useState } from 'react'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
@@ -58,7 +57,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Freshsales" links={tutorialLinks?.freshSales || {}} />
+            <TutorialLink linkKey="freshSales" />
 
       <div className="mt-3">
         <b>{__('Bundle Alias(Your Account URL):', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Freshdesk/FreshdeskAuthorization.jsx b/frontend/src/components/AllIntegrations/Freshdesk/FreshdeskAuthorization.jsx
index 85fe17a49..26c280cf3 100644
--- a/frontend/src/components/AllIntegrations/Freshdesk/FreshdeskAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Freshdesk/FreshdeskAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllTicketFields, handleAuthorize } from './FreshdeskCommonFunc'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function FreshdeskAuthorization({
@@ -78,7 +77,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Freshdesk" links={tutorialLinks?.freshdesk || {}} />
+            <TutorialLink linkKey="freshdesk" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GamiPress/GamiPressAuthorization.jsx b/frontend/src/components/AllIntegrations/GamiPress/GamiPressAuthorization.jsx
index 5aade949d..4e18a15d2 100644
--- a/frontend/src/components/AllIntegrations/GamiPress/GamiPressAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GamiPress/GamiPressAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GamiPressAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="GamiPress" links={tutorialLinks?.gamiPress || {}} />
+            <TutorialLink linkKey="gamiPress" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GetResponse/GetResponseAuthorization.jsx b/frontend/src/components/AllIntegrations/GetResponse/GetResponseAuthorization.jsx
index ae8ff215c..5faf845dd 100644
--- a/frontend/src/components/AllIntegrations/GetResponse/GetResponseAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GetResponse/GetResponseAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { fetchCustomFields, getresponseAuthentication } from './GetResponseCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GetResponseAuthorization({
@@ -63,7 +62,7 @@ useEffect(() => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="GetResponse" links={tutorialLinks?.getResponse || {}} />
+            <TutorialLink linkKey="getResponse" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Getgist/GetgistAuthorization.jsx b/frontend/src/components/AllIntegrations/Getgist/GetgistAuthorization.jsx
index 5b7865506..1103b0190 100644
--- a/frontend/src/components/AllIntegrations/Getgist/GetgistAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Getgist/GetgistAuthorization.jsx
@@ -3,7 +3,6 @@ import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GetgistAuthorization({ getgistConf, setGetgistConf, step, setstep, isInfo }) {
@@ -52,7 +51,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="GetGist" links={tutorialLinks?.getgist || {}} />
+            <TutorialLink linkKey="getgist" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GiveWp/GiveWpAuthorization.jsx b/frontend/src/components/AllIntegrations/GiveWp/GiveWpAuthorization.jsx
index 0df7f4fd7..8d0bcd513 100644
--- a/frontend/src/components/AllIntegrations/GiveWp/GiveWpAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GiveWp/GiveWpAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GiveWpAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="GiveWp" links={tutorialLinks?.giveWp || {}} />
+            <TutorialLink linkKey="giveWp" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GoogleCalendar/GoogleCalendarAuthorization.jsx b/frontend/src/components/AllIntegrations/GoogleCalendar/GoogleCalendarAuthorization.jsx
index 4bd950bf8..fc94c800d 100644
--- a/frontend/src/components/AllIntegrations/GoogleCalendar/GoogleCalendarAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GoogleCalendar/GoogleCalendarAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { getAllGoogleCalendarLists, handleAuthorize } from './GoogleCalendarCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GoogleCalendarAuthorization({
@@ -46,7 +45,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Google Calendar" links={tutorialLinks?.googleCalendar || {}} />
+            <TutorialLink linkKey="googleCalendar" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GoogleContacts/GoogleContactsAuthorization.jsx b/frontend/src/components/AllIntegrations/GoogleContacts/GoogleContactsAuthorization.jsx
index 7ca2f6bde..3bc654906 100644
--- a/frontend/src/components/AllIntegrations/GoogleContacts/GoogleContactsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GoogleContacts/GoogleContactsAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from './GoogleContactsCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GoogleContactsAuthorization({
@@ -45,7 +44,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Google Contacts" links={tutorialLinks?.googleContacts || {}} />
+            <TutorialLink linkKey="googleContacts" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GoogleDrive/GoogleDriveAuthorization.jsx b/frontend/src/components/AllIntegrations/GoogleDrive/GoogleDriveAuthorization.jsx
index 54be78e86..70485a19a 100644
--- a/frontend/src/components/AllIntegrations/GoogleDrive/GoogleDriveAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GoogleDrive/GoogleDriveAuthorization.jsx
@@ -7,8 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { getAllGoogleDriveFolders, handleAuthorize } from './GoogleDriveCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function GoogleDriveAuthorization({
   flowID,
   googleDriveConf,
@@ -46,7 +44,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Google Drive" links={tutorialLinks?.googleDrive || {}} />
+            <TutorialLink linkKey="googleDrive" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/GoogleSheet/GoogleSheetAuthorization.jsx b/frontend/src/components/AllIntegrations/GoogleSheet/GoogleSheetAuthorization.jsx
index ed69d906a..ab875e064 100644
--- a/frontend/src/components/AllIntegrations/GoogleSheet/GoogleSheetAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/GoogleSheet/GoogleSheetAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize, refreshSpreadsheets, tokenHelper } from './GoogleSheetCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import SelectAuthorizationType from '../../OneClickRadioComponents/SelectAuthorizationType'
 import AuthorizationAccountList from '../../OneClickRadioComponents/AuthorizationAccountList'
@@ -95,7 +94,7 @@ const [authData, setAuthData] = useState([])
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Google Sheets" links={tutorialLinks?.googleSheet || {}} />
+            <TutorialLink linkKey="googleSheet" />
 
       {selectedAuthType === 'Custom Authorization' && (
         <div>
diff --git a/frontend/src/components/AllIntegrations/Gravitec/GravitecAuthorization.jsx b/frontend/src/components/AllIntegrations/Gravitec/GravitecAuthorization.jsx
index c6dbb2f6b..6167d3165 100644
--- a/frontend/src/components/AllIntegrations/Gravitec/GravitecAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Gravitec/GravitecAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { gravitecAuthentication } from './GravitecCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GravitecAuthorization({
@@ -50,7 +49,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Gravitec" links={tutorialLinks?.gravitec || {}} />
+            <TutorialLink linkKey="gravitec" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Groundhogg/GroundhoggAuthorization.jsx b/frontend/src/components/AllIntegrations/Groundhogg/GroundhoggAuthorization.jsx
index 932d11ccf..0aaacb7bb 100644
--- a/frontend/src/components/AllIntegrations/Groundhogg/GroundhoggAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Groundhogg/GroundhoggAuthorization.jsx
@@ -5,7 +5,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import Note from '../../Utilities/Note'
 import { handleAuthorize, fetchAllTags } from './GroundhoggCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function GroundhoggAuthorization({
@@ -51,7 +50,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Groundhogg" links={tutorialLinks?.groundhogg || {}} />
+            <TutorialLink linkKey="groundhogg" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/HighLevel/HighLevelAuthorization.jsx b/frontend/src/components/AllIntegrations/HighLevel/HighLevelAuthorization.jsx
index 4f50e424e..691771334 100644
--- a/frontend/src/components/AllIntegrations/HighLevel/HighLevelAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/HighLevel/HighLevelAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { highLevelAuthentication } from './HighLevelCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import toast from 'react-hot-toast'
 import { useRecoilValue } from 'recoil'
@@ -48,7 +47,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="HighLevel" links={tutorialLinks?.highLevel || {}} />
+            <TutorialLink linkKey="highLevel" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Hubspot/HubspotAuthorization.jsx b/frontend/src/components/AllIntegrations/Hubspot/HubspotAuthorization.jsx
index 1e82f6def..9bc42f64f 100644
--- a/frontend/src/components/AllIntegrations/Hubspot/HubspotAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Hubspot/HubspotAuthorization.jsx
@@ -7,7 +7,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { hubspotAuthorization } from './HubspotCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function HubspotAuthorization({
@@ -57,7 +56,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="HubSpot" links={tutorialLinks?.hubspot || {}} />
+            <TutorialLink linkKey="hubspot" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/IFTTT/IFTTT.jsx b/frontend/src/components/AllIntegrations/IFTTT/IFTTT.jsx
index 2a9c38c2b..91e7458e6 100644
--- a/frontend/src/components/AllIntegrations/IFTTT/IFTTT.jsx
+++ b/frontend/src/components/AllIntegrations/IFTTT/IFTTT.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function IFTTT({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [ifttt, setIfttt] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="IFTTT" links={tutorialLinks?.iFTTT || {}} />
+                <TutorialLink linkKey="iFTTT" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Insightly/InsightlyAuthorization.jsx b/frontend/src/components/AllIntegrations/Insightly/InsightlyAuthorization.jsx
index d1c84e565..57838d327 100644
--- a/frontend/src/components/AllIntegrations/Insightly/InsightlyAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Insightly/InsightlyAuthorization.jsx
@@ -5,8 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { insightlyAuthentication } from './InsightlyCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function InsightlyAuthorization({
   insightlyConf,
   setInsightlyConf,
@@ -40,7 +38,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Insightly" links={tutorialLinks?.insightly || {}} />
+            <TutorialLink linkKey="insightly" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/IntegInfo.jsx b/frontend/src/components/AllIntegrations/IntegInfo.jsx
index 0a797372c..0566f2956 100644
--- a/frontend/src/components/AllIntegrations/IntegInfo.jsx
+++ b/frontend/src/components/AllIntegrations/IntegInfo.jsx
@@ -176,6 +176,7 @@ const UltimateAffiliateProAuthorization = lazy(
   () => import('./UltimateAffiliatePro/UltimateAffiliateProAuthorization')
 )
 const FluentCartAuthorization = lazy(() => import('./FluentCart/FluentCartAuthorization'))
+const WordPressAuthorization = lazy(() => import('./WordPress/WordPressAuthorization'))
 const PeepSoAuthorization = lazy(() => import('./PeepSo/PeepSoAuthorization'))
 const NinjaTablesAuthorization = lazy(() => import('./NinjaTables/NinjaTablesAuthorization'))
 const WCAffiliateAuthorization = lazy(() => import('./WCAffiliate/WCAffiliateAuthorization'))
@@ -640,6 +641,8 @@ export default function IntegInfo() {
         )
       case 'FluentCart':
         return <FluentCartAuthorization fluentCartConf={integrationConf} step={1} isInfo />
+      case 'WordPress':
+        return <WordPressAuthorization wordPressConf={integrationConf} step={1} isInfo />
       case 'PeepSo':
         return <PeepSoAuthorization peepSoConf={integrationConf} step={1} isInfo />
       case 'Ninja Tables':
diff --git a/frontend/src/components/AllIntegrations/Integrately/Integrately.jsx b/frontend/src/components/AllIntegrations/Integrately/Integrately.jsx
index 289d17ae3..59475b8ca 100644
--- a/frontend/src/components/AllIntegrations/Integrately/Integrately.jsx
+++ b/frontend/src/components/AllIntegrations/Integrately/Integrately.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Integrately({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [integrately, setIntegrately] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Integrately" links={tutorialLinks?.integratelyLinks || {}} />
+                <TutorialLink linkKey="integratelyLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/IntegrationHelpers/WebHook/WebHooksIntegration.jsx b/frontend/src/components/AllIntegrations/IntegrationHelpers/WebHook/WebHooksIntegration.jsx
index c336365db..e21cc9b4c 100644
--- a/frontend/src/components/AllIntegrations/IntegrationHelpers/WebHook/WebHooksIntegration.jsx
+++ b/frontend/src/components/AllIntegrations/IntegrationHelpers/WebHook/WebHooksIntegration.jsx
@@ -12,7 +12,6 @@ import TableCheckBox from '../../../Utilities/TableCheckBox'
 import ConditionalLogic from '../../../ConditionalLogic'
 import Note from '../../../Utilities/Note'
 import TutorialLink from '../../../Utilities/TutorialLink'
-import tutorialLinks from '../../../../Utils/StaticData/tutorialLinks'
 
 export default function WebHooksIntegration({
   formFields,
@@ -91,7 +90,7 @@ export default function WebHooksIntegration({
 
   return (
     <div style={{ ...{ width: isInfo && 900 } }}>
-      <TutorialLink title="Web Hooks" links={tutorialLinks?.webHooksLinks || {}} />
+      <TutorialLink linkKey="webHooksLinks" />
       <div className="flx ">
         <div className="w-8 mr-2 mt-2 mb-4">
           <div className="f-m">{__('Integration Name', 'bit-integrations')}</div>
diff --git a/frontend/src/components/AllIntegrations/Integromat/Integromat.jsx b/frontend/src/components/AllIntegrations/Integromat/Integromat.jsx
index ffd1caf0a..2eba42906 100644
--- a/frontend/src/components/AllIntegrations/Integromat/Integromat.jsx
+++ b/frontend/src/components/AllIntegrations/Integromat/Integromat.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Integromat({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [integromat, setIntegromat] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Make (Integromat)" links={tutorialLinks?.integromatLinks || {}} />
+                <TutorialLink linkKey="integromatLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/JetEngine/JetEngineAuthorization.jsx b/frontend/src/components/AllIntegrations/JetEngine/JetEngineAuthorization.jsx
index ca657ff29..2c842c376 100644
--- a/frontend/src/components/AllIntegrations/JetEngine/JetEngineAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/JetEngine/JetEngineAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { jetEngineAuthentication } from './jetEngineCommonFunctions'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function JetEngineAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="jet Engine" links={tutorialLinks?.jetEngine || {}} />
+            <TutorialLink linkKey="jetEngine" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Keap/KeapAuthorization.jsx b/frontend/src/components/AllIntegrations/Keap/KeapAuthorization.jsx
index 936f48109..d56943908 100644
--- a/frontend/src/components/AllIntegrations/Keap/KeapAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Keap/KeapAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize, refreshCustomFields } from './KeapCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function KeapAuthorization({
@@ -45,7 +44,7 @@ export default function KeapAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-      <TutorialLink title="Keap" links={tutorialLinks?.keap || {}} />
+      <TutorialLink linkKey="keap" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/KirimEmail/KirimEmailAuthorization.jsx b/frontend/src/components/AllIntegrations/KirimEmail/KirimEmailAuthorization.jsx
index 02da0323e..b8a4923d1 100644
--- a/frontend/src/components/AllIntegrations/KirimEmail/KirimEmailAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/KirimEmail/KirimEmailAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './KirimEmailCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function KirmilEmailAuthorization({
@@ -42,7 +41,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Kirim Email" links={tutorialLinks?.kirimEmail || {}} />
+            <TutorialLink linkKey="kirimEmail" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Klaviyo/KlaviyoAuthorization.jsx b/frontend/src/components/AllIntegrations/Klaviyo/KlaviyoAuthorization.jsx
index c9fec2dba..b9fb7713f 100644
--- a/frontend/src/components/AllIntegrations/Klaviyo/KlaviyoAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Klaviyo/KlaviyoAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { handleAuthorize } from './KlaviyoCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function KlaviyoAuthorization({
@@ -57,7 +56,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Klaviyo" links={tutorialLinks?.klaviyo || {}} />
+            <TutorialLink linkKey="klaviyo" />
 
       <div className="mt-2">
         <div className="my-1">
diff --git a/frontend/src/components/AllIntegrations/KonnectzIT/KonnectzIT.jsx b/frontend/src/components/AllIntegrations/KonnectzIT/KonnectzIT.jsx
index abe1c0a41..187e613e2 100644
--- a/frontend/src/components/AllIntegrations/KonnectzIT/KonnectzIT.jsx
+++ b/frontend/src/components/AllIntegrations/KonnectzIT/KonnectzIT.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function KonnectzIT({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [konnectzIT, setKonnectzIT] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="KonnectzIT" links={tutorialLinks?.konnectzITLinks || {}} />
+                <TutorialLink linkKey="konnectzITLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/LMFWC/LMFWCAuthorization.jsx b/frontend/src/components/AllIntegrations/LMFWC/LMFWCAuthorization.jsx
index ce197a7b5..4f35a13be 100644
--- a/frontend/src/components/AllIntegrations/LMFWC/LMFWCAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/LMFWC/LMFWCAuthorization.jsx
@@ -2,7 +2,6 @@
 /* eslint-disable no-unused-expressions */
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -62,7 +61,7 @@ const [error, setError] = useState({ api_key: '', api_secret: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="License Manager For WooCommerce" links={tutorialLinks?.lmfwc || {}} />
+            <TutorialLink linkKey="lmfwc" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/LearnDash/LearnDashAuthorization.jsx b/frontend/src/components/AllIntegrations/LearnDash/LearnDashAuthorization.jsx
index a69f4446d..f400fe4eb 100644
--- a/frontend/src/components/AllIntegrations/LearnDash/LearnDashAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/LearnDash/LearnDashAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function LearnDashAuthorization({
@@ -48,7 +47,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="LearnDash" links={tutorialLinks?.learnDash || {}} />
+            <TutorialLink linkKey="learnDash" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Lemlist/LemlistAuthorization.jsx b/frontend/src/components/AllIntegrations/Lemlist/LemlistAuthorization.jsx
index 02714e07f..eb6a09d8c 100644
--- a/frontend/src/components/AllIntegrations/Lemlist/LemlistAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Lemlist/LemlistAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshLemlistCampaign } from './LemlistCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function LemlistAuthorization({
@@ -91,7 +90,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Lemlist" links={tutorialLinks?.lemlist || {}} />
+            <TutorialLink linkKey="lemlist" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/LifterLms/LifterLmsAuthorization.jsx b/frontend/src/components/AllIntegrations/LifterLms/LifterLmsAuthorization.jsx
index c06f80b13..4c700ce73 100644
--- a/frontend/src/components/AllIntegrations/LifterLms/LifterLmsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/LifterLms/LifterLmsAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function LifterLmsAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="LifterLMS" links={tutorialLinks?.lifterLms || {}} />
+            <TutorialLink linkKey="lifterLms" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Line/LineAuthorization.jsx b/frontend/src/components/AllIntegrations/Line/LineAuthorization.jsx
index 1c3a4a683..f73e8d6c8 100644
--- a/frontend/src/components/AllIntegrations/Line/LineAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Line/LineAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './LineCommonFunc'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function LineAuthorization({
@@ -44,7 +43,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Line" links={tutorialLinks?.line || {}} />
+            <TutorialLink linkKey="line" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/LionDesk/LionDeskAuthorization.jsx b/frontend/src/components/AllIntegrations/LionDesk/LionDeskAuthorization.jsx
index 508ddc95e..34ac54b7f 100644
--- a/frontend/src/components/AllIntegrations/LionDesk/LionDeskAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/LionDesk/LionDeskAuthorization.jsx
@@ -9,8 +9,6 @@ import CopyText from '../../Utilities/CopyText'
 import Note from '../../Utilities/Note'
 import { handleAuthorize } from './LionDeskCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function LionDeskAuthorization({
   lionDeskConf,
   setLionDeskConf,
@@ -58,7 +56,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="LionDesk" links={tutorialLinks?.lionDesk || {}} />
+            <TutorialLink linkKey="lionDesk" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Livestorm/LivestormAuthorization.jsx b/frontend/src/components/AllIntegrations/Livestorm/LivestormAuthorization.jsx
index 75bd1fa0d..e528debd9 100644
--- a/frontend/src/components/AllIntegrations/Livestorm/LivestormAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Livestorm/LivestormAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { getAllEvents, livestormAuthentication } from './LivestormCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function LivestormAuthorization({
@@ -52,7 +51,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Livestorm" links={tutorialLinks?.livestorm || {}} />
+            <TutorialLink linkKey="livestorm" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mail/Mail.jsx b/frontend/src/components/AllIntegrations/Mail/Mail.jsx
index 113484ce3..4bd19f778 100644
--- a/frontend/src/components/AllIntegrations/Mail/Mail.jsx
+++ b/frontend/src/components/AllIntegrations/Mail/Mail.jsx
@@ -6,7 +6,6 @@ import { useRecoilState, useRecoilValue } from 'recoil'
 import { $actionConf, $appConfigState, $formFields, $newFlow } from '../../../GlobalStates'
 import { __ } from '../../../Utils/i18nwrap'
 import { SmartTagField } from '../../../Utils/StaticData/SmartTagField'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import ConditionalLogic from '../../ConditionalLogic'
 import LoaderSm from '../../Loaders/LoaderSm'
 import DropDown from '../../Utilities/DropDown'
@@ -171,7 +170,7 @@ const btcbi = useRecoilValue($appConfigState)
   return (
     <div>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
-            <TutorialLink title="Mail" links={tutorialLinks?.mailLinks || {}} />
+            <TutorialLink linkKey="mailLinks" />
 
       <span className="f-m wdt-200 d-in-b">{__('Integration Name', 'bit-integration')}</span>
       <input
diff --git a/frontend/src/components/AllIntegrations/MailBluster/MailBlusterAuthorization.jsx b/frontend/src/components/AllIntegrations/MailBluster/MailBlusterAuthorization.jsx
index dbc999f71..96fc938cc 100644
--- a/frontend/src/components/AllIntegrations/MailBluster/MailBlusterAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailBluster/MailBlusterAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { mailBlusterAuthentication } from './MailBlusterCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailBlusterAuthorization({
@@ -58,7 +57,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MailBluster" links={tutorialLinks?.mailBluster || {}} />
+            <TutorialLink linkKey="mailBluster" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailChimp/MailChimpAuthorization.jsx b/frontend/src/components/AllIntegrations/MailChimp/MailChimpAuthorization.jsx
index 401458bf3..0ead95f79 100644
--- a/frontend/src/components/AllIntegrations/MailChimp/MailChimpAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailChimp/MailChimpAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleMailChimpAuthorize, refreshAudience, refreshModules } from './MailChimpCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailChimpAuthorization({
@@ -42,7 +41,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Mail chimp" links={tutorialLinks?.mailchimp || {}} />
+            <TutorialLink linkKey="mailchimp" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailMint/MailMintAuthorization.jsx b/frontend/src/components/AllIntegrations/MailMint/MailMintAuthorization.jsx
index 1a145c454..569f7a64d 100644
--- a/frontend/src/components/AllIntegrations/MailMint/MailMintAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailMint/MailMintAuthorization.jsx
@@ -5,7 +5,6 @@ import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllList, getAllTags, mailMintRefreshFields } from './MailMintCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailMintAuthorization({
@@ -51,7 +50,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Mail Mint" links={tutorialLinks?.mailMint || {}} />
+            <TutorialLink linkKey="mailMint" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailPoet/MailPoetAuthorization.jsx b/frontend/src/components/AllIntegrations/MailPoet/MailPoetAuthorization.jsx
index 691f0e497..2f91e5f4b 100644
--- a/frontend/src/components/AllIntegrations/MailPoet/MailPoetAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailPoet/MailPoetAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import bitsFetch from '../../../Utils/bitsFetch'
 import LoaderSm from '../../Loaders/LoaderSm'
 import BackIcn from '../../../Icons/BackIcn'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailPoetAuthorization({
@@ -43,7 +42,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MailPoet" links={tutorialLinks?.mailPoet || {}} />
+            <TutorialLink linkKey="mailPoet" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailRelay/MailRelayAuthorization.jsx b/frontend/src/components/AllIntegrations/MailRelay/MailRelayAuthorization.jsx
index 4fe85c025..a1f1711a1 100644
--- a/frontend/src/components/AllIntegrations/MailRelay/MailRelayAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailRelay/MailRelayAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { mailRelayAuthentication } from './MailRelayCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailRelayAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MailRelay" links={tutorialLinks?.mailRelay || {}} />
+            <TutorialLink linkKey="mailRelay" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailerLite/MailerLiteAuthorization.jsx b/frontend/src/components/AllIntegrations/MailerLite/MailerLiteAuthorization.jsx
index 46cd780a2..fb5af28b0 100644
--- a/frontend/src/components/AllIntegrations/MailerLite/MailerLiteAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailerLite/MailerLiteAuthorization.jsx
@@ -1,7 +1,6 @@
 /* eslint-disable no-unused-expressions */
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -57,7 +56,7 @@ const url =
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MailerLite" links={tutorialLinks?.mailerLite || {}} />
+            <TutorialLink linkKey="mailerLite" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MailerPress/MailerPressAuthorization.jsx b/frontend/src/components/AllIntegrations/MailerPress/MailerPressAuthorization.jsx
index c2d850bc8..7403142ec 100644
--- a/frontend/src/components/AllIntegrations/MailerPress/MailerPressAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MailerPress/MailerPressAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
@@ -46,7 +45,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="MailerPress" links={tutorialLinks?.mailerPress || {}} />
+            <TutorialLink linkKey="mailerPress" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mailercloud/MailercloudAuthorization.jsx b/frontend/src/components/AllIntegrations/Mailercloud/MailercloudAuthorization.jsx
index 855e0197d..9f0649ef6 100644
--- a/frontend/src/components/AllIntegrations/Mailercloud/MailercloudAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mailercloud/MailercloudAuthorization.jsx
@@ -6,7 +6,6 @@ import Input from '../../Utilities/Input'
 import Note from '../../Utilities/Note'
 import StepPage from '../../Utilities/StepPage'
 import { getAllLists, handleAuthorize, handleInput } from './MailercloudCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { __ } from '../../../Utils/i18nwrap'
 
@@ -55,7 +54,7 @@ const nextPage = async () => {
 
   return (
     <StepPage step={step} stepNo={1} style={{ width: 900, height: 'auto' }}>
-            <TutorialLink title="Mailercloud" links={tutorialLinks?.mailercloud || {}} />
+            <TutorialLink linkKey="mailercloud" />
 
       <div className="mt-2">
         {/* Mailercloud Authorization */}
diff --git a/frontend/src/components/AllIntegrations/Mailify/MailifyAuthorization.jsx b/frontend/src/components/AllIntegrations/Mailify/MailifyAuthorization.jsx
index 55273b2ca..16575859a 100644
--- a/frontend/src/components/AllIntegrations/Mailify/MailifyAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mailify/MailifyAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshMailifyList } from './MailifyCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailifyAuthorization({
@@ -100,7 +99,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Mailify (Sarbacane)" links={tutorialLinks?.mailify || {}} />
+            <TutorialLink linkKey="mailify" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mailjet/MailjetAuthorization.jsx b/frontend/src/components/AllIntegrations/Mailjet/MailjetAuthorization.jsx
index f2bf9cb19..593b8dd98 100644
--- a/frontend/src/components/AllIntegrations/Mailjet/MailjetAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mailjet/MailjetAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { mailjetAuthentication } from './MailjetCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailjetAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Mailjet" links={tutorialLinks?.mailjet || {}} />
+            <TutorialLink linkKey="mailjet" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mailster/MailsterAuthorization.jsx b/frontend/src/components/AllIntegrations/Mailster/MailsterAuthorization.jsx
index 70b340e8e..ae70c11c9 100644
--- a/frontend/src/components/AllIntegrations/Mailster/MailsterAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mailster/MailsterAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { mailsterAuthentication } from './MailsterCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailsterAuthorization({
@@ -43,7 +42,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Mailster" links={tutorialLinks?.mailster || {}} />
+            <TutorialLink linkKey="mailster" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mailup/MailupAuthorization.jsx b/frontend/src/components/AllIntegrations/Mailup/MailupAuthorization.jsx
index 4df8c25d4..41b57e298 100644
--- a/frontend/src/components/AllIntegrations/Mailup/MailupAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mailup/MailupAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleMailupAuthorize, fetchAllList } from './MailupCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MailupAuthorization({
@@ -42,7 +41,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MailUp" links={tutorialLinks?.mailup || {}} />
+            <TutorialLink linkKey="mailup" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLms.jsx b/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLms.jsx
index 2994fa020..fb8967705 100644
--- a/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLms.jsx
+++ b/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLms.jsx
@@ -11,7 +11,6 @@ import IntegrationStepThree from '../IntegrationHelpers/IntegrationStepThree'
 import { handleInput, checkMappedFields } from './MasterStudyLmsCommonFunc'
 import MasterStudyLmsAuthorization from './MasterStudyLmsAuthorization'
 import MasterStudyLmsIntegLayout from './MasterStudyLmsIntegLayout'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function MasterStudyLms({ formFields, setFlow, flow, allIntegURL, isInfo, edit }) {
diff --git a/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLmsAuthorization.jsx b/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLmsAuthorization.jsx
index 1248280ee..7892fab5c 100644
--- a/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLmsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MasterStudyLms/MasterStudyLmsAuthorization.jsx
@@ -5,8 +5,6 @@ import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function MasterStudyLmsAuthorization({
   formID,
   msLmsConf,
@@ -47,7 +45,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="MasterStudy LMS" links={tutorialLinks?.masterStudyLMS || {}} />
+            <TutorialLink linkKey="masterStudyLMS" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Mautic/MauticAuthorization.jsx b/frontend/src/components/AllIntegrations/Mautic/MauticAuthorization.jsx
index e7ca87081..d52f291d2 100644
--- a/frontend/src/components/AllIntegrations/Mautic/MauticAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Mautic/MauticAuthorization.jsx
@@ -5,8 +5,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleMauticAuthorize, getAllFields } from './MauticCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function MauticAuthorization({
   mauticConf,
   setMauticConf,
@@ -41,7 +39,7 @@ export default function MauticAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Mautic" links={tutorialLinks?.mautic || {}} />
+            <TutorialLink linkKey="mautic" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Memberpress/MemberpressAuthorization.jsx b/frontend/src/components/AllIntegrations/Memberpress/MemberpressAuthorization.jsx
index 15ec26acb..dbe68e998 100644
--- a/frontend/src/components/AllIntegrations/Memberpress/MemberpressAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Memberpress/MemberpressAuthorization.jsx
@@ -5,7 +5,6 @@ import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllMemberShip, paymentGateway } from './MemberpressCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MemberpressAuthorization({
@@ -51,7 +50,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="MemberPress" links={tutorialLinks?.memberpress || {}} />
+            <TutorialLink linkKey="memberpress" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Moosend/MoosendAuthorization.jsx b/frontend/src/components/AllIntegrations/Moosend/MoosendAuthorization.jsx
index cbfc5436a..67316b7a2 100644
--- a/frontend/src/components/AllIntegrations/Moosend/MoosendAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Moosend/MoosendAuthorization.jsx
@@ -6,7 +6,6 @@ import Input from '../../Utilities/Input'
 import Note from '../../Utilities/Note'
 import StepPage from '../../Utilities/StepPage'
 import { getAllLists, handleAuthorize, handleInput } from './MoosendCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { __ } from '../../../Utils/i18nwrap'
 
@@ -50,7 +49,7 @@ function MoosendAuthorization({
 
   return (
     <StepPage step={step} stepNo={1} style={{ width: 900, height: 'auto' }}>
-            <TutorialLink title="Moosend" links={tutorialLinks?.moosend || {}} />
+            <TutorialLink linkKey="moosend" />
 
       <div className="mt-2">
         {/* Moosend Authorization */}
diff --git a/frontend/src/components/AllIntegrations/MoxieCRM/MoxieCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/MoxieCRM/MoxieCRMAuthorization.jsx
index 439b1da09..18460e669 100644
--- a/frontend/src/components/AllIntegrations/MoxieCRM/MoxieCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/MoxieCRM/MoxieCRMAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { moxiecrmAuthentication } from './MoxieCRMCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function MoxieCRMAuthorization({
@@ -50,7 +49,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="MoxieCRM" links={tutorialLinks?.moxiecrm || {}} />
+            <TutorialLink linkKey="moxiecrm" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/N8n/N8n.jsx b/frontend/src/components/AllIntegrations/N8n/N8n.jsx
index 856f61f23..4c1802acf 100644
--- a/frontend/src/components/AllIntegrations/N8n/N8n.jsx
+++ b/frontend/src/components/AllIntegrations/N8n/N8n.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function N8n({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [n8n, setN8n] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="n8n.io" links={tutorialLinks?.n8nLinks || {}} />
+                <TutorialLink linkKey="n8nLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/NewInteg.jsx b/frontend/src/components/AllIntegrations/NewInteg.jsx
index 59978c59c..11fd3e442 100644
--- a/frontend/src/components/AllIntegrations/NewInteg.jsx
+++ b/frontend/src/components/AllIntegrations/NewInteg.jsx
@@ -172,6 +172,7 @@ const WishlistMember = lazy(() => import('./WishlistMember/WishlistMember'))
 const CreatorLms = lazy(() => import('./CreatorLms/CreatorLms'))
 const UltimateAffiliatePro = lazy(() => import('./UltimateAffiliatePro/UltimateAffiliatePro'))
 const FluentCart = lazy(() => import('./FluentCart/FluentCart'))
+const WordPress = lazy(() => import('./WordPress/WordPress'))
 const PeepSo = lazy(() => import('./PeepSo/PeepSo'))
 const NinjaTables = lazy(() => import('./NinjaTables/NinjaTables'))
 const WCAffiliate = lazy(() => import('./WCAffiliate/WCAffiliate'))
@@ -1679,6 +1680,15 @@ export default function NewInteg({ allIntegURL }) {
             setFlow={setFlow}
           />
         )
+      case 'WordPress':
+        return (
+          <WordPress
+            allIntegURL={allIntegURL}
+            formFields={flow?.triggerData?.fields}
+            flow={flow}
+            setFlow={setFlow}
+          />
+        )
       case 'PeepSo':
         return (
           <PeepSo
diff --git a/frontend/src/components/AllIntegrations/Newsletter/NewsletterAuthorization.jsx b/frontend/src/components/AllIntegrations/Newsletter/NewsletterAuthorization.jsx
index 344b34891..bb7c106b4 100644
--- a/frontend/src/components/AllIntegrations/Newsletter/NewsletterAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Newsletter/NewsletterAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { newsletterAuthentication } from './NewsletterCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function NewsletterAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Newsletter" links={tutorialLinks?.newsletter || {}} />
+            <TutorialLink linkKey="newsletter" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Nimble/NimbleAuthorization.jsx b/frontend/src/components/AllIntegrations/Nimble/NimbleAuthorization.jsx
index 7e544e86f..4ffda11f3 100644
--- a/frontend/src/components/AllIntegrations/Nimble/NimbleAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Nimble/NimbleAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { getAllFields, nimbleAuthentication } from './NimbleCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function NimbleAuthorization({
@@ -51,7 +50,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="NimbleCRM" links={tutorialLinks?.nimble || {}} />
+            <TutorialLink linkKey="nimble" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/NinjaTables/NinjaTablesAuthorization.jsx b/frontend/src/components/AllIntegrations/NinjaTables/NinjaTablesAuthorization.jsx
index 6051107f3..ea479e079 100644
--- a/frontend/src/components/AllIntegrations/NinjaTables/NinjaTablesAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/NinjaTables/NinjaTablesAuthorization.jsx
@@ -1,7 +1,6 @@
 import { useState } from 'react'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
diff --git a/frontend/src/components/AllIntegrations/NotificationX/NotificationXAuthorization.jsx b/frontend/src/components/AllIntegrations/NotificationX/NotificationXAuthorization.jsx
index a3764a079..7213600f5 100644
--- a/frontend/src/components/AllIntegrations/NotificationX/NotificationXAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/NotificationX/NotificationXAuthorization.jsx
@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -28,7 +27,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="NotificationX" links={tutorialLinks?.notificationX || {}} />
+            <TutorialLink linkKey="notificationX" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Notion/NotionAuthorization.jsx b/frontend/src/components/AllIntegrations/Notion/NotionAuthorization.jsx
index e6220e188..bf68b575e 100644
--- a/frontend/src/components/AllIntegrations/Notion/NotionAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Notion/NotionAuthorization.jsx
@@ -8,7 +8,6 @@ import Input from '../../Utilities/Input'
 import Note from '../../Utilities/Note'
 import StepPage from '../../Utilities/StepPage'
 import { getAllDatabaseLists, handleAuthorize, handleInput } from './NotionCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { __ } from '../../../Utils/i18nwrap'
 
@@ -51,7 +50,7 @@ const nextPage = async () => {
 `
   return (
     <StepPage step={step} stepNo={1} style={{ width: 900, height: 'auto' }}>
-            <TutorialLink title="Notion" links={tutorialLinks?.notion || {}} />
+            <TutorialLink linkKey="notion" />
 
       <div className="mt-2">
         {/* Notion Authorization */}
diff --git a/frontend/src/components/AllIntegrations/NutshellCRM/NutshellCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/NutshellCRM/NutshellCRMAuthorization.jsx
index 1f1b1fafb..1893afe4f 100644
--- a/frontend/src/components/AllIntegrations/NutshellCRM/NutshellCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/NutshellCRM/NutshellCRMAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { nutshellCRMAuthentication } from './NutshellCRMCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function NutshellCRMAuthorization({
@@ -52,7 +51,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Nutshell CRM" links={tutorialLinks?.nutshellCRM || {}} />
+            <TutorialLink linkKey="nutshellCRM" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/OmniSend/OmniSendAuthorization.jsx b/frontend/src/components/AllIntegrations/OmniSend/OmniSendAuthorization.jsx
index 4db277038..5dc9a1872 100644
--- a/frontend/src/components/AllIntegrations/OmniSend/OmniSendAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/OmniSend/OmniSendAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { handleOmniSendAuthorize } from './OmniSendCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function OmniSendAuthorization({
@@ -59,7 +58,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Omnisend" links={tutorialLinks?.omniSend || {}} />
+            <TutorialLink linkKey="omniSend" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/OneDrive/OneDriveAuthorization.jsx b/frontend/src/components/AllIntegrations/OneDrive/OneDriveAuthorization.jsx
index af07d0488..1ec2843e9 100644
--- a/frontend/src/components/AllIntegrations/OneDrive/OneDriveAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/OneDrive/OneDriveAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { getAllOneDriveFolders, handleAuthorize } from './OneDriveCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function OneDriveAuthorization({
@@ -46,7 +45,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="OneDrive" links={tutorialLinks?.oneDrive || {}} />
+            <TutorialLink linkKey="oneDrive" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/OneHashCRM/OneHashCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/OneHashCRM/OneHashCRMAuthorization.jsx
index ed592a6ba..6706c23ac 100644
--- a/frontend/src/components/AllIntegrations/OneHashCRM/OneHashCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/OneHashCRM/OneHashCRMAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { oneHashCRMAuthentication } from './OneHashCRMCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function OneHashCRMAuthorization({
@@ -59,7 +58,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="oneHashCRM" links={tutorialLinks?.oneHashCRM || {}} />
+            <TutorialLink linkKey="oneHashCRM" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/PCloud/PCloudAuthorization.jsx b/frontend/src/components/AllIntegrations/PCloud/PCloudAuthorization.jsx
index 5aff8489a..de12b5aea 100644
--- a/frontend/src/components/AllIntegrations/PCloud/PCloudAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/PCloud/PCloudAuthorization.jsx
@@ -7,7 +7,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { getAllPCloudFolders, handleAuthorization } from './PCloudCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function PCloudAuthorization({
@@ -47,7 +46,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="pCloud" links={tutorialLinks?.pCloud || {}} />
+            <TutorialLink linkKey="pCloud" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Pabbly/Pabbly.jsx b/frontend/src/components/AllIntegrations/Pabbly/Pabbly.jsx
index 3245b78a2..42823b915 100644
--- a/frontend/src/components/AllIntegrations/Pabbly/Pabbly.jsx
+++ b/frontend/src/components/AllIntegrations/Pabbly/Pabbly.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Pabbly({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [pabbly, setPabbly] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Pabbly" links={tutorialLinks?.pabblyLinks || {}} />
+                <TutorialLink linkKey="pabblyLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/PaidMembershipPro/PaidMembershipProAuthorization.jsx b/frontend/src/components/AllIntegrations/PaidMembershipPro/PaidMembershipProAuthorization.jsx
index 7ecb34270..427f8f4c4 100644
--- a/frontend/src/components/AllIntegrations/PaidMembershipPro/PaidMembershipProAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/PaidMembershipPro/PaidMembershipProAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function PaidMembershipProAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Paid Memberships Pro" links={tutorialLinks?.paidMembershipPro || {}} />
+            <TutorialLink linkKey="paidMembershipPro" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/PerfexCRM/PerfexCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/PerfexCRM/PerfexCRMAuthorization.jsx
index e5966be57..d16fd8f9c 100644
--- a/frontend/src/components/AllIntegrations/PerfexCRM/PerfexCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/PerfexCRM/PerfexCRMAuthorization.jsx
@@ -7,8 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { perfexCRMAuthentication } from './PerfexCRMCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function PerfexCRMAuthorization({
   perfexCRMConf,
   setPerfexCRMConf,
@@ -69,7 +67,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Perfex CRM" links={tutorialLinks?.perfexCRM || {}} />
+            <TutorialLink linkKey="perfexCRM" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/PipeDrive/PipeDriveAuthorization.jsx b/frontend/src/components/AllIntegrations/PipeDrive/PipeDriveAuthorization.jsx
index 4dd2dc61e..9f3b0e7da 100644
--- a/frontend/src/components/AllIntegrations/PipeDrive/PipeDriveAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/PipeDrive/PipeDriveAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { handleAuthorize } from './PipeDriveCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function PipeDriveAuthorization({
@@ -55,7 +54,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Pipedrive" links={tutorialLinks?.pipeDrive || {}} />
+            <TutorialLink linkKey="pipeDrive" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Pods/Pods.jsx b/frontend/src/components/AllIntegrations/Pods/Pods.jsx
index 29b66a204..c6c66483a 100644
--- a/frontend/src/components/AllIntegrations/Pods/Pods.jsx
+++ b/frontend/src/components/AllIntegrations/Pods/Pods.jsx
@@ -11,7 +11,6 @@ import { postFields } from '../../../Utils/StaticData/postField'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TableCheckBox from '../../Utilities/TableCheckBox'
 import ConditionalLogic from '../../ConditionalLogic'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Pods({ formFields, setFlow, flow, allIntegURL }) {
@@ -119,7 +118,7 @@ const [podsConf, setPodsConf] = useState({
   return (
     <div style={{ width: 900 }}>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
-            <TutorialLink title="PODS" links={tutorialLinks?.podLinks || {}} />
+            <TutorialLink linkKey="podLinks" />
 
       <div className="mt-3">
         <b>{__('Integration Name', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/PostCreation/Post.jsx b/frontend/src/components/AllIntegrations/PostCreation/Post.jsx
index 947c48f99..e54026d56 100644
--- a/frontend/src/components/AllIntegrations/PostCreation/Post.jsx
+++ b/frontend/src/components/AllIntegrations/PostCreation/Post.jsx
@@ -1,18 +1,20 @@
 import { useEffect, useState } from 'react'
-import { useNavigate, useParams } from 'react-router'
+import { useNavigate } from 'react-router'
 import { __ } from '../../../Utils/i18nwrap'
-// import { postFields } from '../../../Utils/StaticData/postField'
 import Cooltip from '../../Utilities/Cooltip'
 import SnackMsg from '../../Utilities/SnackMsg'
 import Steps from '../../Utilities/Steps'
 import CustomField from './CustomField'
-import { postFields } from '../../../Utils/StaticData/postField'
 import {
   addFieldMap,
   checkMappedAcfFields,
   checkMappedJEFields,
   checkMappedMbFields,
   checkMappedPostFields,
+  generatePostCreationFieldMap,
+  getPostCreationFieldsByAction,
+  isLegacyPostCreationAction,
+  postCreationExtraActions,
   refreshPostCategories,
   refreshPostTypes
 } from './PostHelperFunction'
@@ -20,33 +22,33 @@ import FieldMap from './FieldMap'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import IntegrationStepThree from '../IntegrationHelpers/IntegrationStepThree'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import MultiSelect from 'react-multiple-select-dropdown-lite'
 import 'react-multiple-select-dropdown-lite/dist/index.css'
 import { useRecoilValue } from 'recoil'
 import { $appConfigState } from '../../../GlobalStates'
 import { ProFeatureTitle } from '../IntegrationHelpers/ActionProFeatureLabels'
+import { checkIsPro, getProLabel } from '../../Utilities/ProUtilHelpers'
 
 function Post({ formFields, setFlow, flow, allIntegURL }) {
   const [users, setUsers] = useState([])
   const [postTypes, setPostTypes] = useState([])
   const [postCategories, setPostCategories] = useState([])
   const navigate = useNavigate()
-  const { formID } = useParams()
   const [isLoading, setIsLoading] = useState(false)
   const [step, setstep] = useState(1)
   const [snack, setSnackbar] = useState({ show: false })
   const [acf, setAcf] = useState({ fields: [], files: [] })
   const [mb, setMb] = useState({ fields: [], files: [] })
   const [jeCPTMeta, setJeCPTMeta] = useState({ fields: [], files: [] })
-const btcbi = useRecoilValue($appConfigState)
+  const btcbi = useRecoilValue($appConfigState)
   const { isPro } = btcbi
 
   const [postConf, setPostConf] = useState({
     name: 'WP Post Creation',
     type: 'WP Post Creation',
-    post_map: [{ post_author: 'logged_in_user' }],
+    action_type: 'createNewPost',
+    post_map: generatePostCreationFieldMap('createNewPost'),
     acf_map: [{}],
     acf_file_map: [{}],
     metabox_map: [{}],
@@ -72,10 +74,14 @@ const btcbi = useRecoilValue($appConfigState)
       const { data } = res
       setPostTypes(data)
     })
+
     const newConf = { ...postConf }
-    newConf.post_map = postFields
-      .filter(fld => fld.required)
-      .map(fl => ({ formField: '', postField: fl.key, required: fl.required }))
+    if (!newConf.action_type) {
+      newConf.action_type = 'createNewPost'
+    }
+    if (!newConf?.post_map?.[0]?.postField) {
+      newConf.post_map = generatePostCreationFieldMap(newConf.action_type)
+    }
     setPostConf(newConf)
   }, [])
 
@@ -116,11 +122,22 @@ const btcbi = useRecoilValue($appConfigState)
       }
     })
 
-    //  tmpData.metabox_map = postFields.filter(fld => fld.required).map(fl => ({ formField: '', postFormField: fl.key, required: fl.required }))
     setPostConf(tmpData)
-    // setLoad(false)
   }
 
+  const setActionType = actionType => {
+    const nextAction = actionType || 'createNewPost'
+    setPostConf(prevConf => ({
+      ...prevConf,
+      action_type: nextAction,
+      post_map: generatePostCreationFieldMap(nextAction)
+    }))
+    setstep(1)
+  }
+
+  const isLegacyAction = isLegacyPostCreationAction(postConf?.action_type)
+  const selectedPostFields = getPostCreationFieldsByAction(postConf?.action_type || 'createNewPost')
+
   const nextPage = stepNo => {
     setTimeout(() => {
       document.getElementById('btcd-settings-wrp').scrollTop = 0
@@ -130,16 +147,17 @@ const btcbi = useRecoilValue($appConfigState)
       setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
       return
     }
-    if (!postConf.post_type) {
+
+    if (isLegacyAction && !postConf.post_type) {
       setSnackbar({ show: true, msg: __("Post Type can't be empty", 'bit-integrations') })
       return
     }
-    if (!postConf.post_status) {
+    if (isLegacyAction && !postConf.post_status) {
       setSnackbar({ show: true, msg: __("Post Status can't be empty", 'bit-integrations') })
       return
     }
 
-    if (stepNo === 3) {
+    if (isLegacyAction && stepNo === 3) {
       if (!checkMappedAcfFields(postConf)) {
         setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
         return
@@ -174,7 +192,7 @@ const btcbi = useRecoilValue($appConfigState)
   return (
     <div>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
-            <TutorialLink title="WP Post Creation" links={tutorialLinks?.postCreation || {}} />
+      <TutorialLink linkKey="postCreation" />
 
       <div className="txt-center mt-2">
         <Steps step={3} active={step} />
@@ -194,155 +212,176 @@ const btcbi = useRecoilValue($appConfigState)
           placeholder={__('Integration Name...', 'bit-integrations')}
         />
 
-        <div className="mt-3 flx">
-          <b>{__('Post Type', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__(
-                'Select one of the defined WordPress post types Or custom post types for the post',
-                'bit-integrations'
-              )}
-              <br />
-            </div>
-          </Cooltip>
+        <div className="mt-3">
+          <b>{__('Action Type', 'bit-integrations')}</b>
         </div>
-        <div>
-          <select
-            name="post_type"
-            onChange={e => getCustomFields(e.target.name, e.target.value)}
-            className="btcd-paper-inp w-5 mt-1">
-            <option disabled selected>
-              {__('Select Post Type', 'bit-integrations')}
+        <select
+          className="btcd-paper-inp w-5 mt-1"
+          value={postConf?.action_type || 'createNewPost'}
+          onChange={e => setActionType(e.target.value)}>
+          {postCreationExtraActions.map(action => (
+            <option key={action.value} value={action.value} disabled={!checkIsPro(isPro, action.is_pro)}>
+              {checkIsPro(isPro, action.is_pro) ? action.label : getProLabel(action.label)}
             </option>
-            {postTypes?.map((postType, key) => (
-              <option key={`acf-${key * 2}`} value={postType?.id}>
-                {postType?.title}
-              </option>
-            ))}
-          </select>
-          <button
-            onClick={() => refreshPostTypes(postTypes, setPostTypes)}
-            className="icn-btn sh-sm ml-2 mr-2 tooltip"
-            style={{ '--tooltip-txt': `'${__('Refresh Post Types', 'bit-integrations')}'` }}
-            type="button">
-            &#x21BB;
-          </button>
-        </div>
+          ))}
+        </select>
 
-        <div className="mt-3">
-          <b>{__('Post Categories', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__('Select one or multiple categories for the post', 'bit-integrations')}
-              <br />
+        {isLegacyAction && (
+          <>
+            <div className="mt-3 flx">
+              <b>{__('Post Type', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Select one of the defined WordPress post types Or custom post types for the post',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div>
+              <select
+                name="post_type"
+                onChange={e => getCustomFields(e.target.name, e.target.value)}
+                className="btcd-paper-inp w-5 mt-1">
+                <option disabled selected>
+                  {__('Select Post Type', 'bit-integrations')}
+                </option>
+                {postTypes?.map((postType, key) => (
+                  <option key={`acf-${key * 2}`} value={postType?.id}>
+                    {postType?.title}
+                  </option>
+                ))}
+              </select>
+              <button
+                onClick={() => refreshPostTypes(setPostTypes)}
+                className="icn-btn sh-sm ml-2 mr-2 tooltip"
+                style={{ '--tooltip-txt': `'${__('Refresh Post Types', 'bit-integrations')}'` }}
+                type="button">
+                &#x21BB;
+              </button>
             </div>
-          </Cooltip>
-        </div>
-        <div className='flx'>
-          <MultiSelect
-            key={`post-categories-${postConf?.post_type || 'default'}-${postConf?.post_categories || ''}`}
-            className="mt-2 w-5"
-            defaultValue={postConf?.post_categories || ''}
-            options={postCategories}
-            onChange={val => handleInput('post_categories', val)}
-          />
-          <button
-            onClick={() => refreshPostCategories(postConf?.post_type, setPostCategories)}
-            className="icn-btn sh-sm ml-2 mr-2 tooltip"
-            style={{ '--tooltip-txt': `'${__('Refresh Post Categories', 'bit-integrations')}'` }}
-            type="button">
-            &#x21BB;
-          </button>
-        </div>
 
-        <div className="mt-3">
-          <b>{__('Post Status', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__(
-                'Select the status for the post. If published status is selected and the post date is in the future, it will automatically be changed to scheduled',
-                'bit-integrations'
-              )}
-              <br />
+            <div className="mt-3">
+              <b>{__('Post Categories', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__('Select one or multiple categories for the post', 'bit-integrations')}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div className="flx">
+              <MultiSelect
+                key={`post-categories-${postConf?.post_type || 'default'}-${postConf?.post_categories || ''}`}
+                className="mt-2 w-5"
+                defaultValue={postConf?.post_categories || ''}
+                options={postCategories}
+                onChange={val => handleInput('post_categories', val)}
+              />
+              <button
+                onClick={() => refreshPostCategories(postConf?.post_type, setPostCategories)}
+                className="icn-btn sh-sm ml-2 mr-2 tooltip"
+                style={{ '--tooltip-txt': `'${__('Refresh Post Categories', 'bit-integrations')}'` }}
+                type="button">
+                &#x21BB;
+              </button>
             </div>
-          </Cooltip>
-        </div>
-        <select
-          name="post_status"
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          className="btcd-paper-inp w-5 mt-2">
-          <option disabled selected>
-            {__('Select Status', 'bit-integrations')}
-          </option>
-          <option value="publish">{__('Publish', 'bit-integrations')}</option>
-          <option value="draft">{__('Draft', 'bit-integrations')}</option>
-          <option value="auto-draft">{__('Auto-Draft', 'bit-integrations')}</option>
-          <option value="private">{__('Private', 'bit-integrations')}</option>
-          <option value="pending">{__('Pending', 'bit-integrations')}</option>
-        </select>
 
-        <div className="mt-3 flx">
-          <b>{__('Author', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {('Select the user to be assigned to the post', 'bit-integrations')}
-              <br />
+            <div className="mt-3">
+              <b>{__('Post Status', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Select the status for the post. If published status is selected and the post date is in the future, it will automatically be changed to scheduled',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
             </div>
-          </Cooltip>
-        </div>
-        <div>
-          <select
-            name="post_author"
-            onChange={e => handleInput(e.target.name, e.target.value)}
-            className="btcd-paper-inp w-5 mt-2">
-            <option disabled selected>
-              {__('Select Author', 'bit-integrations')}
-            </option>
-            <option value="logged_in_user">{__('Logged In User', 'bit-integrations')}</option>
-            {users?.map((user, key) => (
-              <option key={`acf-${key * 2}`} value={user.ID}>
-                {user.display_name}
+            <select
+              name="post_status"
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              className="btcd-paper-inp w-5 mt-2">
+              <option disabled selected>
+                {__('Select Status', 'bit-integrations')}
               </option>
-            ))}
-          </select>
-        </div>
-
-        <div className="mt-3">
-          <b>{__('Comment Status', 'bit-integrations')}</b>
-        </div>
-        <select
-          name="comment_status"
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          className="btcd-paper-inp w-5 mt-2">
-          <option disabled selected>
-            {__('Select Status', 'bit-integrations')}
-          </option>
-          <option value="open">{__('Open', 'bit-integrations')}</option>
-          <option value="closed">{__('Closed', 'bit-integrations')}</option>
-        </select>
+              <option value="publish">{__('Publish', 'bit-integrations')}</option>
+              <option value="draft">{__('Draft', 'bit-integrations')}</option>
+              <option value="auto-draft">{__('Auto-Draft', 'bit-integrations')}</option>
+              <option value="private">{__('Private', 'bit-integrations')}</option>
+              <option value="pending">{__('Pending', 'bit-integrations')}</option>
+            </select>
+
+            <div className="mt-3 flx">
+              <b>{__('Author', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__('Select the user to be assigned to the post', 'bit-integrations')}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div>
+              <select
+                name="post_author"
+                onChange={e => handleInput(e.target.name, e.target.value)}
+                className="btcd-paper-inp w-5 mt-2">
+                <option disabled selected>
+                  {__('Select Author', 'bit-integrations')}
+                </option>
+                <option value="logged_in_user">{__('Logged In User', 'bit-integrations')}</option>
+                {users?.map((user, key) => (
+                  <option key={`acf-${key * 2}`} value={user.ID}>
+                    {user.display_name}
+                  </option>
+                ))}
+              </select>
+            </div>
 
-        <div className="mt-3">
-          <b>
-            <ProFeatureTitle title={__('Add Post Tags', 'bit-integrations')} />
-          </b>
-
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__('Use commas to separate multiple tags. Example: tag1, tag2, tag3', 'bit-integrations')}
-              <br />
+            <div className="mt-3">
+              <b>{__('Comment Status', 'bit-integrations')}</b>
+            </div>
+            <select
+              name="comment_status"
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              className="btcd-paper-inp w-5 mt-2">
+              <option disabled selected>
+                {__('Select Status', 'bit-integrations')}
+              </option>
+              <option value="open">{__('Open', 'bit-integrations')}</option>
+              <option value="closed">{__('Closed', 'bit-integrations')}</option>
+            </select>
+
+            <div className="mt-3">
+              <b>
+                <ProFeatureTitle title={__('Add Post Tags', 'bit-integrations')} />
+              </b>
+
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Use commas to separate multiple tags. Example: tag1, tag2, tag3',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
             </div>
-          </Cooltip>
-        </div>
 
-        <input
-          className="btcd-paper-inp w-5 mt-2 "
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          name="post_tags"
-          value={postConf.post_tags}
-          type="text"
-          placeholder={__('Add Post Tags...', 'bit-integrations')}
-          disabled={!isPro}
-        />
+            <input
+              className="btcd-paper-inp w-5 mt-2 "
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              name="post_tags"
+              value={postConf.post_tags}
+              type="text"
+              placeholder={__('Add Post Tags...', 'bit-integrations')}
+              disabled={!isPro}
+            />
+          </>
+        )}
 
         <div>
           <div className="mt-3 mb-1">
@@ -368,13 +407,15 @@ const btcbi = useRecoilValue($appConfigState)
             formFields={formFields}
             postConf={postConf}
             setPostConf={setPostConf}
-            customFields={postFields}
+            customFields={selectedPostFields}
           />
         ))}
 
         <div className="txt-center btcbi-field-map-button mt-2">
           <button
-            onClick={() => addFieldMap('post_map', postConf.post_map.length, postConf, setPostConf)}
+            onClick={() =>
+              addFieldMap('post_map', postConf?.post_map?.length || 0, postConf, setPostConf)
+            }
             className="icn-btn sh-sm"
             type="button">
             +
@@ -382,38 +423,36 @@ const btcbi = useRecoilValue($appConfigState)
         </div>
 
         <button
-          onClick={() => nextPage(2)}
+          onClick={() => nextPage(isLegacyAction ? 2 : 3)}
           className="btn f-right btcd-btn-lg purple sh-sm flx"
           type="button">
           {__('Next', 'bit-integrations')}
           <div className="btcd-icn icn-arrow_back rev-icn d-in-b" />
         </button>
       </div>
-      <div
-        className="btcd-stp-page"
-        style={{ ...(step === 2 && { width: 900, height: 'auto', overflow: 'visible' }) }}>
-        <CustomField
-          formID={formID}
-          formFields={formFields}
-          handleInput={e => handleInput(e, postConf, setPostConf, formID, setIsLoading, setSnackbar)}
-          postConf={postConf}
-          setPostConf={setPostConf}
-          isLoading={isLoading}
-          setIsLoading={setIsLoading}
-          setSnackbar={setSnackbar}
-          acfFields={acf}
-          mbFields={mb}
-          jeCPTFields={jeCPTMeta}
-        />
 
-        <button
-          onClick={() => nextPage(3)}
-          className="btn f-right btcd-btn-lg purple sh-sm flx"
-          type="button">
-          {__('Next', 'bit-integrations')}
-          <div className="btcd-icn icn-arrow_back rev-icn d-in-b" />
-        </button>
-      </div>
+      {isLegacyAction && (
+        <div
+          className="btcd-stp-page"
+          style={{ ...(step === 2 && { width: 900, height: 'auto', overflow: 'visible' }) }}>
+          <CustomField
+            formFields={formFields}
+            postConf={postConf}
+            setPostConf={setPostConf}
+            acfFields={acf}
+            mbFields={mb}
+            jeCPTFields={jeCPTMeta}
+          />
+
+          <button
+            onClick={() => nextPage(3)}
+            className="btn f-right btcd-btn-lg purple sh-sm flx"
+            type="button">
+            {__('Next', 'bit-integrations')}
+            <div className="btcd-icn icn-arrow_back rev-icn d-in-b" />
+          </button>
+        </div>
+      )}
 
       <IntegrationStepThree
         step={step}
diff --git a/frontend/src/components/AllIntegrations/PostCreation/PostEdit.jsx b/frontend/src/components/AllIntegrations/PostCreation/PostEdit.jsx
index fa36469fe..65cc7fd8f 100644
--- a/frontend/src/components/AllIntegrations/PostCreation/PostEdit.jsx
+++ b/frontend/src/components/AllIntegrations/PostCreation/PostEdit.jsx
@@ -3,10 +3,8 @@ import { useNavigate, useParams } from 'react-router'
 import { useRecoilState, useRecoilValue } from 'recoil'
 import { $actionConf, $appConfigState, $formFields, $newFlow } from '../../../GlobalStates'
 import { deepCopy } from '../../../Utils/Helpers'
-import { postFields } from '../../../Utils/StaticData/postField'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-// import { postFields } from '../../../Utils/StaticData/postField'
 import Cooltip from '../../Utilities/Cooltip'
 import SnackMsg from '../../Utilities/SnackMsg'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
@@ -20,19 +18,25 @@ import {
   checkMappedJEFields,
   checkMappedMbFields,
   checkMappedPostFields,
+  generatePostCreationFieldMap,
+  getPostCreationFieldsByAction,
+  isLegacyPostCreationAction,
+  postCreationExtraActions,
   refreshPostCategories,
   refreshPostTypes
 } from './PostHelperFunction'
 import { ProFeatureTitle } from '../IntegrationHelpers/ActionProFeatureLabels'
+import { checkIsPro, getProLabel } from '../../Utilities/ProUtilHelpers'
 import MultiSelect from 'react-multiple-select-dropdown-lite'
 import 'react-multiple-select-dropdown-lite/dist/index.css'
+import TutorialLink from '../../Utilities/TutorialLink'
 
 function Post({ allIntegURL }) {
   const [users, setUsers] = useState([])
   const [postTypes, setPostTypes] = useState([])
   const [postCategories, setPostCategories] = useState([])
   const navigate = useNavigate()
-  const { formID, id } = useParams()
+  const { id } = useParams()
   const [postConf, setPostConf] = useRecoilState($actionConf)
   const formFields = useRecoilValue($formFields)
   const [flow, setFlow] = useRecoilState($newFlow)
@@ -41,9 +45,9 @@ function Post({ allIntegURL }) {
   const [acf, setAcf] = useState({ fields: [], files: [] })
   const [mb, setMb] = useState({ fields: [], files: [] })
   const [jeCPTMeta, setJeCPTMeta] = useState({ fields: [], files: [] })
-  // const [postConf, setPostConf] = useState({ ...flow.flow_details })
   const btcbi = useRecoilValue($appConfigState)
   const { isPro } = btcbi
+
   const handleInput = (typ, val) => {
     const tmpData = { ...postConf }
     tmpData[typ] = val
@@ -66,15 +70,22 @@ function Post({ allIntegURL }) {
       setPostTypes(data)
     })
 
-    refreshPostCategories(postConf?.post_type, setPostCategories)
+    if (!tmpData.action_type) {
+      tmpData.action_type = 'createNewPost'
+    }
+    if (!tmpData?.post_map?.[0]?.postField) {
+      tmpData.post_map = generatePostCreationFieldMap(tmpData.action_type)
+    }
+
+    refreshPostCategories(tmpData?.post_type, setPostCategories)
 
-    bitsFetch({ post_type: postConf?.post_type }, 'customfield/list').then(res => {
+    bitsFetch({ post_type: tmpData?.post_type }, 'customfield/list').then(res => {
       const { data } = res
       setAcf({ fields: data.acf_fields, files: data.acf_files })
       setMb({ fields: data.mb_fields, files: data.mb_files })
       setJeCPTMeta({ fields: data.je_cpt_fields, files: data.je_cpt_files })
     })
-    // setLoad(false)
+
     setPostConf(tmpData)
   }, [])
 
@@ -114,23 +125,34 @@ function Post({ allIntegURL }) {
       }
     })
     setPostConf(tmpData)
-    // setLoad(false)
   }
 
+  const setActionType = actionType => {
+    const nextAction = actionType || 'createNewPost'
+    setPostConf(prevConf => ({
+      ...prevConf,
+      action_type: nextAction,
+      post_map: generatePostCreationFieldMap(nextAction)
+    }))
+  }
+
+  const isLegacyAction = isLegacyPostCreationAction(postConf?.action_type)
+  const selectedPostFields = getPostCreationFieldsByAction(postConf?.action_type || 'createNewPost')
+
   const saveConfig = () => {
     if (!checkMappedPostFields(postConf)) {
       setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
       return
     }
-    if (!checkMappedAcfFields(postConf)) {
+    if (isLegacyAction && !checkMappedAcfFields(postConf)) {
       setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
       return
     }
-    if (!checkMappedMbFields(postConf)) {
+    if (isLegacyAction && !checkMappedMbFields(postConf)) {
       setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
       return
     }
-    if (!checkMappedJEFields(postConf)) {
+    if (isLegacyAction && !checkMappedJEFields(postConf)) {
       setSnackbar({ show: true, msg: __('Please map mandatory fields', 'bit-integrations') })
       return
     }
@@ -139,7 +161,6 @@ function Post({ allIntegURL }) {
     resp.then(res => {
       if (res.success) {
         setSnackbar({ show: true, msg: res.data })
-        // navigate(allIntegURL)
       } else {
         setSnackbar({ show: true, msg: res.data || res })
       }
@@ -150,177 +171,202 @@ function Post({ allIntegURL }) {
     <div>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
       <div style={{ width: 900 }}>
-        <div className="mt-3">
-          <b>{__('Integration Name', 'bit-integrations')}</b>
+        <TutorialLink linkKey="postCreation" />
+        <div className="flx mt-3">
+          <div className="wdt-200 d-in-b">
+            <b>{__('Integration Name', 'bit-integrations')}</b>
+          </div>
+          <input
+            className="btcd-paper-inp w-5 mt-1"
+            onChange={e => handleInput(e.target.name, e.target.value)}
+            name="name"
+            value={postConf.name}
+            type="text"
+            placeholder={__('Integration Name...', 'bit-integrations')}
+          />
         </div>
-        <input
-          className="btcd-paper-inp w-5 mt-1"
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          name="name"
-          value={postConf.name}
-          type="text"
-          placeholder={__('Integration Name...', 'bit-integrations')}
-        />
-        <br />
         <br />
         <SetEditIntegComponents entity={flow.triggered_entity} setSnackbar={setSnackbar} />
 
-        <div className="mt-3 flx">
-          <b>{__('Post Type', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__(
-                'Select one of the defined WordPress post types Or custom post types for the post',
-                'bit-integrations'
-              )}
-              <br />
-            </div>
-          </Cooltip>
-        </div>
-        <div>
+        <div className="flx mt-2">
+          <div className="wdt-200 d-in-b">
+            <b>{__('Action type', 'bit-integrations')}</b>
+          </div>
           <select
-            name="post_type"
-            value={postConf?.post_type}
-            onChange={e => getCustomFields(e.target.name, e.target.value)}
-            className="btcd-paper-inp w-5 mt-1">
-            <option disabled selected>
-              {__('Select Post Type', 'bit-integrations')}
-            </option>
-            {postTypes?.map((postType, key) => (
-              <option key={`acf-${key * 2}`} value={postType?.id}>
-                {postType?.title}
+            className="btcd-paper-inp w-5 mt-1"
+            value={postConf?.action_type || 'createNewPost'}
+            onChange={e => setActionType(e.target.value)}>
+            {postCreationExtraActions.map(action => (
+              <option key={action.value} value={action.value} disabled={!checkIsPro(isPro, action.is_pro)}>
+                {checkIsPro(isPro, action.is_pro) ? action.label : getProLabel(action.label)}
               </option>
             ))}
           </select>
-          <button
-            onClick={() => refreshPostTypes(postTypes, setPostTypes)}
-            className="icn-btn sh-sm ml-2 mr-2 tooltip"
-            style={{ '--tooltip-txt': `'${__('Refresh Post Types', 'bit-integrations')}'` }}
-            type="button">
-            &#x21BB;
-          </button>
         </div>
 
-        <div className="mt-3">
-          <b>{__('Post Categories', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__('Select one or multiple categories for the post', 'bit-integrations')}
-              <br />
+        {isLegacyAction && (
+          <>
+            <div className="mt-3 flx">
+              <b>{__('Post Type', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Select one of the defined WordPress post types Or custom post types for the post',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div>
+              <select
+                name="post_type"
+                value={postConf?.post_type}
+                onChange={e => getCustomFields(e.target.name, e.target.value)}
+                className="btcd-paper-inp w-5 mt-1">
+                <option disabled selected>
+                  {__('Select Post Type', 'bit-integrations')}
+                </option>
+                {postTypes?.map((postType, key) => (
+                  <option key={`acf-${key * 2}`} value={postType?.id}>
+                    {postType?.title}
+                  </option>
+                ))}
+              </select>
+              <button
+                onClick={() => refreshPostTypes(setPostTypes)}
+                className="icn-btn sh-sm ml-2 mr-2 tooltip"
+                style={{ '--tooltip-txt': `'${__('Refresh Post Types', 'bit-integrations')}'` }}
+                type="button">
+                &#x21BB;
+              </button>
             </div>
-          </Cooltip>
-        </div>
-        <div className='flx'>
-          <MultiSelect
-            key={`post-categories-${postConf?.post_type || 'default'}-${postCategoriesValue}-${postCategories?.length || 0}`}
-            className="mt-2 w-5"
-            defaultValue={postCategoriesValue}
-            options={postCategories?.map(category => ({
-              label: category?.label,
-              value: category?.value?.toString()
-            }))}
-            onChange={val => handleInput('post_categories', val)}
-          />
-          <button
-            onClick={() => refreshPostCategories(postConf?.post_type, setPostCategories)}
-            className="icn-btn sh-sm ml-2 mr-2 tooltip"
-            style={{ '--tooltip-txt': `'${__('Refresh Post Categories', 'bit-integrations')}'` }}
-            type="button">
-            &#x21BB;
-          </button>
-        </div>
 
-        <div className="mt-3">
-          <b>{__('Post Status', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__(
-                'Select the status for the post. If published status is selected and the post date is in the future, it will automatically be changed to scheduled',
-                'bit-integrations'
-              )}
-              <br />
+            <div className="mt-3">
+              <b>{__('Post Categories', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__('Select one or multiple categories for the post', 'bit-integrations')}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div className="flx">
+              <MultiSelect
+                key={`post-categories-${postConf?.post_type || 'default'}-${postCategoriesValue}-${postCategories?.length || 0}`}
+                className="mt-2 w-5"
+                defaultValue={postCategoriesValue}
+                options={postCategories?.map(category => ({
+                  label: category?.label,
+                  value: category?.value?.toString()
+                }))}
+                onChange={val => handleInput('post_categories', val)}
+              />
+              <button
+                onClick={() => refreshPostCategories(postConf?.post_type, setPostCategories)}
+                className="icn-btn sh-sm ml-2 mr-2 tooltip"
+                style={{ '--tooltip-txt': `'${__('Refresh Post Categories', 'bit-integrations')}'` }}
+                type="button">
+                &#x21BB;
+              </button>
             </div>
-          </Cooltip>
-        </div>
-        <select
-          name="post_status"
-          value={postConf?.post_status}
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          className="btcd-paper-inp w-5 mt-2">
-          <option disabled selected>
-            {__('Select Status', 'bit-integrations')}
-          </option>
-          <option value="publish">{__('Publish', 'bit-integrations')}</option>
-          <option value="draft">{__('Draft', 'bit-integrations')}</option>
-          <option value="auto-draft">{__('Auto-Draft', 'bit-integrations')}</option>
-          <option value="private">{__('Private', 'bit-integrations')}</option>
-          <option value="pending">{__('Pending', 'bit-integrations')}</option>
-        </select>
 
-        <div className="mt-3 flx">
-          <b>{__('Author', 'bit-integrations')}</b>
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__('Select the user to be assigned to the post', 'bit-integrations')}
-              <br />
+            <div className="mt-3">
+              <b>{__('Post Status', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Select the status for the post. If published status is selected and the post date is in the future, it will automatically be changed to scheduled',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
             </div>
-          </Cooltip>
-        </div>
-        <div>
-          <select
-            name="post_author"
-            value={postConf?.post_author}
-            onChange={e => handleInput(e.target.name, e.target.value)}
-            className="btcd-paper-inp w-5 mt-2">
-            <option disabled selected>
-              {__('Select Author', 'bit-integrations')}
-            </option>
-            <option value="logged_in_user">{__('Logged In User', 'bit-integrations')}</option>
-            {users?.map((user, key) => (
-              <option key={`acf-${key * 2}`} value={user.ID}>
-                {user.display_name}
+            <select
+              name="post_status"
+              value={postConf?.post_status}
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              className="btcd-paper-inp w-5 mt-2">
+              <option disabled selected>
+                {__('Select Status', 'bit-integrations')}
               </option>
-            ))}
-          </select>
-        </div>
+              <option value="publish">{__('Publish', 'bit-integrations')}</option>
+              <option value="draft">{__('Draft', 'bit-integrations')}</option>
+              <option value="auto-draft">{__('Auto-Draft', 'bit-integrations')}</option>
+              <option value="private">{__('Private', 'bit-integrations')}</option>
+              <option value="pending">{__('Pending', 'bit-integrations')}</option>
+            </select>
 
-        <div className="mt-3">
-          <b>{__('Comment Status', 'bit-integrations')}</b>
-        </div>
-        <select
-          name="comment_status"
-          value={postConf?.comment_status}
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          className="btcd-paper-inp w-5 mt-2">
-          <option disabled selected>
-            {__('Select Status', 'bit-integrations')}
-          </option>
-          <option value="open">{__('Open', 'bit-integrations')}</option>
-          <option value="closed">{__('Closed', 'bit-integrations')}</option>
-        </select>
+            <div className="mt-3 flx">
+              <b>{__('Author', 'bit-integrations')}</b>
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__('Select the user to be assigned to the post', 'bit-integrations')}
+                  <br />
+                </div>
+              </Cooltip>
+            </div>
+            <div>
+              <select
+                name="post_author"
+                value={postConf?.post_author}
+                onChange={e => handleInput(e.target.name, e.target.value)}
+                className="btcd-paper-inp w-5 mt-2">
+                <option disabled selected>
+                  {__('Select Author', 'bit-integrations')}
+                </option>
+                <option value="logged_in_user">{__('Logged In User', 'bit-integrations')}</option>
+                {users?.map((user, key) => (
+                  <option key={`acf-${key * 2}`} value={user.ID}>
+                    {user.display_name}
+                  </option>
+                ))}
+              </select>
+            </div>
 
-        <div className="mt-3">
-          <b>
-            <ProFeatureTitle title={__('Add Post Tags', 'bit-integrations')} />
-          </b>
+            <div className="mt-3">
+              <b>{__('Comment Status', 'bit-integrations')}</b>
+            </div>
+            <select
+              name="comment_status"
+              value={postConf?.comment_status}
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              className="btcd-paper-inp w-5 mt-2">
+              <option disabled selected>
+                {__('Select Status', 'bit-integrations')}
+              </option>
+              <option value="open">{__('Open', 'bit-integrations')}</option>
+              <option value="closed">{__('Closed', 'bit-integrations')}</option>
+            </select>
+
+            <div className="mt-3">
+              <b>
+                <ProFeatureTitle title={__('Add Post Tags', 'bit-integrations')} />
+              </b>
 
-          <Cooltip width={250} icnSize={17} className="ml-2">
-            <div className="txt-body">
-              {__('Use commas to separate multiple tags. Example: tag1, tag2, tag3', 'bit-integrations')}
-              <br />
+              <Cooltip width={250} icnSize={17} className="ml-2">
+                <div className="txt-body">
+                  {__(
+                    'Use commas to separate multiple tags. Example: tag1, tag2, tag3',
+                    'bit-integrations'
+                  )}
+                  <br />
+                </div>
+              </Cooltip>
             </div>
-          </Cooltip>
-        </div>
 
-        <input
-          className="btcd-paper-inp w-5 mt-2 "
-          onChange={e => handleInput(e.target.name, e.target.value)}
-          name="post_tags"
-          value={postConf.post_tags}
-          type="text"
-          placeholder={__('Add Post Tags...', 'bit-integrations')}
-          disabled={!isPro}
-        />
+            <input
+              className="btcd-paper-inp w-5 mt-2 "
+              onChange={e => handleInput(e.target.name, e.target.value)}
+              name="post_tags"
+              value={postConf.post_tags}
+              type="text"
+              placeholder={__('Add Post Tags...', 'bit-integrations')}
+              disabled={!isPro}
+            />
+          </>
+        )}
 
         <div>
           <div className="mt-3 mb-1">
@@ -346,34 +392,35 @@ function Post({ allIntegURL }) {
             formFields={formFields}
             postConf={postConf}
             setPostConf={setPostConf}
-            customFields={postFields}
+            customFields={selectedPostFields}
           />
         ))}
 
         <div className="txt-center btcbi-field-map-button mt-2">
           <button
-            onClick={() => addFieldMap('post_map', postConf.post_map.length, postConf, setPostConf)}
+            onClick={() =>
+              addFieldMap('post_map', postConf?.post_map?.length || 0, postConf, setPostConf)
+            }
             className="icn-btn sh-sm"
             type="button">
             +
           </button>
         </div>
       </div>
-      <div>
-        <CustomField
-          formID={formID}
-          formFields={formFields}
-          handleInput={e => handleInput(e, postConf, setPostConf, formID, setIsLoading, setSnackbar)}
-          postConf={postConf}
-          setPostConf={setPostConf}
-          isLoading={isLoading}
-          setIsLoading={setIsLoading}
-          setSnackbar={setSnackbar}
-          acfFields={acf}
-          mbFields={mb}
-          jeCPTFields={jeCPTMeta}
-        />
-      </div>
+
+      {isLegacyAction && (
+        <div>
+          <CustomField
+            formFields={formFields}
+            postConf={postConf}
+            setPostConf={setPostConf}
+            acfFields={acf}
+            mbFields={mb}
+            jeCPTFields={jeCPTMeta}
+          />
+        </div>
+      )}
+
       <IntegrationStepThree
         edit
         saveConfig={saveConfig}
diff --git a/frontend/src/components/AllIntegrations/PostCreation/PostHelperFunction.js b/frontend/src/components/AllIntegrations/PostCreation/PostHelperFunction.js
index 296b3cb64..9fcce139c 100644
--- a/frontend/src/components/AllIntegrations/PostCreation/PostHelperFunction.js
+++ b/frontend/src/components/AllIntegrations/PostCreation/PostHelperFunction.js
@@ -2,6 +2,88 @@
 import toast from 'react-hot-toast'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
+import { postFields as defaultPostFields } from '../../../Utils/StaticData/postField'
+
+export const postCreationExtraActions = [
+  { value: 'createNewPost', label: __('Create New Post', 'bit-integrations'), is_pro: false },
+  { value: 'updateExistingPost', label: __('Update Existing Post', 'bit-integrations'), is_pro: true },
+  { value: 'updatePostStatus', label: __('Update Post Status', 'bit-integrations'), is_pro: true },
+  { value: 'deleteExistingPost', label: __('Delete Existing Post', 'bit-integrations'), is_pro: true },
+  { value: 'createNewComment', label: __('Create New Comment', 'bit-integrations'), is_pro: true },
+  { value: 'replyToComment', label: __('Reply To Comment', 'bit-integrations'), is_pro: true },
+  {
+    value: 'deleteExistingComment',
+    label: __('Delete Existing Comment', 'bit-integrations'),
+    is_pro: true
+  }
+]
+
+export const isLegacyPostCreationAction = actionType => !actionType || actionType === 'createNewPost'
+
+const postCreationActionFields = {
+  updateExistingPost: [
+    { key: 'post_id', name: __('Post ID', 'bit-integrations'), required: true },
+    { key: 'post_title', name: __('Post Title', 'bit-integrations'), required: false },
+    { key: 'post_content', name: __('Post Content', 'bit-integrations'), required: false },
+    { key: 'post_status', name: __('Post Status', 'bit-integrations'), required: false },
+    { key: 'post_type', name: __('Post Type', 'bit-integrations'), required: false },
+    { key: 'post_author', name: __('Post Author ID', 'bit-integrations'), required: false },
+    { key: 'post_date', name: __('Post Date', 'bit-integrations'), required: false },
+    { key: 'post_name', name: __('Post Slug', 'bit-integrations'), required: false },
+    { key: 'post_excerpt', name: __('Post Excerpt', 'bit-integrations'), required: false },
+    { key: 'featured_image_url', name: __('Featured Image URL', 'bit-integrations'), required: false }
+  ],
+  updatePostStatus: [
+    { key: 'post_id', name: __('Post ID', 'bit-integrations'), required: true },
+    { key: 'post_status', name: __('Post Status', 'bit-integrations'), required: true }
+  ],
+  deleteExistingPost: [
+    { key: 'post_id', name: __('Post ID', 'bit-integrations'), required: true },
+    { key: 'force_delete', name: __('Force Delete (true/false)', 'bit-integrations'), required: false }
+  ],
+  createNewComment: [
+    { key: 'comment_post_ID', name: __('Post ID', 'bit-integrations'), required: true },
+    { key: 'comment_content', name: __('Comment Content', 'bit-integrations'), required: true },
+    { key: 'comment_author', name: __('Author Name', 'bit-integrations'), required: false },
+    { key: 'comment_author_email', name: __('Author Email', 'bit-integrations'), required: false },
+    { key: 'comment_author_url', name: __('Author URL', 'bit-integrations'), required: false },
+    { key: 'comment_parent', name: __('Parent Comment ID', 'bit-integrations'), required: false }
+  ],
+  replyToComment: [
+    { key: 'comment_parent', name: __('Parent Comment ID', 'bit-integrations'), required: true },
+    { key: 'comment_content', name: __('Comment Content', 'bit-integrations'), required: true },
+    { key: 'comment_post_ID', name: __('Post ID', 'bit-integrations'), required: true },
+    { key: 'comment_author', name: __('Author Name', 'bit-integrations'), required: false },
+    { key: 'comment_author_email', name: __('Author Email', 'bit-integrations'), required: false }
+  ],
+  deleteExistingComment: [
+    { key: 'comment_id', name: __('Comment ID', 'bit-integrations'), required: true },
+    { key: 'force_delete', name: __('Force Delete (true/false)', 'bit-integrations'), required: false }
+  ]
+}
+
+export const getPostCreationFieldsByAction = actionType => {
+  if (isLegacyPostCreationAction(actionType)) {
+    return defaultPostFields
+  }
+
+  return postCreationActionFields[actionType] || defaultPostFields
+}
+
+export const generatePostCreationFieldMap = actionType => {
+  const fields = getPostCreationFieldsByAction(actionType)
+  const requiredFields = fields.filter(field => field.required)
+
+  if (requiredFields.length > 0) {
+    return requiredFields.map(field => ({
+      formField: '',
+      postField: field.key,
+      required: true
+    }))
+  }
+
+  return [{ formField: '', postField: '' }]
+}
 
 export const addFieldMap = (fldProp, i, confTmp, setConf) => {
   const newConf = { ...confTmp }
@@ -76,7 +158,7 @@ export const checkMappedJEFields = data => {
   return true
 }
 
-export const refreshPostTypes = (postTypes, setPostTypes) => {
+export const refreshPostTypes = setPostTypes => {
   const loadPostTypes = bitsFetch({}, 'post-types/list').then(result => {
     if (result && result.success) {
       const { data } = result
@@ -102,7 +184,8 @@ export const refreshPostCategories = (postType, setPostCategories) => {
       if (data) {
         setPostCategories(data)
       }
-      if (data && data.length > 0) return __('Successfully refreshed Post Categories.', 'bit-integrations')
+      if (data && data.length > 0)
+        return __('Successfully refreshed Post Categories.', 'bit-integrations')
       return __('Post Categories not found', 'bit-integrations')
     }
   })
diff --git a/frontend/src/components/AllIntegrations/PropovoiceCRM/PropovoiceCrmAuthorization.jsx b/frontend/src/components/AllIntegrations/PropovoiceCRM/PropovoiceCrmAuthorization.jsx
index 7e9d18ef6..e084592ef 100644
--- a/frontend/src/components/AllIntegrations/PropovoiceCRM/PropovoiceCrmAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/PropovoiceCRM/PropovoiceCrmAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function PropovoiceCrmAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Propovoice CRM" links={tutorialLinks?.propovoiceCrm || {}} />
+            <TutorialLink linkKey="propovoiceCrm" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Rapidmail/RapidmailAuthorization.jsx b/frontend/src/components/AllIntegrations/Rapidmail/RapidmailAuthorization.jsx
index dff743527..a1057c8ec 100644
--- a/frontend/src/components/AllIntegrations/Rapidmail/RapidmailAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Rapidmail/RapidmailAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { getAllRecipient, handleAuthorize } from './RapidmailCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function RapidmailAuthorization({
@@ -59,7 +58,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Rapidmail" links={tutorialLinks?.rapidmail || {}} />
+            <TutorialLink linkKey="rapidmail" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Registration/EditRegistration.jsx b/frontend/src/components/AllIntegrations/Registration/EditRegistration.jsx
index 82e1e0c6c..733fbf6cd 100644
--- a/frontend/src/components/AllIntegrations/Registration/EditRegistration.jsx
+++ b/frontend/src/components/AllIntegrations/Registration/EditRegistration.jsx
@@ -1,56 +1,70 @@
 /* eslint-disable no-param-reassign */
 import { useEffect, useState } from 'react'
 import 'react-multiple-select-dropdown-lite/dist/index.css'
-import { useNavigate, useParams } from 'react-router'
+import { useNavigate } from 'react-router'
 import { useRecoilState, useRecoilValue } from 'recoil'
-import bitsFetch from '../../../Utils/bitsFetch'
+import { $actionConf, $appConfigState, $formFields, $newFlow } from '../../../GlobalStates'
 import { __ } from '../../../Utils/i18nwrap'
-import SnackMsg from '../../Utilities/SnackMsg'
-import { saveActionConf, saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
-import UserFieldMap from './UserFieldMap'
-import UserMetaField from './UserMetaField'
-import { userFields } from '../../../Utils/StaticData/userField'
-import { checkMappedUserFields } from './UserHelperFunction'
-import EditFormInteg from '../EditFormInteg'
-import SetEditIntegComponents from '../IntegrationHelpers/SetEditIntegComponents'
-import LoaderSm from '../../Loaders/LoaderSm'
-import { $actionConf, $formFields, $newFlow } from '../../../GlobalStates'
-import EditWebhookInteg from '../EditWebhookInteg'
-import TableCheckBox from '../../Utilities/TableCheckBox'
 import ConditionalLogic from '../../ConditionalLogic'
-import CheckBox from '../../Utilities/CheckBox'
+import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
-import RegistrationActions from './RegistrationActions'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
+import { checkIsPro, getProLabel } from '../../Utilities/ProUtilHelpers'
+import SnackMsg from '../../Utilities/SnackMsg'
+import TableCheckBox from '../../Utilities/TableCheckBox'
 import TutorialLink from '../../Utilities/TutorialLink'
+import { saveActionConf } from '../IntegrationHelpers/IntegrationHelpers'
+import SetEditIntegComponents from '../IntegrationHelpers/SetEditIntegComponents'
+import RegistrationActions from './RegistrationActions'
+import UserFieldMap from './UserFieldMap'
+import {
+  checkMappedUserFields,
+  generateRegistrationFieldMap,
+  getRegistrationFieldsByAction,
+  isLegacyRegistrationAction,
+  registrationMainActions
+} from './UserHelperFunction'
+import UserMetaField from './UserMetaField'
 
 export default function EditRegistration({ allIntegURL }) {
   const navigate = useNavigate()
-  const { formID } = useParams()
   const [snack, setSnackbar] = useState({ show: false })
-  const [roles, setRoles] = useState([])
   const [isLoading, setIsLoading] = useState(false)
   const [flow, setFlow] = useRecoilState($newFlow)
+  const { isPro } = useRecoilValue($appConfigState)
   const formFields = useRecoilValue($formFields)
   const [userConf, setUserConf] = useRecoilState($actionConf)
-useEffect(() => {
+  useEffect(() => {
     const tmpConf = { ...userConf }
 
+    if (!tmpConf.action_type) {
+      tmpConf.action_type = 'new_user'
+    }
+
     if (!tmpConf?.user_map?.[0]?.userField) {
-      tmpConf.user_map = userFields
-        .filter(fld => fld.required)
-        .map(fl => ({ formField: '', userField: fl.key, required: fl.required }))
+      tmpConf.user_map = generateRegistrationFieldMap(tmpConf.action_type)
     }
 
     setUserConf(tmpConf)
   }, [])
 
+  const setActionType = actionType => {
+    const nextAction = actionType || 'new_user'
+    setUserConf(prevConf => ({
+      ...prevConf,
+      action_type: nextAction,
+      user_map: generateRegistrationFieldMap(nextAction)
+    }))
+  }
+
+  const isLegacyAction = isLegacyRegistrationAction(userConf?.action_type)
+  const selectedUserFields = getRegistrationFieldsByAction(userConf?.action_type || 'new_user')
+
   const saveConfig = () => {
     if (!userConf.action_type) {
       setSnackbar({ show: true, msg: __('Please select action type', 'bit-integrations') })
       return
     }
-    if (!userConf.user_role && userConf.action_type !== 'updated_user') {
+    if (userConf.action_type === 'new_user' && !userConf.user_role) {
       setSnackbar({ show: true, msg: __("User Role can't be empty", 'bit-integrations') })
       return
     }
@@ -80,58 +94,36 @@ useEffect(() => {
     setUserConf(tmpConf)
   }
 
-  const actionHandler = e => {
-    const newConf = { ...userConf }
-    const { name, value } = e.target
-    if (e.target.checked) {
-      newConf[name] = value
+  const actionTypeHandler = e => {
+    if (!e.target.value) {
+      return
     }
-    setUserConf({ ...newConf })
+    setActionType(e.target.value)
   }
 
-  const userUpdateInstruction = `
-  <ul>
-  <li>${__('The user must be logged in when updating profile', 'bit-integrations')}</li>
-  <li>${__(
-    'The user cannot change the value of the username field when updating the user profile.',
-    'bit-integrations'
-  )}</li>
-     
-  </ul>`
-  const userCreateInstruction = `
-  <ul>
-  <li>${__(
-    'If the Username and Password fields are blank then the user will take the value of the email field as the field and the password will be auto-generated.',
-    'bit-integrations'
-  )}</li>  
-  </ul>`
-
   return (
     <div style={{ width: 900 }}>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
-            <TutorialLink title="WP User Registration" links={tutorialLinks?.registration || {}} />
+      <TutorialLink linkKey="registration" />
       <br />
       <br />
 
       <SetEditIntegComponents entity={flow.triggered_entity} setSnackbar={setSnackbar} />
       <div className="flx mt-3">
-        <div className="wdt-200 d-in-b">{__('Action type', 'bit-integrations')}</div>
-        <CheckBox
-          radio
-          name="action_type"
-          onChange={actionHandler}
-          checked={userConf?.action_type === 'new_user'}
-          value="new_user"
-          title={__('New User Create', 'bit-integrations')}
-        />
-        <CheckBox
-          radio
-          name="action_type"
-          onChange={actionHandler}
-          checked={userConf?.action_type === 'updated_user'}
-          value="updated_user"
-          title={__('Updated User', 'bit-integrations')}
-        />
+        <div className="wdt-200 d-in-b">
+          <b>{__('Action type', 'bit-integrations')}</b>
+        </div>
+        <select
+          className="btcd-paper-inp w-5"
+          value={userConf?.action_type || 'new_user'}
+          onChange={actionTypeHandler}>
+          <option value="">{__('Select Action', 'bit-integrations')}</option>
+          {registrationMainActions.map(action => (
+            <option key={action.value} value={action.value} disabled={!checkIsPro(isPro, action.is_pro)}>
+              {checkIsPro(isPro, action.is_pro) ? action.label : getProLabel(action.label)}
+            </option>
+          ))}
+        </select>
       </div>
       <br />
       <br />
@@ -139,34 +131,33 @@ useEffect(() => {
       <div>
         <UserFieldMap
           formFields={formFields}
-          formID={formID}
-          userConf={userConf}
-          setUserConf={setUserConf}
-          roles={roles}
-          userFields={userFields}
-        />
-        <br />
-      </div>
-      <div>
-        <UserMetaField
-          formFields={formFields}
-          formID={formID}
           userConf={userConf}
           setUserConf={setUserConf}
+          userFields={selectedUserFields}
         />
         <br />
       </div>
+      {isLegacyAction && (
+        <>
+          <div>
+            <UserMetaField formFields={formFields} userConf={userConf} setUserConf={setUserConf} />
+            <br />
+          </div>
 
-      <div className="mt-4">
-        <b className="wdt-100">{__('Utilities', 'bit-integrations')}</b>
-      </div>
-      <div className="btcd-hr mt-1" />
-      <RegistrationActions userConf={userConf} setUserConf={setUserConf} />
+          <div className="mt-4">
+            <b className="wdt-100">{__('Utilities', 'bit-integrations')}</b>
+          </div>
+          <div className="btcd-hr mt-1" />
+          <RegistrationActions userConf={userConf} setUserConf={setUserConf} />
 
-      <br />
-      <Note
-        note={userConf?.action_type === 'updated_user' ? userUpdateInstruction : userCreateInstruction}
-      />
+          <br />
+          <Note
+            note={
+              userConf?.action_type === 'updated_user' ? userUpdateInstruction : userCreateInstruction
+            }
+          />
+        </>
+      )}
 
       {userConf?.condition && (
         <>
@@ -198,3 +189,22 @@ useEffect(() => {
     </div>
   )
 }
+
+
+
+const userUpdateInstruction = `
+  <ul>
+  <li>${__('The user must be logged in when updating profile', 'bit-integrations')}</li>
+  <li>${__(
+  'The user cannot change the value of the username field when updating the user profile.',
+  'bit-integrations'
+)}</li>
+     
+  </ul>`
+const userCreateInstruction = `
+  <ul>
+  <li>${__(
+  'If the Username and Password fields are blank then the user will take the value of the email field as the field and the password will be auto-generated.',
+  'bit-integrations'
+)}</li>  
+  </ul>`
\ No newline at end of file
diff --git a/frontend/src/components/AllIntegrations/Registration/Registration.jsx b/frontend/src/components/AllIntegrations/Registration/Registration.jsx
index a736d9250..4ff7f867f 100644
--- a/frontend/src/components/AllIntegrations/Registration/Registration.jsx
+++ b/frontend/src/components/AllIntegrations/Registration/Registration.jsx
@@ -1,34 +1,39 @@
 /* eslint-disable no-param-reassign */
 import { useEffect, useState } from 'react'
 import 'react-multiple-select-dropdown-lite/dist/index.css'
-import { useNavigate, useParams } from 'react-router'
-import bitsFetch from '../../../Utils/bitsFetch'
+import { useNavigate } from 'react-router'
+import { useRecoilValue } from 'recoil'
+import { $appConfigState } from '../../../GlobalStates'
 import { __ } from '../../../Utils/i18nwrap'
-import SnackMsg from '../../Utilities/SnackMsg'
-import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
-import UserFieldMap from './UserFieldMap'
-import UserMetaField from './UserMetaField'
-import { userFields } from '../../../Utils/StaticData/userField'
-import { checkMappedUserFields } from './UserHelperFunction'
-import LoaderSm from '../../Loaders/LoaderSm'
 import ConditionalLogic from '../../ConditionalLogic'
-import TableCheckBox from '../../Utilities/TableCheckBox'
-import CheckBox from '../../Utilities/CheckBox'
+import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
+import { checkIsPro, getProLabel } from '../../Utilities/ProUtilHelpers'
+import SnackMsg from '../../Utilities/SnackMsg'
+import TableCheckBox from '../../Utilities/TableCheckBox'
 import TutorialLink from '../../Utilities/TutorialLink'
+import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import RegistrationActions from './RegistrationActions'
+import UserFieldMap from './UserFieldMap'
+import {
+  checkMappedUserFields,
+  generateRegistrationFieldMap,
+  getRegistrationFieldsByAction,
+  isLegacyRegistrationAction,
+  registrationMainActions
+} from './UserHelperFunction'
+import UserMetaField from './UserMetaField'
 
 export default function Registration({ formFields, setFlow, flow, allIntegURL }) {
-  const { formID } = useParams()
   const [snack, setSnackbar] = useState({ show: false })
-  const [roles, setRoles] = useState([])
   const navigate = useNavigate()
+  const { isPro } = useRecoilValue($appConfigState)
   const [isLoading, setIsLoading] = useState(false)
-const [userConf, setUserConf] = useState({
+  const [userConf, setUserConf] = useState({
     name: 'WP User Registration',
     type: 'WP User Registration',
-    user_map: [{}],
+    action_type: 'new_user',
+    user_map: generateRegistrationFieldMap('new_user'),
     meta_map: [{}],
     condition: {
       action_behavior: '',
@@ -39,25 +44,35 @@ const [userConf, setUserConf] = useState({
 
   useEffect(() => {
     const tmpConf = { ...userConf }
-    bitsFetch({}, 'role/list', null, 'GET').then(res => {
-      if (res?.success && res !== undefined) {
-        setRoles(Object.values(res?.data))
-      }
-    })
+
+    if (!tmpConf.action_type) {
+      tmpConf.action_type = 'new_user'
+    }
     if (!tmpConf?.user_map?.[0]?.userField) {
-      tmpConf.user_map = userFields
-        .filter(fld => fld.required)
-        .map(fl => ({ formField: '', userField: fl.key, required: fl.required }))
+      tmpConf.user_map = generateRegistrationFieldMap(tmpConf.action_type)
     }
 
     setUserConf(tmpConf)
   }, [])
+
+  const setActionType = actionType => {
+    const newAction = actionType || 'new_user'
+    setUserConf(prevConf => ({
+      ...prevConf,
+      action_type: newAction,
+      user_map: generateRegistrationFieldMap(newAction)
+    }))
+  }
+
+  const isLegacyAction = isLegacyRegistrationAction(userConf?.action_type)
+  const selectedUserFields = getRegistrationFieldsByAction(userConf?.action_type || 'new_user')
+
   const saveConfig = () => {
     if (!userConf.action_type) {
       setSnackbar({ show: true, msg: __('Please select action type', 'bit-integrations') })
       return
     }
-    if (!userConf.user_role && userConf.action_type !== 'updated_user') {
+    if (userConf.action_type === 'new_user' && !userConf.user_role) {
       setSnackbar({ show: true, msg: __("User Role can't be empty", 'bit-integrations') })
       return
     }
@@ -79,83 +94,66 @@ const [userConf, setUserConf] = useState({
     setUserConf(tmpConf)
   }
 
-  const actionHandler = e => {
-    const newConf = { ...userConf }
-    const { name, value } = e.target
-    if (e.target.checked) {
-      newConf[name] = value
+  const actionTypeHandler = e => {
+    if (!e.target.value) {
+      return
     }
-    setUserConf({ ...newConf })
+    setActionType(e.target.value)
   }
 
-  const userUpdateInstruction = `
-  <ul>
-  <li>${__('The user must be logged in when updating profile', 'bit-integrations')}</li>
-  <li>${__(
-    'The user cannot change the value of the username field when updating the user profile.',
-    'bit-integrations'
-  )}</li>
-     
-  </ul>`
-  const userCreateInstruction = `
-  <ul>
-  <li>${__(
-    'If the Username and Password fields are blank then the user will take the value of the email field as the field and the password will be auto-generated.',
-    'bit-integrations'
-  )}</li>
-  </ul>`
-
   return (
     <div style={{ width: 900 }}>
       <SnackMsg snack={snack} setSnackbar={setSnackbar} />
-            <TutorialLink title="WP User Registration" links={tutorialLinks?.registration || {}} />
+      <TutorialLink linkKey="registration" />
       <br />{' '}
       <div>
-        <CheckBox
-          radio
-          name="action_type"
-          onChange={actionHandler}
-          checked={userConf?.action_type === 'new_user'}
-          value="new_user"
-          title={__('New User Create', 'bit-integrations')}
-        />
-        <CheckBox
-          radio
-          name="action_type"
-          onChange={actionHandler}
-          checked={userConf?.action_type === 'updated_user'}
-          value="updated_user"
-          title={__('Updated User', 'bit-integrations')}
-        />
+        <div className="mt-3">
+          <b>{__('Select Action', 'bit-integrations')}</b>
+        </div>
+        <div className="mt-2">
+          <select
+            className="btcd-paper-inp w-5"
+            value={userConf?.action_type || 'new_user'}
+            onChange={actionTypeHandler}>
+            <option value="">{__('Select Action', 'bit-integrations')}</option>
+            {registrationMainActions.map(action => (
+              <option
+                key={action.value}
+                value={action.value}
+                disabled={!checkIsPro(isPro, action.is_pro)}>
+                {checkIsPro(isPro, action.is_pro) ? action.label : getProLabel(action.label)}
+              </option>
+            ))}
+          </select>
+        </div>
       </div>
       <br />
       <div>
         <UserFieldMap
           formFields={formFields}
-          formID={formID}
           userConf={userConf}
           setUserConf={setUserConf}
-          roles={roles}
-          userFields={userFields}
+          userFields={selectedUserFields}
         />
       </div>
-      <div>
-        <UserMetaField
-          formFields={formFields}
-          formID={formID}
-          userConf={userConf}
-          setUserConf={setUserConf}
-        />
-      </div>
-      <div className="mt-4">
-        <b className="wdt-100">{__('Utilities', 'bit-integrations')}</b>
-      </div>
-      <div className="btcd-hr mt-1" />
-      <RegistrationActions userConf={userConf} setUserConf={setUserConf} />
-      <br />
-      <Note
-        note={userConf?.action_type === 'updated_user' ? userUpdateInstruction : userCreateInstruction}
-      />
+      {isLegacyAction && (
+        <>
+          <div>
+            <UserMetaField formFields={formFields} userConf={userConf} setUserConf={setUserConf} />
+          </div>
+          <div className="mt-4">
+            <b className="wdt-100">{__('Utilities', 'bit-integrations')}</b>
+          </div>
+          <div className="btcd-hr mt-1" />
+          <RegistrationActions userConf={userConf} setUserConf={setUserConf} />
+          <br />
+          <Note
+            note={
+              userConf?.action_type === 'updated_user' ? userUpdateInstruction : userCreateInstruction
+            }
+          />
+        </>
+      )}
       {userConf?.condition && (
         <>
           <div className="flx">
@@ -184,3 +182,20 @@ const [userConf, setUserConf] = useState({
     </div>
   )
 }
+
+const userUpdateInstruction = `
+  <ul>
+  <li>${__('The user must be logged in when updating profile', 'bit-integrations')}</li>
+  <li>${__(
+  'The user cannot change the value of the username field when updating the user profile.',
+  'bit-integrations'
+)}</li>
+     
+  </ul>`
+const userCreateInstruction = `
+  <ul>
+  <li>${__(
+  'If the Username and Password fields are blank then the user will take the value of the email field as the field and the password will be auto-generated.',
+  'bit-integrations'
+)}</li>
+  </ul>`
\ No newline at end of file
diff --git a/frontend/src/components/AllIntegrations/Registration/UserFieldMap.jsx b/frontend/src/components/AllIntegrations/Registration/UserFieldMap.jsx
index 3795c5de4..5c9fa91d1 100644
--- a/frontend/src/components/AllIntegrations/Registration/UserFieldMap.jsx
+++ b/frontend/src/components/AllIntegrations/Registration/UserFieldMap.jsx
@@ -6,7 +6,7 @@ import TableCheckBox from '../../Utilities/TableCheckBox'
 import FieldMap from './FieldMap'
 import { addFieldMap } from './UserHelperFunction'
 
-export default function UserFieldMap({ formFields, userConf, setUserConf, roles, userFields }) {
+export default function UserFieldMap({ formFields, userConf, setUserConf, userFields }) {
   const [snack, setSnackbar] = useState({ show: false })
   const handleInput = e => {
     const tmpConf = { ...userConf }
diff --git a/frontend/src/components/AllIntegrations/Registration/UserHelperFunction.js b/frontend/src/components/AllIntegrations/Registration/UserHelperFunction.js
index 413e9a396..1be8a613a 100644
--- a/frontend/src/components/AllIntegrations/Registration/UserHelperFunction.js
+++ b/frontend/src/components/AllIntegrations/Registration/UserHelperFunction.js
@@ -1,6 +1,124 @@
 /* eslint-disable no-param-reassign */
 
 import bitsFetch from '../../../Utils/bitsFetch'
+import { __ } from '../../../Utils/i18nwrap'
+import { userFields as defaultUserFields } from '../../../Utils/StaticData/userField'
+
+export const registrationMainActions = [
+  { value: 'new_user', label: __('New User Create', 'bit-integrations'), is_pro: false },
+  { value: 'updated_user', label: __('Updated User', 'bit-integrations'), is_pro: false },
+  { value: 'deleteExistingUser', label: __('Delete Existing User', 'bit-integrations'), is_pro: true },
+  { value: 'updateUserMetadata', label: __('Update User Metadata', 'bit-integrations'), is_pro: true },
+  { value: 'createRole', label: __('Create Role', 'bit-integrations'), is_pro: true },
+  { value: 'deleteRole', label: __('Delete Role', 'bit-integrations'), is_pro: true },
+  { value: 'addUserRoles', label: __('Add User Roles', 'bit-integrations'), is_pro: true },
+  { value: 'removeUserRole', label: __('Remove User Role', 'bit-integrations'), is_pro: true },
+  { value: 'updateUserRole', label: __('Update User Role', 'bit-integrations'), is_pro: true },
+  { value: 'addRoleCapabilities', label: __('Add Role Capabilities', 'bit-integrations'), is_pro: true },
+  {
+    value: 'removeRoleCapabilities',
+    label: __('Remove Role Capabilities', 'bit-integrations'),
+    is_pro: true
+  },
+  { value: 'addUserCapabilities', label: __('Add User Capabilities', 'bit-integrations'), is_pro: true },
+  {
+    value: 'removeUserCapabilities',
+    label: __('Remove User Capabilities', 'bit-integrations'),
+    is_pro: true
+  }
+]
+
+export const isLegacyRegistrationAction = actionType =>
+  actionType === 'new_user' || actionType === 'updated_user'
+
+const registrationActionFields = {
+  deleteExistingUser: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true},
+    { key: 'reassign_id', name: __('Reassign ID', 'bit-integrations'), required: false}
+  ],
+  updateUserMetadata: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    { key: 'meta_key', name: __('Meta Key', 'bit-integrations'), required: true },
+    { key: 'meta_value', name: __('Meta Value', 'bit-integrations'), required: true }
+  ],
+  createRole: [
+    { key: 'role_name', name: __('Role Name', 'bit-integrations'), required: true },
+    { key: 'role_display_name', name: __('Display Name', 'bit-integrations'), required: true },
+    {
+      key: 'role_capabilities',
+      name: __('Capabilities (comma separated)', 'bit-integrations'),
+      required: false
+    }
+  ],
+  deleteRole: [{ key: 'role_name', name: __('Role Name', 'bit-integrations'), required: true }],
+  addUserRoles: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    { key: 'user_role', name: __('Role', 'bit-integrations'), required: true }
+  ],
+  removeUserRole: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    { key: 'user_role', name: __('Role', 'bit-integrations'), required: true }
+  ],
+  updateUserRole: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    { key: 'new_role', name: __('New Role', 'bit-integrations'), required: true }
+  ],
+  addRoleCapabilities: [
+    { key: 'role_name', name: __('Role Name', 'bit-integrations'), required: true },
+    {
+      key: 'role_capabilities',
+      name: __('Capabilities (comma separated)', 'bit-integrations'),
+      required: true
+    }
+  ],
+  removeRoleCapabilities: [
+    { key: 'role_name', name: __('Role Name', 'bit-integrations'), required: true },
+    {
+      key: 'role_capabilities',
+      name: __('Capabilities (comma separated)', 'bit-integrations'),
+      required: true
+    }
+  ],
+  addUserCapabilities: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    {
+      key: 'role_capabilities',
+      name: __('Capabilities (comma separated)', 'bit-integrations'),
+      required: true
+    }
+  ],
+  removeUserCapabilities: [
+    { key: 'user_email', name: __('User Email', 'bit-integrations'), required: true },
+    {
+      key: 'role_capabilities',
+      name: __('Capabilities (comma separated)', 'bit-integrations'),
+      required: true
+    }
+  ]
+}
+
+export const getRegistrationFieldsByAction = actionType => {
+  if (isLegacyRegistrationAction(actionType)) {
+    return defaultUserFields
+  }
+
+  return registrationActionFields[actionType] || defaultUserFields
+}
+
+export const generateRegistrationFieldMap = actionType => {
+  const fields = getRegistrationFieldsByAction(actionType)
+  const requiredFields = fields.filter(field => field.required)
+
+  if (requiredFields.length > 0) {
+    return requiredFields.map(field => ({
+      formField: '',
+      userField: field.key,
+      required: true
+    }))
+  }
+
+  return [{ formField: '', userField: '' }]
+}
 
 export const addFieldMap = (fldProp, i, confTmp, setConf) => {
   const newConf = { ...confTmp }
diff --git a/frontend/src/components/AllIntegrations/Registration/UserMetaField.jsx b/frontend/src/components/AllIntegrations/Registration/UserMetaField.jsx
index d5b6424b2..1c88be5a4 100644
--- a/frontend/src/components/AllIntegrations/Registration/UserMetaField.jsx
+++ b/frontend/src/components/AllIntegrations/Registration/UserMetaField.jsx
@@ -1,10 +1,9 @@
-import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import FieldMap from './FieldMap'
 import { addFieldMap } from './UserHelperFunction'
 
 export default function CustomFieldMap({ formFields, userConf, setUserConf }) {
-  const [metaFields, setMetaFields] = useState([])
+  const metaFields = []
 
   return (
     <div>
diff --git a/frontend/src/components/AllIntegrations/RestrictContent/RestrictContentAuthorization.jsx b/frontend/src/components/AllIntegrations/RestrictContent/RestrictContentAuthorization.jsx
index 8ebcfd399..382fad49f 100644
--- a/frontend/src/components/AllIntegrations/RestrictContent/RestrictContentAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/RestrictContent/RestrictContentAuthorization.jsx
@@ -6,8 +6,6 @@ import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { getAllLevels } from './RestrictContentCommonFunc'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function RestrictContentAuthorization({
   formID,
   restrictConf,
@@ -55,7 +53,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Restrict Content" links={tutorialLinks?.restrictContent || {}} />
+            <TutorialLink linkKey="restrictContent" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Salesflare/SalesflareAuthorization.jsx b/frontend/src/components/AllIntegrations/Salesflare/SalesflareAuthorization.jsx
index 4b1194012..c1bcbed08 100644
--- a/frontend/src/components/AllIntegrations/Salesflare/SalesflareAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Salesflare/SalesflareAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { salesflareAuthentication } from './SalesflareCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SalesflareAuthorization({
@@ -49,7 +48,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Salesflare" links={tutorialLinks?.salesflare || {}} />
+            <TutorialLink linkKey="salesflare" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Salesforce/SalesforceAuthorization.jsx b/frontend/src/components/AllIntegrations/Salesforce/SalesforceAuthorization.jsx
index 5e13bd392..2f10298d3 100644
--- a/frontend/src/components/AllIntegrations/Salesforce/SalesforceAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Salesforce/SalesforceAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from './SalesforceCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { $appConfigState } from '../../../GlobalStates'
 import { useRecoilValue } from 'recoil'
@@ -51,7 +50,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Salesforce" links={tutorialLinks?.salesforce || {}} />
+            <TutorialLink linkKey="salesforce" />
 
       <div className="wdt-200 d-in-b mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Salesmate/SalesmateAuthorization.jsx b/frontend/src/components/AllIntegrations/Salesmate/SalesmateAuthorization.jsx
index 1dcc9b7d0..0cf1f0c54 100644
--- a/frontend/src/components/AllIntegrations/Salesmate/SalesmateAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Salesmate/SalesmateAuthorization.jsx
@@ -6,7 +6,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import { salesmateAuthentication } from './SalesmateCommonFunc'
 import Note from '../../Utilities/Note'
 import { toast } from 'react-hot-toast'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SalesmateAuthorization({
@@ -64,7 +63,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Salesmate CRM" links={tutorialLinks?.salesmate || {}} />
+            <TutorialLink linkKey="salesmate" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Selzy/SelzyAuthorization.jsx b/frontend/src/components/AllIntegrations/Selzy/SelzyAuthorization.jsx
index b83e0f78f..7ad43d1a7 100644
--- a/frontend/src/components/AllIntegrations/Selzy/SelzyAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Selzy/SelzyAuthorization.jsx
@@ -6,7 +6,6 @@ import Input from '../../Utilities/Input'
 import Note from '../../Utilities/Note'
 import StepPage from '../../Utilities/StepPage'
 import { getAllTags, handleAuthorize, handleInput } from './SelzyCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { __ } from '../../../Utils/i18nwrap'
 
@@ -47,7 +46,7 @@ const nextPage = async () => {
 
   return (
     <StepPage step={step} stepNo={1} style={{ width: 900, height: 'auto' }}>
-            <TutorialLink title="Selzy" links={tutorialLinks?.selzy || {}} />
+            <TutorialLink linkKey="selzy" />
 
       <div className="mt-2">
         {/* SelzyAuthorization */}
diff --git a/frontend/src/components/AllIntegrations/SendFox/SendFoxAuthorization.jsx b/frontend/src/components/AllIntegrations/SendFox/SendFoxAuthorization.jsx
index 33cf5eac8..8764f14e8 100644
--- a/frontend/src/components/AllIntegrations/SendFox/SendFoxAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SendFox/SendFoxAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from './SendFoxCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SendFoxAuthorization({
@@ -43,7 +42,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SendFox" links={tutorialLinks?.sendFox || {}} />
+            <TutorialLink linkKey="sendFox" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SendGrid/SendGridAuthorization.jsx b/frontend/src/components/AllIntegrations/SendGrid/SendGridAuthorization.jsx
index 5286746c0..b0e0eddb2 100644
--- a/frontend/src/components/AllIntegrations/SendGrid/SendGridAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SendGrid/SendGridAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { sendGridAuthentication } from './SendGridCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SendGridAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SendGrid" links={tutorialLinks?.sendGrid || {}} />
+            <TutorialLink linkKey="sendGrid" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SendPulse/SendPulseAuthorization.jsx b/frontend/src/components/AllIntegrations/SendPulse/SendPulseAuthorization.jsx
index 41a6d7c34..158c60935 100644
--- a/frontend/src/components/AllIntegrations/SendPulse/SendPulseAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SendPulse/SendPulseAuthorization.jsx
@@ -6,7 +6,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshSendPulseList } from './SendPulseCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SendPulseAuthorization({
@@ -92,7 +91,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SendPulse" links={tutorialLinks?.sendPulse || {}} />
+            <TutorialLink linkKey="sendPulse" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SendinBlue/SendinBlueAuthorization.jsx b/frontend/src/components/AllIntegrations/SendinBlue/SendinBlueAuthorization.jsx
index 2da337a14..c0cdd180a 100644
--- a/frontend/src/components/AllIntegrations/SendinBlue/SendinBlueAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SendinBlue/SendinBlueAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { refreshLists } from './SendinBlueCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SendinBlueAuthorization({
@@ -61,7 +60,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Brevo (Sendinblue)" links={tutorialLinks?.sendinBlue || {}} />
+            <TutorialLink linkKey="sendinBlue" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Sendy/SendyAuthorization.jsx b/frontend/src/components/AllIntegrations/Sendy/SendyAuthorization.jsx
index 1a74c2428..c32d6028e 100644
--- a/frontend/src/components/AllIntegrations/Sendy/SendyAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Sendy/SendyAuthorization.jsx
@@ -6,7 +6,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 // import { getAllList } from './ElasticEmailCommonFunc'
 
@@ -56,7 +55,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Sendy" links={tutorialLinks?.sendy || {}} />
+            <TutorialLink linkKey="sendy" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SeoPress/SeoPressAuthorization.jsx b/frontend/src/components/AllIntegrations/SeoPress/SeoPressAuthorization.jsx
index faffd0b3a..9a003c9e9 100644
--- a/frontend/src/components/AllIntegrations/SeoPress/SeoPressAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SeoPress/SeoPressAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="SEOPress" links={tutorialLinks?.seoPress || {}} />
+            <TutorialLink linkKey="seoPress" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Slack/SlackAuthorization.jsx b/frontend/src/components/AllIntegrations/Slack/SlackAuthorization.jsx
index 9ee657ac5..b4ff513ed 100644
--- a/frontend/src/components/AllIntegrations/Slack/SlackAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Slack/SlackAuthorization.jsx
@@ -3,7 +3,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './SlackCommonFunc'
 import Note from '../../Utilities/Note'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SlackAuthorization({
@@ -57,7 +56,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="Slack" links={tutorialLinks?.slack || {}} />
+            <TutorialLink linkKey="slack" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SliceWp/SliceWpAuthorization.jsx b/frontend/src/components/AllIntegrations/SliceWp/SliceWpAuthorization.jsx
index 1c50452d8..80dd07041 100644
--- a/frontend/src/components/AllIntegrations/SliceWp/SliceWpAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SliceWp/SliceWpAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SliceWpAuthorization({
@@ -47,7 +46,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="SliceWP" links={tutorialLinks?.sliceWp || {}} />
+            <TutorialLink linkKey="sliceWp" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Smaily/SmailyAuthorization.jsx b/frontend/src/components/AllIntegrations/Smaily/SmailyAuthorization.jsx
index 063739427..e99f8b3f7 100644
--- a/frontend/src/components/AllIntegrations/Smaily/SmailyAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Smaily/SmailyAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { smailyAuthentication } from './SmailyCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SmailyAuthorization({
@@ -63,7 +62,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Smaily" links={tutorialLinks?.smaily || {}} />
+            <TutorialLink linkKey="smaily" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SmartSuite/SmartSuiteAuthorization.jsx b/frontend/src/components/AllIntegrations/SmartSuite/SmartSuiteAuthorization.jsx
index 19b49633c..c3a39e3d2 100644
--- a/frontend/src/components/AllIntegrations/SmartSuite/SmartSuiteAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SmartSuite/SmartSuiteAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { smartSuiteAuthentication, getAllSolutions } from './SmartSuiteCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { create } from 'mutative'
 
@@ -62,7 +61,7 @@ const [error, setError] = useState({ workspaceId: '', apiToken: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SmartSuite" links={tutorialLinks?.smartSuite || {}} />
+            <TutorialLink linkKey="smartSuite" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SperseIO/SperseIO.jsx b/frontend/src/components/AllIntegrations/SperseIO/SperseIO.jsx
index 623b70ff8..1deb78032 100644
--- a/frontend/src/components/AllIntegrations/SperseIO/SperseIO.jsx
+++ b/frontend/src/components/AllIntegrations/SperseIO/SperseIO.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function SperseIO({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ function SperseIO({ formFields, setFlow, flow, allIntegURL }) {
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Sperse IO" links={tutorialLinks?.sperse || {}} />
+                <TutorialLink linkKey="sperse" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/SuiteDash/SuiteDashAuthorization.jsx b/frontend/src/components/AllIntegrations/SuiteDash/SuiteDashAuthorization.jsx
index 286b822e7..845e5f1d8 100644
--- a/frontend/src/components/AllIntegrations/SuiteDash/SuiteDashAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SuiteDash/SuiteDashAuthorization.jsx
@@ -6,7 +6,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import { suiteDashAuthentication } from './SuiteDashCommonFunc'
 import Note from '../../Utilities/Note'
 import { toast } from 'react-hot-toast'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SuiteDashAuthorization({
@@ -52,7 +51,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SuiteDash" links={tutorialLinks?.suiteDash || {}} />
+            <TutorialLink linkKey="suiteDash" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SureCart/SureCartAuthorization.jsx b/frontend/src/components/AllIntegrations/SureCart/SureCartAuthorization.jsx
index d0b182f25..d4533a801 100644
--- a/frontend/src/components/AllIntegrations/SureCart/SureCartAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SureCart/SureCartAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './SureCartCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SureCartAuthorization({
@@ -42,7 +41,7 @@ const nextPage = () => {
         ...{ width: step === 1 && 900 },
         ...{ height: step === 1 && 'auto' }
       }}>
-            <TutorialLink title="SureCart" links={tutorialLinks?.sureCart || {}} />
+            <TutorialLink linkKey="sureCart" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SureMembers/SureMembersAuthorization.jsx b/frontend/src/components/AllIntegrations/SureMembers/SureMembersAuthorization.jsx
index 75ab16e77..2e72a02c3 100644
--- a/frontend/src/components/AllIntegrations/SureMembers/SureMembersAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SureMembers/SureMembersAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { sureMembersAuthentication } from './SureMembersCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SureMembersAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SureMembers" links={tutorialLinks?.sureMembers || {}} />
+            <TutorialLink linkKey="sureMembers" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/SureTriggers/SureTriggers.jsx b/frontend/src/components/AllIntegrations/SureTriggers/SureTriggers.jsx
index fbe505b47..d6b42fb21 100644
--- a/frontend/src/components/AllIntegrations/SureTriggers/SureTriggers.jsx
+++ b/frontend/src/components/AllIntegrations/SureTriggers/SureTriggers.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function SureTriggers({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [sureTriggers, setSureTriggers] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="SureTriggers" links={tutorialLinks?.sureTriggersLinks || {}} />
+                <TutorialLink linkKey="sureTriggersLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/SyncSpider/SyncSpider.jsx b/frontend/src/components/AllIntegrations/SyncSpider/SyncSpider.jsx
index b1bb705a9..7ce8650de 100644
--- a/frontend/src/components/AllIntegrations/SyncSpider/SyncSpider.jsx
+++ b/frontend/src/components/AllIntegrations/SyncSpider/SyncSpider.jsx
@@ -8,8 +8,6 @@ import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 function SyncSpider({ formFields, setFlow, flow, allIntegURL }) {
   const navigate = useNavigate()
   const { formID } = useParams()
@@ -35,7 +33,7 @@ const [syncSpider, setSyncSpider] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="SyncSpider" links={tutorialLinks?.syncSpiderLinks || {}} />
+                <TutorialLink linkKey="syncSpiderLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/SystemeIO/SystemeIOAuthorization.jsx b/frontend/src/components/AllIntegrations/SystemeIO/SystemeIOAuthorization.jsx
index 81f8f27d6..dfb1e0e96 100644
--- a/frontend/src/components/AllIntegrations/SystemeIO/SystemeIOAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/SystemeIO/SystemeIOAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { systemeIOAuthentication, getAllTags, getAllFields } from './SystemeIOCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function SystemeIOAuthorization({
@@ -57,7 +56,7 @@ const [error, setError] = useState({ api_key: '' })
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="SystemeIO" links={tutorialLinks?.systemeIO || {}} />
+            <TutorialLink linkKey="systemeIO" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/TeamsForWooCommerceMemberships/TeamsForWooCommerceMembershipsAuthorization.jsx b/frontend/src/components/AllIntegrations/TeamsForWooCommerceMemberships/TeamsForWooCommerceMembershipsAuthorization.jsx
index 64806e5e1..0e005c3cd 100644
--- a/frontend/src/components/AllIntegrations/TeamsForWooCommerceMemberships/TeamsForWooCommerceMembershipsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/TeamsForWooCommerceMemberships/TeamsForWooCommerceMembershipsAuthorization.jsx
@@ -2,7 +2,6 @@ import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 
@@ -46,7 +45,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Teams for WooCommerce Memberships" links={tutorialLinks?.teamsForWooCommerceMemberships || {}} />
+            <TutorialLink linkKey="teamsForWooCommerceMemberships" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Telegram/TelegramAuthorization.jsx b/frontend/src/components/AllIntegrations/Telegram/TelegramAuthorization.jsx
index 69b38c2ac..ea3bef1c7 100644
--- a/frontend/src/components/AllIntegrations/Telegram/TelegramAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Telegram/TelegramAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { refreshGetUpdates } from './TelegramCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function TelegramAuthorization({
@@ -66,7 +65,7 @@ const handleAuthorize = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Telegram" links={tutorialLinks?.telegram || {}} />
+            <TutorialLink linkKey="telegram" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/TheEventsCalendar/TheEventsCalendarAuthorization.jsx b/frontend/src/components/AllIntegrations/TheEventsCalendar/TheEventsCalendarAuthorization.jsx
index 4e31fba0f..9969aca5d 100644
--- a/frontend/src/components/AllIntegrations/TheEventsCalendar/TheEventsCalendarAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/TheEventsCalendar/TheEventsCalendarAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { theEventsCalendarAuthentication } from './theEventsCalendarCommonFunctions'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function TheEventsCalendarAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="The Events Calendar" links={tutorialLinks?.theEventsCalendar || {}} />
+            <TutorialLink linkKey="theEventsCalendar" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ThriveAutomator/ThriveAutomator.jsx b/frontend/src/components/AllIntegrations/ThriveAutomator/ThriveAutomator.jsx
index 0f79de3f6..a93dfdf94 100644
--- a/frontend/src/components/AllIntegrations/ThriveAutomator/ThriveAutomator.jsx
+++ b/frontend/src/components/AllIntegrations/ThriveAutomator/ThriveAutomator.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function ThriveAutomator({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [thriveAutomator, setThriveAutomator] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Thrive Automator" links={tutorialLinks?.thriveAutomatorLinks || {}} />
+                <TutorialLink linkKey="thriveAutomatorLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Trello/TrelloAuthorization.jsx b/frontend/src/components/AllIntegrations/Trello/TrelloAuthorization.jsx
index 4e9d173d8..8282640e3 100644
--- a/frontend/src/components/AllIntegrations/Trello/TrelloAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Trello/TrelloAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleTrelloAuthorize, fetchAllBoard } from './TrelloCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function TrelloAuthorization({
@@ -43,7 +42,7 @@ export default function TrelloAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Trello" links={tutorialLinks?.trello || {}} />
+            <TutorialLink linkKey="trello" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/TutorLms/TutorLmsAuthorization.jsx b/frontend/src/components/AllIntegrations/TutorLms/TutorLmsAuthorization.jsx
index 77111e67e..9bc30a8d0 100644
--- a/frontend/src/components/AllIntegrations/TutorLms/TutorLmsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/TutorLms/TutorLmsAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function TutorLmsAuthorization({
@@ -45,7 +44,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="Tutor LMS" links={tutorialLinks?.tutorlms || {}} />
+            <TutorialLink linkKey="tutorlms" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Twilio/TwilioAuthorization.jsx b/frontend/src/components/AllIntegrations/Twilio/TwilioAuthorization.jsx
index 004b2ca07..70f335e9f 100644
--- a/frontend/src/components/AllIntegrations/Twilio/TwilioAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Twilio/TwilioAuthorization.jsx
@@ -3,7 +3,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './TwilioCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function TwilioAuthorization({
@@ -38,7 +37,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Twilio" links={tutorialLinks?.twilio || {}} />
+            <TutorialLink linkKey="twilio" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/UltimateAffiliatePro/UltimateAffiliateProAuthorization.jsx b/frontend/src/components/AllIntegrations/UltimateAffiliatePro/UltimateAffiliateProAuthorization.jsx
index fe534aefa..09d456bc5 100644
--- a/frontend/src/components/AllIntegrations/UltimateAffiliatePro/UltimateAffiliateProAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/UltimateAffiliatePro/UltimateAffiliateProAuthorization.jsx
@@ -4,8 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
-
 export default function UltimateAffiliateProAuthorization({
   ultimateAffiliateProConf,
   setUltimateAffiliateProConf,
@@ -56,7 +54,7 @@ export default function UltimateAffiliateProAuthorization({
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-      <TutorialLink title="Ultimate Affiliate Pro" links={tutorialLinks?.ultimateAffiliatePro || {}} />
+      <TutorialLink linkKey="ultimateAffiliatePro" />
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
       </div>
diff --git a/frontend/src/components/AllIntegrations/UncannyAutomator/UncannyAutomator.jsx b/frontend/src/components/AllIntegrations/UncannyAutomator/UncannyAutomator.jsx
index 372256d8e..94754a10a 100644
--- a/frontend/src/components/AllIntegrations/UncannyAutomator/UncannyAutomator.jsx
+++ b/frontend/src/components/AllIntegrations/UncannyAutomator/UncannyAutomator.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function UncannyAutomator({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [uncannyAutomator, setUncannyAutomator] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Uncanny Automator" links={tutorialLinks?.uncannyAutomatorLinks || {}} />
+                <TutorialLink linkKey="uncannyAutomatorLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/UserRegistrationMembership/UserRegistrationMembershipAuthorization.jsx b/frontend/src/components/AllIntegrations/UserRegistrationMembership/UserRegistrationMembershipAuthorization.jsx
index f8069f53a..0cd3a52b7 100644
--- a/frontend/src/components/AllIntegrations/UserRegistrationMembership/UserRegistrationMembershipAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/UserRegistrationMembership/UserRegistrationMembershipAuthorization.jsx
@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -26,10 +25,7 @@ export default function UserRegistrationMembershipAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-      <TutorialLink
-        title={tutorialLinks?.userRegistrationMembership?.title}
-        links={tutorialLinks?.userRegistrationMembership || {}}
-      />
+      <TutorialLink linkKey="userRegistrationMembership" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Vbout/VboutAuthorization.jsx b/frontend/src/components/AllIntegrations/Vbout/VboutAuthorization.jsx
index 6c0e8e16b..5259edca6 100644
--- a/frontend/src/components/AllIntegrations/Vbout/VboutAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Vbout/VboutAuthorization.jsx
@@ -5,7 +5,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { handleAuthorize } from './VboutCommonFunc'
 import { getAllLists } from './VboutCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function VboutAuthorization({
@@ -58,7 +57,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="VBOUT" links={tutorialLinks?.vbout || {}} />
+            <TutorialLink linkKey="vbout" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Voxel/VoxelAuthorization.jsx b/frontend/src/components/AllIntegrations/Voxel/VoxelAuthorization.jsx
index d38a18eca..7f7af32ef 100644
--- a/frontend/src/components/AllIntegrations/Voxel/VoxelAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Voxel/VoxelAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { voxelAuthentication } from './VoxelCommonFunctions'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function VoxelAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Voxel" links={tutorialLinks?.voxel || {}} />
+            <TutorialLink linkKey="voxel" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WPCafe/WPCafeAuthorization.jsx b/frontend/src/components/AllIntegrations/WPCafe/WPCafeAuthorization.jsx
index a5e2b0d95..624d674fc 100644
--- a/frontend/src/components/AllIntegrations/WPCafe/WPCafeAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WPCafe/WPCafeAuthorization.jsx
@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -28,7 +27,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="WPCafe" links={tutorialLinks?.wpcafe || {}} />
+            <TutorialLink linkKey="wpcafe" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WPCourseware/WPCoursewareAuthorization.jsx b/frontend/src/components/AllIntegrations/WPCourseware/WPCoursewareAuthorization.jsx
index 0e2f323c1..e53e70c6f 100644
--- a/frontend/src/components/AllIntegrations/WPCourseware/WPCoursewareAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WPCourseware/WPCoursewareAuthorization.jsx
@@ -4,7 +4,6 @@ import { __, sprintf } from '../../../Utils/i18nwrap'
 import bitsFetch from '../../../Utils/bitsFetch'
 import LoaderSm from '../../Loaders/LoaderSm'
 import BackIcn from '../../../Icons/BackIcn'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function WPCoursewareAuthorization({
@@ -55,7 +54,7 @@ useEffect(
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="WP Courseware" links={tutorialLinks?.wpCourseware || {}} />
+                <TutorialLink linkKey="wpCourseware" />
 
         <div className="mt-3">
           <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WPForo/WPForoAuthorization.jsx b/frontend/src/components/AllIntegrations/WPForo/WPForoAuthorization.jsx
index ee22f37bd..56245d721 100644
--- a/frontend/src/components/AllIntegrations/WPForo/WPForoAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WPForo/WPForoAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { wpforoAuthentication } from './WPForoCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function WPForoAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="wpforo" links={tutorialLinks?.wpforo || {}} />
+            <TutorialLink linkKey="wpforo" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WPFusion/WPFusion.jsx b/frontend/src/components/AllIntegrations/WPFusion/WPFusion.jsx
index b76efd82e..95dfe0699 100644
--- a/frontend/src/components/AllIntegrations/WPFusion/WPFusion.jsx
+++ b/frontend/src/components/AllIntegrations/WPFusion/WPFusion.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function WPFusion({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [wpFusion, setWPFusion] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="WP Fusion" links={tutorialLinks?.wpFusionLinks || {}} />
+                <TutorialLink linkKey="wpFusionLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/WPWebhooks/WPWebhooks.jsx b/frontend/src/components/AllIntegrations/WPWebhooks/WPWebhooks.jsx
index 55510b6af..d429e52a7 100644
--- a/frontend/src/components/AllIntegrations/WPWebhooks/WPWebhooks.jsx
+++ b/frontend/src/components/AllIntegrations/WPWebhooks/WPWebhooks.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function WPWebhooks({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [wPWebhooks, setWPWebhooks] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 1100 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="WP Webhooks" links={tutorialLinks?.wPWebhooksLinks || {}} />
+                <TutorialLink linkKey="wPWebhooksLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/WeDocs/WeDocsAuthorization.jsx b/frontend/src/components/AllIntegrations/WeDocs/WeDocsAuthorization.jsx
index 2f31349a3..0b1907d7e 100644
--- a/frontend/src/components/AllIntegrations/WeDocs/WeDocsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WeDocs/WeDocsAuthorization.jsx
@@ -1,6 +1,5 @@
 import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import TutorialLink from '../../Utilities/TutorialLink'
@@ -17,7 +16,6 @@ export default function WeDocsAuthorization({
 }) {
   const [isAuthorized, setIsAuthorized] = useState(false)
   const [error, setError] = useState({ name: '' })
-  const { weDocs } = tutorialLinks
 
   const handleInput = e => {
     const newConf = { ...weDocsConf }
@@ -29,8 +27,7 @@ export default function WeDocsAuthorization({
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-      {weDocs?.youTubeLink && <TutorialLink title="weDocs" youTubeLink={weDocs?.youTubeLink} />}
-      {weDocs?.docLink && <TutorialLink title="weDocs" docLink={weDocs?.docLink} />}
+      <TutorialLink linkKey="weDocs" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WebHooks/WebHooks.jsx b/frontend/src/components/AllIntegrations/WebHooks/WebHooks.jsx
index 5f8b5465c..fca1f25be 100644
--- a/frontend/src/components/AllIntegrations/WebHooks/WebHooks.jsx
+++ b/frontend/src/components/AllIntegrations/WebHooks/WebHooks.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function WebHooks({ formFields, setFlow, flow, allIntegURL }) {
@@ -16,7 +15,7 @@ function WebHooks({ formFields, setFlow, flow, allIntegURL }) {
   const [step, setStep] = useState(1)
   const [snack, setSnackbar] = useState({ show: false })
   const [isLoading, setIsLoading] = useState(false)
-const [webHooks, setWebHooks] = useState({
+  const [webHooks, setWebHooks] = useState({
     name: 'Web Hooks',
     type: 'Web Hooks',
     method: 'POST',
@@ -34,8 +33,6 @@ const [webHooks, setWebHooks] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Web Hooks" links={tutorialLinks?.webHooksLinks || {}} />
-
         <WebHooksIntegration
           formID={formID}
           formFields={formFields}
diff --git a/frontend/src/components/AllIntegrations/WhatsApp/WhatsAppAuthorization.jsx b/frontend/src/components/AllIntegrations/WhatsApp/WhatsAppAuthorization.jsx
index 3e3146d27..7e6a63980 100644
--- a/frontend/src/components/AllIntegrations/WhatsApp/WhatsAppAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WhatsApp/WhatsAppAuthorization.jsx
@@ -3,7 +3,6 @@ import BackIcn from '../../../Icons/BackIcn'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize } from './WhatsAppCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function WhatsAppAuthorization({
@@ -41,7 +40,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="WhatsApp" links={tutorialLinks?.whatsApp || {}} />
+            <TutorialLink linkKey="whatsApp" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WishlistMember/WishlistMemberAuthorization.jsx b/frontend/src/components/AllIntegrations/WishlistMember/WishlistMemberAuthorization.jsx
index 78c95f6b7..192f40ed3 100644
--- a/frontend/src/components/AllIntegrations/WishlistMember/WishlistMemberAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WishlistMember/WishlistMemberAuthorization.jsx
@@ -1,7 +1,6 @@
 import { useState } from 'react'
 import BackIcn from '../../../Icons/BackIcn'
 import { __ } from '../../../Utils/i18nwrap'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import LoaderSm from '../../Loaders/LoaderSm'
 import TutorialLink from '../../Utilities/TutorialLink'
 import { handleAuthorize, setIntegrationName } from './WishlistMemberCommonFunc'
@@ -20,7 +19,7 @@ return (
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="WishlistMember" links={tutorialLinks?.wishlistMember || {}} />
+            <TutorialLink linkKey="wishlistMember" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WooCommerce/WooCommerceAuthorization.jsx b/frontend/src/components/AllIntegrations/WooCommerce/WooCommerceAuthorization.jsx
index 8346579b2..5ee3c4ce2 100644
--- a/frontend/src/components/AllIntegrations/WooCommerce/WooCommerceAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/WooCommerce/WooCommerceAuthorization.jsx
@@ -4,7 +4,6 @@ import bitsFetch from '../../../Utils/bitsFetch'
 import { deepCopy } from '../../../Utils/Helpers'
 import { __, sprintf } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function WooCommerceAuthorization({
@@ -46,7 +45,7 @@ const authorizeHandler = () => {
         width: step === 1 && 900,
         height: step === 1 && 'auto'
       }}>
-            <TutorialLink title="WooCommerce" links={tutorialLinks?.wooCommerce || {}} />
+            <TutorialLink linkKey="wooCommerce" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Woodpecker/WoodpeckerAuthorization.jsx b/frontend/src/components/AllIntegrations/Woodpecker/WoodpeckerAuthorization.jsx
index 51fbf9547..cc7735aa9 100644
--- a/frontend/src/components/AllIntegrations/Woodpecker/WoodpeckerAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Woodpecker/WoodpeckerAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { woodpeckerAuthentication } from './WoodpeckerCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function WoodpeckerAuthorization({
@@ -58,7 +57,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Woodpecker" links={tutorialLinks?.woodpecker || {}} />
+            <TutorialLink linkKey="woodpecker" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/WordPress/EditWordPress.jsx b/frontend/src/components/AllIntegrations/WordPress/EditWordPress.jsx
new file mode 100644
index 000000000..f60aeb47d
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/EditWordPress.jsx
@@ -0,0 +1,74 @@
+import { useState } from 'react'
+import { useNavigate, useParams } from 'react-router'
+import { useRecoilState, useRecoilValue } from 'recoil'
+import { $actionConf, $formFields, $newFlow } from '../../../GlobalStates'
+import { __ } from '../../../Utils/i18nwrap'
+import SnackMsg from '../../Utilities/SnackMsg'
+import { saveActionConf } from '../IntegrationHelpers/IntegrationHelpers'
+import IntegrationStepThree from '../IntegrationHelpers/IntegrationStepThree'
+import SetEditIntegComponents from '../IntegrationHelpers/SetEditIntegComponents'
+import { checkMappedFields, handleInput } from './WordPressCommonFunc'
+import WordPressIntegLayout from './WordPressIntegLayout'
+
+export default function EditWordPress({ allIntegURL }) {
+  const navigate = useNavigate()
+  const { id, formID } = useParams()
+
+  const [wordPressConf, setWordPressConf] = useRecoilState($actionConf)
+  const [flow, setFlow] = useRecoilState($newFlow)
+  const formFields = useRecoilValue($formFields)
+  const [isLoading, setIsLoading] = useState(false)
+  const [snack, setSnackbar] = useState({ show: false })
+
+  return (
+    <div style={{ width: 900 }}>
+      <SnackMsg snack={snack} setSnackbar={setSnackbar} />
+
+      <div className="flx mt-3">
+        <b className="wdt-200 d-in-b">{__('Integration Name:', 'bit-integrations')}</b>
+        <input
+          className="btcd-paper-inp w-5"
+          onChange={e => handleInput(e, wordPressConf, setWordPressConf)}
+          name="name"
+          value={wordPressConf.name}
+          type="text"
+          placeholder={__('Integration Name...', 'bit-integrations')}
+        />
+      </div>
+      <br />
+
+      <SetEditIntegComponents entity={flow.triggered_entity} setSnackbar={setSnackbar} />
+
+      <WordPressIntegLayout
+        formID={formID}
+        formFields={formFields}
+        wordPressConf={wordPressConf}
+        setWordPressConf={setWordPressConf}
+        isLoading={isLoading}
+      />
+
+      <IntegrationStepThree
+        edit
+        saveConfig={() =>
+          saveActionConf({
+            flow,
+            setFlow,
+            allIntegURL,
+            conf: wordPressConf,
+            navigate,
+            id,
+            edit: 1,
+            setIsLoading,
+            setSnackbar
+          })
+        }
+        disabled={!checkMappedFields(wordPressConf)}
+        isLoading={isLoading}
+        dataConf={wordPressConf}
+        setDataConf={setWordPressConf}
+        formFields={formFields}
+      />
+      <br />
+    </div>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPress.jsx b/frontend/src/components/AllIntegrations/WordPress/WordPress.jsx
new file mode 100644
index 000000000..d45030075
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPress.jsx
@@ -0,0 +1,100 @@
+import { useState } from 'react'
+import { useNavigate, useParams } from 'react-router'
+import BackIcn from '../../../Icons/BackIcn'
+import { __ } from '../../../Utils/i18nwrap'
+import SnackMsg from '../../Utilities/SnackMsg'
+import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
+import IntegrationStepThree from '../IntegrationHelpers/IntegrationStepThree'
+import WordPressAuthorization from './WordPressAuthorization'
+import { checkMappedFields } from './WordPressCommonFunc'
+import WordPressIntegLayout from './WordPressIntegLayout'
+
+export default function WordPress({ formFields, setFlow, flow, allIntegURL }) {
+  const navigate = useNavigate()
+  const { formID } = useParams()
+  const [isLoading, setIsLoading] = useState(false)
+  const [step, setStep] = useState(1)
+  const [snack, setSnackbar] = useState({ show: false })
+  const [wordPressConf, setWordPressConf] = useState({
+    name: 'WordPress',
+    type: 'WordPress',
+    field_map: [{ formField: '', wordPressField: '' }],
+    wordPressFields: [],
+    mainAction: '',
+    actions: {}
+  })
+
+  const nextPage = val => {
+    setTimeout(() => {
+      document.getElementById('btcd-settings-wrp').scrollTop = 0
+    }, 300)
+
+    if (val === 3) {
+      if (!wordPressConf.mainAction) {
+        setSnackbar({ show: true, msg: __('Please select an action to continue.', 'bit-integrations') })
+        return
+      }
+      if (!checkMappedFields(wordPressConf)) {
+        setSnackbar({
+          show: true,
+          msg: __('Please map all required fields to continue.', 'bit-integrations')
+        })
+        return
+      }
+    }
+    setStep(val)
+  }
+
+  return (
+    <div>
+      <SnackMsg snack={snack} setSnackbar={setSnackbar} />
+      <div className="txt-center mt-2" />
+
+      {/* STEP 1 */}
+      <WordPressAuthorization
+        wordPressConf={wordPressConf}
+        setWordPressConf={setWordPressConf}
+        step={step}
+        nextPage={nextPage}
+        isLoading={isLoading}
+        setIsLoading={setIsLoading}
+        setSnackbar={setSnackbar}
+      />
+
+      {/* STEP 2 */}
+      <div
+        className="btcd-stp-page"
+        style={{
+          width: step === 2 && 900,
+          height: step === 2 && 'auto',
+          minHeight: step === 2 && '500px'
+        }}>
+        <WordPressIntegLayout
+          formID={formID}
+          formFields={formFields}
+          wordPressConf={wordPressConf}
+          setWordPressConf={setWordPressConf}
+          isLoading={isLoading}
+        />
+        <br />
+        <button
+          onClick={() => nextPage(3)}
+          disabled={isLoading || !wordPressConf.mainAction || wordPressConf.field_map.length < 1}
+          className="btn f-right btcd-btn-lg purple sh-sm flx"
+          type="button">
+          {__('Next', 'bit-integrations')}
+          <BackIcn className="ml-1 rev-icn" />
+        </button>
+      </div>
+
+      {/* STEP 3 */}
+      <IntegrationStepThree
+        step={step}
+        saveConfig={() =>
+          saveIntegConfig(flow, setFlow, allIntegURL, wordPressConf, navigate, '', '', setIsLoading)
+        }
+        isLoading={isLoading}
+      />
+    </div>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPressActions.jsx b/frontend/src/components/AllIntegrations/WordPress/WordPressActions.jsx
new file mode 100644
index 000000000..803fd96a9
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPressActions.jsx
@@ -0,0 +1,147 @@
+import { create } from 'mutative'
+import { __ } from '../../../Utils/i18nwrap'
+import TableCheckBox from '../../Utilities/TableCheckBox'
+
+const appendOptionMeta = {
+  addTaxonomyToPost: {
+    title: __('Append Terms', 'bit-integrations'),
+    subTitle: __('Append taxonomy terms instead of replacing existing terms.', 'bit-integrations')
+  },
+  addTagsToPost: {
+    title: __('Append Tags', 'bit-integrations'),
+    subTitle: __('Append tags instead of replacing existing tags on the post.', 'bit-integrations')
+  },
+  addCategoryToPost: {
+    title: __('Append Categories', 'bit-integrations'),
+    subTitle: __(
+      'Append categories instead of replacing existing categories on the post.',
+      'bit-integrations'
+    )
+  }
+}
+
+const registerPostTypeUtilityOptions = [
+  {
+    key: 'public',
+    title: __('Public', 'bit-integrations'),
+    subTitle: __('Make this post type publicly queryable.', 'bit-integrations')
+  },
+  {
+    key: 'hierarchy',
+    title: __('Hierarchical', 'bit-integrations'),
+    subTitle: __('Enable hierarchical behavior for this post type.', 'bit-integrations')
+  },
+  {
+    key: 'showUI',
+    title: __('Show UI', 'bit-integrations'),
+    subTitle: __('Show admin UI for managing this post type.', 'bit-integrations')
+  },
+  {
+    key: 'showInMenu',
+    title: __('Show In Menu', 'bit-integrations'),
+    subTitle: __('Show this post type in the WordPress admin menu.', 'bit-integrations')
+  },
+  {
+    key: 'showInNavMenu',
+    title: __('Show In Nav Menu', 'bit-integrations'),
+    subTitle: __('Allow this post type in navigation menu selection.', 'bit-integrations')
+  },
+  {
+    key: 'showInAdminBar',
+    title: __('Show In Admin Bar', 'bit-integrations'),
+    subTitle: __('Show this post type in the WordPress admin bar.', 'bit-integrations')
+  }
+]
+
+const registerTaxonomyUtilityOptions = [
+  {
+    key: 'public',
+    title: __('Public', 'bit-integrations'),
+    subTitle: __('Make this taxonomy publicly queryable.', 'bit-integrations')
+  },
+  {
+    key: 'adminUI',
+    title: __('Admin UI', 'bit-integrations'),
+    subTitle: __('Show admin UI for managing this taxonomy.', 'bit-integrations')
+  },
+  {
+    key: 'hierarchy',
+    title: __('Hierarchical', 'bit-integrations'),
+    subTitle: __('Enable hierarchical taxonomy behavior.', 'bit-integrations')
+  },
+  {
+    key: 'restApi',
+    title: __('Show In REST API', 'bit-integrations'),
+    subTitle: __('Expose taxonomy in WordPress REST API.', 'bit-integrations')
+  }
+]
+
+export default function WordPressActions({ wordPressConf, setWordPressConf }) {
+  const mainAction = wordPressConf?.mainAction
+  const appendMeta = appendOptionMeta[mainAction]
+  const isRegisterPostTypeAction = mainAction === 'registerPostType'
+  const isRegisterTaxonomyAction = mainAction === 'registerTaxonomy'
+  const utilityOptions = isRegisterPostTypeAction
+    ? registerPostTypeUtilityOptions
+    : isRegisterTaxonomyAction
+      ? registerTaxonomyUtilityOptions
+      : []
+
+  if (!appendMeta && mainAction !== 'deleteMedia' && utilityOptions.length === 0) {
+    return null
+  }
+
+  const handleOptionChange = (event, type) => {
+    setWordPressConf(prevConf =>
+      create(prevConf, draftConf => {
+        if (event.target.checked) {
+          draftConf[type] = true
+        } else {
+          delete draftConf[type]
+        }
+      })
+    )
+  }
+
+  return (
+    <>
+      <div className="mt-1">
+        <b className="wdt-100">{__('Utilities', 'bit-integrations')}</b>
+      </div>
+      <div className="btcd-hr mt-1" />
+      <div className="pos-rel d-flx flx-wrp">
+        {appendMeta && (
+          <TableCheckBox
+            checked={wordPressConf?.append || false}
+            onChange={event => handleOptionChange(event, 'append')}
+            className="wdt-200 mt-4 mr-2"
+            value="append"
+            title={appendMeta.title}
+            subTitle={appendMeta.subTitle}
+          />
+        )}
+        {mainAction === 'deleteMedia' && (
+          <TableCheckBox
+            checked={wordPressConf?.forceDelete || false}
+            onChange={event => handleOptionChange(event, 'forceDelete')}
+            className="wdt-200 mt-4 mr-2"
+            value="forceDelete"
+            title={__('Force Delete', 'bit-integrations')}
+            subTitle={__('Permanently delete media instead of moving it to trash.', 'bit-integrations')}
+          />
+        )}
+        {utilityOptions.map(utility => (
+          <TableCheckBox
+            key={utility.key}
+            checked={wordPressConf?.[utility.key] || false}
+            onChange={event => handleOptionChange(event, utility.key)}
+            className="wdt-200 mt-4 mr-2"
+            value={utility.key}
+            title={utility.title}
+            subTitle={utility.subTitle}
+          />
+        ))}
+      </div>
+    </>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPressAuthorization.jsx b/frontend/src/components/AllIntegrations/WordPress/WordPressAuthorization.jsx
new file mode 100644
index 000000000..6ae9d9f75
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPressAuthorization.jsx
@@ -0,0 +1,76 @@
+import { useState } from 'react'
+import BackIcn from '../../../Icons/BackIcn'
+import bitsFetch from '../../../Utils/bitsFetch'
+import { __ } from '../../../Utils/i18nwrap'
+import LoaderSm from '../../Loaders/LoaderSm'
+import TutorialLink from '../../Utilities/TutorialLink'
+
+export default function WordPressAuthorization({
+  wordPressConf,
+  setWordPressConf,
+  step,
+  nextPage,
+  isLoading,
+  setIsLoading,
+  setSnackbar
+}) {
+  const [isAuthorized, setIsAuthorized] = useState(false)
+
+  const authorizeHandler = () => {
+    setIsLoading('auth')
+    bitsFetch({}, 'wordpress_authorize').then(result => {
+      if (result?.success) {
+        setIsAuthorized(true)
+        setSnackbar({ show: true, msg: __('WordPress connected', 'bit-integrations') })
+      } else {
+        setSnackbar({ show: true, msg: result?.data || __('Authorization failed', 'bit-integrations') })
+      }
+      setIsLoading(false)
+    })
+  }
+
+  const handleInput = e => {
+    const newConf = { ...wordPressConf }
+    newConf[e.target.name] = e.target.value
+    setWordPressConf(newConf)
+  }
+
+  return (
+    <div
+      className="btcd-stp-page"
+      style={{ width: step === 1 && 900, height: step === 1 && 'auto' }}>
+      <TutorialLink linkKey="wordPress" />
+
+      <div className="mt-3">
+        <b>{__('Integration Name:', 'bit-integrations')}</b>
+      </div>
+      <input
+        className="btcd-paper-inp w-6 mt-1"
+        onChange={handleInput}
+        name="name"
+        value={wordPressConf.name}
+        type="text"
+        placeholder={__('Integration Name...', 'bit-integrations')}
+      />
+
+      <button
+        onClick={authorizeHandler}
+        className="btn btcd-btn-lg purple sh-sm flx"
+        type="button"
+        disabled={isAuthorized || isLoading === 'auth'}>
+        {isAuthorized ? __('Connected', 'bit-integrations') : __('Connect to WordPress', 'bit-integrations')}
+        {isLoading === 'auth' && <LoaderSm size={20} clr="#022217" className="ml-2" />}
+      </button>
+
+      <br />
+      <button
+        onClick={() => nextPage(2)}
+        className="btn f-right btcd-btn-lg purple sh-sm flx"
+        type="button"
+        disabled={!isAuthorized}>
+        {__('Next', 'bit-integrations')}
+        <BackIcn className="ml-1 rev-icn" />
+      </button>
+    </div>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPressCommonFunc.js b/frontend/src/components/AllIntegrations/WordPress/WordPressCommonFunc.js
new file mode 100644
index 000000000..7da7b67e9
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPressCommonFunc.js
@@ -0,0 +1,144 @@
+import { create } from 'mutative'
+import {
+  AddCategoryToPostFields,
+  AddImageFields,
+  CategoryIdField,
+  CreateCategoryFields,
+  CreateProductCategoryFields,
+  CreateProductTagFields,
+  CreateProductTypeFields,
+  CreateTagFields,
+  CreateTermFields,
+  EmptyFields,
+  MediaIdField,
+  PluginPathField,
+  PostTypeFeaturesFields,
+  PostTypeField,
+  ProductTypeIdField,
+  RegisterPostTypeFields,
+  RegisterTaxonomyFields,
+  RenameMediaFields,
+  TagIdField,
+  TagsToPostFields,
+  TaxonomyField,
+  TaxonomyToPostFields,
+  TermIdTaxonomyFields,
+  UpdateCategoryFields,
+  UpdateProductCategoryFields,
+  UpdateProductTagFields,
+  UpdateProductTypeFields,
+  UpdateTagFields,
+  UpdateTermFields
+} from './staticData'
+
+export const handleInput = (e, wordPressConf, setWordPressConf) => {
+  const { name, value } = e.target
+  setWordPressConf(prevConf =>
+    create(prevConf, draftConf => {
+      draftConf[name] = value
+    })
+  )
+}
+
+export const getFieldsForAction = action => {
+  switch (action) {
+    // Post Types
+    case 'registerPostType':
+      return RegisterPostTypeFields
+    case 'unregisterPostType':
+      return PostTypeField
+    case 'addPostTypeFeatures':
+      return PostTypeFeaturesFields
+    // Post Tags
+    case 'createPostTag':
+      return CreateTagFields
+    case 'updatePostTag':
+      return UpdateTagFields
+    case 'deletePostTag':
+      return TagIdField
+    case 'addTaxonomyToPost':
+      return TaxonomyToPostFields
+    case 'removeTaxonomyFromPost':
+      return TaxonomyToPostFields
+    case 'addTagsToPost':
+      return TagsToPostFields
+    case 'removeTagsFromPost':
+      return TagsToPostFields
+    // Media
+    case 'addNewImage':
+      return AddImageFields
+    case 'deleteMedia':
+      return MediaIdField
+    case 'renameMedia':
+      return RenameMediaFields
+    // Taxonomies
+    case 'registerTaxonomy':
+      return RegisterTaxonomyFields
+    case 'unregisterTaxonomy':
+      return TaxonomyField
+    // Terms
+    case 'createNewTerm':
+      return CreateTermFields
+    case 'updateTerm':
+      return UpdateTermFields
+    case 'termDelete':
+      return TermIdTaxonomyFields
+    // Categories
+    case 'createCategory':
+      return CreateCategoryFields
+    case 'updateCategory':
+      return UpdateCategoryFields
+    case 'deleteCategory':
+      return CategoryIdField
+    case 'addCategoryToPost':
+      return AddCategoryToPostFields
+    // WooCommerce Product Tags
+    case 'createProductTag':
+      return CreateProductTagFields
+    case 'updateProductTag':
+      return UpdateProductTagFields
+    case 'deleteProductTag':
+      return TagIdField
+    // WooCommerce Product Categories
+    case 'createProductCategory':
+      return CreateProductCategoryFields
+    case 'updateProductCategory':
+      return UpdateProductCategoryFields
+    case 'deleteProductCategory':
+      return CategoryIdField
+    // WooCommerce Product Types
+    case 'createProductType':
+      return CreateProductTypeFields
+    case 'updateProductType':
+      return UpdateProductTypeFields
+    case 'deleteProductType':
+      return ProductTypeIdField
+    // Plugin
+    case 'checkPluginActivationStatus':
+      return PluginPathField
+    case 'activatePlugin':
+      return PluginPathField
+    default:
+      return EmptyFields
+  }
+}
+
+export const generateMappedField = fields => {
+  const requiredFlds = fields.filter(fld => fld.required === true)
+  return requiredFlds.length > 0
+    ? requiredFlds.map(field => ({ formField: '', wordPressField: field.key }))
+    : [{ formField: '', wordPressField: '' }]
+}
+
+export const checkMappedFields = wordPressConf => {
+  const mappedFields = wordPressConf?.field_map
+    ? wordPressConf.field_map.filter(mappedField => {
+        return (
+          !mappedField.formField ||
+          !mappedField.wordPressField ||
+          (mappedField.formField === 'custom' && !mappedField.customValue)
+        )
+      })
+    : []
+  return mappedFields.length === 0
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPressFieldMap.jsx b/frontend/src/components/AllIntegrations/WordPress/WordPressFieldMap.jsx
new file mode 100644
index 000000000..89565125d
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPressFieldMap.jsx
@@ -0,0 +1,104 @@
+import { useRecoilValue } from 'recoil'
+import { $appConfigState } from '../../../GlobalStates'
+import { __, sprintf } from '../../../Utils/i18nwrap'
+import { SmartTagField } from '../../../Utils/StaticData/SmartTagField'
+import TagifyInput from '../../Utilities/TagifyInput'
+import {
+  addFieldMap,
+  delFieldMap,
+  handleCustomValue,
+  handleFieldMapping
+} from '../GlobalIntegrationHelper'
+
+export default function WordPressFieldMap({ i, formFields, field, wordPressConf, setWordPressConf }) {
+  const btcbi = useRecoilValue($appConfigState)
+  const { isPro } = btcbi
+
+  const requiredFlds = wordPressConf?.wordPressFields?.filter(fld => fld.required === true) || []
+  const nonRequiredFlds = wordPressConf?.wordPressFields?.filter(fld => fld.required === false) || []
+
+  return (
+    <div className="flx mt-2 mb-2 btcbi-field-map">
+      <div className="pos-rel flx">
+        <div className="flx integ-fld-wrp">
+          <select
+            className="btcd-paper-inp mr-2"
+            name="formField"
+            value={field.formField || ''}
+            onChange={ev => handleFieldMapping(ev, i, wordPressConf, setWordPressConf)}>
+            <option value="">{__('Select Field', 'bit-integrations')}</option>
+            <optgroup label={__('Form Fields', 'bit-integrations')}>
+              {formFields?.map(f => (
+                <option key={`ff-wp-${f.name}`} value={f.name}>
+                  {f.label}
+                </option>
+              ))}
+            </optgroup>
+            <option value="custom">{__('Custom...', 'bit-integrations')}</option>
+            <optgroup
+              label={sprintf(
+                __('General Smart Codes %s', 'bit-integrations'),
+                isPro ? '' : `(${__('Pro', 'bit-integrations')})`
+              )}>
+              {isPro &&
+                SmartTagField?.map(f => (
+                  <option key={`ff-wp-${f.name}`} value={f.name}>
+                    {f.label}
+                  </option>
+                ))}
+            </optgroup>
+          </select>
+
+          {field.formField === 'custom' && (
+            <TagifyInput
+              onChange={e => handleCustomValue(e, i, wordPressConf, setWordPressConf)}
+              label={__('Custom Value', 'bit-integrations')}
+              className="mr-2"
+              type="text"
+              value={field.customValue}
+              placeholder={__('Custom Value', 'bit-integrations')}
+              formFields={formFields}
+            />
+          )}
+
+          <select
+            className="btcd-paper-inp"
+            disabled={i < requiredFlds.length}
+            name="wordPressField"
+            value={i < requiredFlds.length ? requiredFlds[i]?.key || '' : field.wordPressField || ''}
+            onChange={ev => handleFieldMapping(ev, i, wordPressConf, setWordPressConf)}>
+            <option value="">{__('Select Field', 'bit-integrations')}</option>
+            {i < requiredFlds.length ? (
+              <option key={requiredFlds[i].key} value={requiredFlds[i].key}>
+                {requiredFlds[i].label}
+              </option>
+            ) : (
+              nonRequiredFlds.map(({ key, label }) => (
+                <option key={key} value={key}>
+                  {label}
+                </option>
+              ))
+            )}
+          </select>
+        </div>
+        {i >= requiredFlds.length && (
+          <>
+            <button
+              onClick={() => addFieldMap(i, wordPressConf, setWordPressConf)}
+              className="icn-btn sh-sm ml-2 mr-1"
+              type="button">
+              +
+            </button>
+            <button
+              onClick={() => delFieldMap(i, wordPressConf, setWordPressConf)}
+              className="icn-btn sh-sm ml-1"
+              type="button"
+              aria-label="btn">
+              <span className="btcd-icn icn-trash-2" />
+            </button>
+          </>
+        )}
+      </div>
+    </div>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/WordPressIntegLayout.jsx b/frontend/src/components/AllIntegrations/WordPress/WordPressIntegLayout.jsx
new file mode 100644
index 000000000..16e41b179
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/WordPressIntegLayout.jsx
@@ -0,0 +1,122 @@
+import { create } from 'mutative'
+import { useRecoilValue } from 'recoil'
+import { $appConfigState } from '../../../GlobalStates'
+import { __ } from '../../../Utils/i18nwrap'
+import Loader from '../../Loaders/Loader'
+import { checkIsPro, getProLabel } from '../../Utilities/ProUtilHelpers'
+import { addFieldMap } from '../IntegrationHelpers/IntegrationHelpers'
+import WordPressActions from './WordPressActions'
+import { generateMappedField, getFieldsForAction } from './WordPressCommonFunc'
+import WordPressFieldMap from './WordPressFieldMap'
+import { modules } from './staticData'
+
+export default function WordPressIntegLayout({
+  formFields,
+  wordPressConf,
+  setWordPressConf,
+  isLoading
+}) {
+  const { isPro } = useRecoilValue($appConfigState)
+  const displayedFieldMaps = (wordPressConf?.field_map || []).reduce((acc, fieldMap, index) => {
+    acc.push({ fieldMap, index })
+
+    return acc
+  }, [])
+
+  const handleMainAction = value => {
+    setWordPressConf(prevConf =>
+      create(prevConf, draftConf => {
+        draftConf.mainAction = value
+        delete draftConf.append
+        delete draftConf.forceDelete
+        delete draftConf.public
+        delete draftConf.hierarchy
+        delete draftConf.showUI
+        delete draftConf.showInMenu
+        delete draftConf.showInNavMenu
+        delete draftConf.showInAdminBar
+        delete draftConf.adminUI
+        delete draftConf.restApi
+        const fields = getFieldsForAction(value)
+        draftConf.wordPressFields = fields
+        draftConf.field_map = generateMappedField(fields)
+      })
+    )
+  }
+
+  return (
+    <>
+      <br />
+      <div className="flx mt-3">
+        <b className="wdt-200 d-in-b">{__('Action:', 'bit-integrations')}</b>
+        <select
+          className="btcd-paper-inp w-5"
+          value={wordPressConf?.mainAction || ''}
+          onChange={e => handleMainAction(e.target.value)}>
+          <option value="">{__('Select Action', 'bit-integrations')}</option>
+          {modules.map(action => (
+            <option key={action.name} value={action.name} disabled={!checkIsPro(isPro, action.is_pro)}>
+              {checkIsPro(isPro, action.is_pro) ? action.label : getProLabel(action.label)}
+            </option>
+          ))}
+        </select>
+      </div>
+
+      {isLoading && (
+        <Loader
+          style={{
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+            height: 100,
+            transform: 'scale(0.7)'
+          }}
+        />
+      )}
+
+      {wordPressConf?.mainAction && !isLoading && (
+        <>
+          <div className="mt-4">
+            <b className="wdt-100">{__('Map Fields', 'bit-integrations')}</b>
+          </div>
+          <div className="btcd-hr mt-1" />
+          <div className="flx flx-around mt-2 mb-2 btcbi-field-map-label">
+            <div className="txt-dp">
+              <b>{__('Form Fields', 'bit-integrations')}</b>
+            </div>
+            <div className="txt-dp">
+              <b>{__('WordPress Fields', 'bit-integrations')}</b>
+            </div>
+          </div>
+
+          {displayedFieldMaps.map(({ fieldMap, index }) => (
+            <WordPressFieldMap
+              key={`wp-m-${index + 9}`}
+              i={index}
+              field={fieldMap}
+              wordPressConf={wordPressConf}
+              formFields={formFields}
+              setWordPressConf={setWordPressConf}
+            />
+          ))}
+
+          <div className="txt-center btcbi-field-map-button mt-2">
+            <button
+              onClick={() =>
+                addFieldMap(wordPressConf.field_map.length, wordPressConf, setWordPressConf)
+              }
+              className="icn-btn sh-sm"
+              type="button">
+              +
+            </button>
+          </div>
+          <div className="mt-3">
+            <WordPressActions wordPressConf={wordPressConf} setWordPressConf={setWordPressConf} />
+          </div>
+        </>
+      )}
+      <br />
+      <br />
+    </>
+  )
+}
diff --git a/frontend/src/components/AllIntegrations/WordPress/staticData.js b/frontend/src/components/AllIntegrations/WordPress/staticData.js
new file mode 100644
index 000000000..47f32a223
--- /dev/null
+++ b/frontend/src/components/AllIntegrations/WordPress/staticData.js
@@ -0,0 +1,417 @@
+import { __ } from '../../../Utils/i18nwrap'
+
+export const modules = [
+  // User/Post actions moved to dedicated actions:
+  // - WP User Registration
+  // - WP Post Creation
+  // Post Types
+  { name: 'registerPostType', label: __('Register Post Type', 'bit-integrations'), is_pro: true },
+  { name: 'unregisterPostType', label: __('Unregister Post Type', 'bit-integrations'), is_pro: true },
+  { name: 'addPostTypeFeatures', label: __('Add Post Type Features', 'bit-integrations'), is_pro: true },
+  // Post Tags
+  { name: 'createPostTag', label: __('Create Post Tag', 'bit-integrations'), is_pro: true },
+  { name: 'updatePostTag', label: __('Update Post Tag', 'bit-integrations'), is_pro: true },
+  { name: 'deletePostTag', label: __('Delete Post Tag', 'bit-integrations'), is_pro: true },
+  { name: 'addTaxonomyToPost', label: __('Add Taxonomy To Post', 'bit-integrations'), is_pro: true },
+  {
+    name: 'removeTaxonomyFromPost',
+    label: __('Remove Taxonomy From Post', 'bit-integrations'),
+    is_pro: true
+  },
+  { name: 'addTagsToPost', label: __('Add Tags To Post', 'bit-integrations'), is_pro: true },
+  { name: 'removeTagsFromPost', label: __('Remove Tags From Post', 'bit-integrations'), is_pro: true },
+  // Media
+  { name: 'addNewImage', label: __('Add New Image', 'bit-integrations'), is_pro: true },
+  { name: 'deleteMedia', label: __('Delete Media', 'bit-integrations'), is_pro: true },
+  { name: 'renameMedia', label: __('Rename Media', 'bit-integrations'), is_pro: true },
+  // Taxonomies
+  { name: 'registerTaxonomy', label: __('Register Taxonomy', 'bit-integrations'), is_pro: true },
+  { name: 'unregisterTaxonomy', label: __('Unregister Taxonomy', 'bit-integrations'), is_pro: true },
+  // Terms
+  { name: 'createNewTerm', label: __('Create New Term', 'bit-integrations'), is_pro: true },
+  { name: 'updateTerm', label: __('Update Term', 'bit-integrations'), is_pro: true },
+  { name: 'termDelete', label: __('Delete Term', 'bit-integrations'), is_pro: true },
+  // Categories
+  { name: 'createCategory', label: __('Create Category', 'bit-integrations'), is_pro: true },
+  { name: 'updateCategory', label: __('Update Category', 'bit-integrations'), is_pro: true },
+  { name: 'deleteCategory', label: __('Delete Category', 'bit-integrations'), is_pro: true },
+  { name: 'addCategoryToPost', label: __('Add Category To Post', 'bit-integrations'), is_pro: true },
+  // WooCommerce Product Tags
+  { name: 'createProductTag', label: __('Create Product Tag', 'bit-integrations'), is_pro: true },
+  { name: 'updateProductTag', label: __('Update Product Tag', 'bit-integrations'), is_pro: true },
+  { name: 'deleteProductTag', label: __('Delete Product Tag', 'bit-integrations'), is_pro: true },
+  // WooCommerce Product Categories
+  {
+    name: 'createProductCategory',
+    label: __('Create Product Category', 'bit-integrations'),
+    is_pro: true
+  },
+  {
+    name: 'updateProductCategory',
+    label: __('Update Product Category', 'bit-integrations'),
+    is_pro: true
+  },
+  {
+    name: 'deleteProductCategory',
+    label: __('Delete Product Category', 'bit-integrations'),
+    is_pro: true
+  },
+  // WooCommerce Product Types
+  { name: 'createProductType', label: __('Create Product Type', 'bit-integrations'), is_pro: true },
+  { name: 'updateProductType', label: __('Update Product Type', 'bit-integrations'), is_pro: true },
+  { name: 'deleteProductType', label: __('Delete Product Type', 'bit-integrations'), is_pro: true },
+  // Plugin Management
+  {
+    name: 'checkPluginActivationStatus',
+    label: __('Check Plugin Activation Status', 'bit-integrations'),
+    is_pro: true
+  },
+  { name: 'activatePlugin', label: __('Activate Plugin', 'bit-integrations'), is_pro: true }
+]
+
+// === User Fields ===
+export const CreateUserFields = [
+  { key: 'user_login', label: __('Username', 'bit-integrations'), required: true },
+  { key: 'user_email', label: __('Email', 'bit-integrations'), required: true },
+  { key: 'user_pass', label: __('Password', 'bit-integrations'), required: true },
+  { key: 'display_name', label: __('Display Name', 'bit-integrations'), required: false },
+  { key: 'first_name', label: __('First Name', 'bit-integrations'), required: false },
+  { key: 'last_name', label: __('Last Name', 'bit-integrations'), required: false },
+  { key: 'user_url', label: __('Website URL', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false },
+  { key: 'role', label: __('Role', 'bit-integrations'), required: false }
+]
+
+export const UpdateUserFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  { key: 'user_email', label: __('Email', 'bit-integrations'), required: false },
+  { key: 'user_pass', label: __('Password', 'bit-integrations'), required: false },
+  { key: 'display_name', label: __('Display Name', 'bit-integrations'), required: false },
+  { key: 'first_name', label: __('First Name', 'bit-integrations'), required: false },
+  { key: 'last_name', label: __('Last Name', 'bit-integrations'), required: false },
+  { key: 'user_url', label: __('Website URL', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false },
+  { key: 'role', label: __('Role', 'bit-integrations'), required: false }
+]
+
+export const UserIdField = [{ key: 'user_id', label: __('User ID', 'bit-integrations'), required: true }]
+
+export const UserEmailField = [
+  { key: 'user_email', label: __('Email', 'bit-integrations'), required: true }
+]
+
+export const UserByFieldFields = [
+  { key: 'field', label: __('Field Name (login/email/slug/id)', 'bit-integrations'), required: true },
+  { key: 'value', label: __('Field Value', 'bit-integrations'), required: true }
+]
+
+export const UserRoleField = [{ key: 'role', label: __('Role', 'bit-integrations'), required: true }]
+
+export const UserMetaFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  { key: 'meta_key', label: __('Meta Key', 'bit-integrations'), required: true }
+]
+
+export const UpdateUserMetaFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  { key: 'meta_key', label: __('Meta Key', 'bit-integrations'), required: true },
+  { key: 'meta_value', label: __('Meta Value', 'bit-integrations'), required: true }
+]
+
+// === Role Fields ===
+export const CreateRoleFields = [
+  { key: 'role_name', label: __('Role Name (slug)', 'bit-integrations'), required: true },
+  { key: 'display_name', label: __('Display Name', 'bit-integrations'), required: true },
+  {
+    key: 'capabilities',
+    label: __('Capabilities (comma separated)', 'bit-integrations'),
+    required: false
+  }
+]
+
+export const RoleNameField = [
+  { key: 'role_name', label: __('Role Name', 'bit-integrations'), required: true }
+]
+
+export const UserRoleManageFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  { key: 'role', label: __('Role', 'bit-integrations'), required: true }
+]
+
+export const UpdateUserRoleFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  { key: 'old_role', label: __('Old Role', 'bit-integrations'), required: true },
+  { key: 'new_role', label: __('New Role', 'bit-integrations'), required: true }
+]
+
+// === Capability Fields ===
+export const RoleCapabilitiesFields = [
+  { key: 'role_name', label: __('Role Name', 'bit-integrations'), required: true },
+  {
+    key: 'capabilities',
+    label: __('Capabilities (comma separated)', 'bit-integrations'),
+    required: true
+  }
+]
+
+export const UserCapabilitiesFields = [
+  { key: 'user_id', label: __('User ID', 'bit-integrations'), required: true },
+  {
+    key: 'capabilities',
+    label: __('Capabilities (comma separated)', 'bit-integrations'),
+    required: true
+  }
+]
+
+// === Post Fields ===
+export const CreatePostFields = [
+  { key: 'post_title', label: __('Post Title', 'bit-integrations'), required: true },
+  { key: 'post_content', label: __('Post Content', 'bit-integrations'), required: false },
+  { key: 'post_status', label: __('Post Status', 'bit-integrations'), required: false },
+  { key: 'post_type', label: __('Post Type', 'bit-integrations'), required: false },
+  { key: 'post_author', label: __('Post Author ID', 'bit-integrations'), required: false },
+  { key: 'post_date', label: __('Post Date', 'bit-integrations'), required: false },
+  { key: 'post_name', label: __('Post Slug', 'bit-integrations'), required: false },
+  { key: 'post_excerpt', label: __('Post Excerpt', 'bit-integrations'), required: false },
+  { key: 'menu_order', label: __('Menu Order', 'bit-integrations'), required: false },
+  {
+    key: 'comment_status',
+    label: __('Comment Status (open/closed)', 'bit-integrations'),
+    required: false
+  },
+  { key: 'featured_image_url', label: __('Featured Image URL', 'bit-integrations'), required: false },
+  { key: 'post_password', label: __('Post Password', 'bit-integrations'), required: false }
+]
+
+export const UpdatePostFields = [
+  { key: 'post_id', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'post_title', label: __('Post Title', 'bit-integrations'), required: false },
+  { key: 'post_content', label: __('Post Content', 'bit-integrations'), required: false },
+  { key: 'post_status', label: __('Post Status', 'bit-integrations'), required: false },
+  { key: 'post_type', label: __('Post Type', 'bit-integrations'), required: false },
+  { key: 'post_author', label: __('Post Author ID', 'bit-integrations'), required: false },
+  { key: 'post_date', label: __('Post Date', 'bit-integrations'), required: false },
+  { key: 'post_name', label: __('Post Slug', 'bit-integrations'), required: false },
+  { key: 'post_excerpt', label: __('Post Excerpt', 'bit-integrations'), required: false },
+  { key: 'featured_image_url', label: __('Featured Image URL', 'bit-integrations'), required: false }
+]
+
+export const PostIdField = [{ key: 'post_id', label: __('Post ID', 'bit-integrations'), required: true }]
+
+export const PostTypeField = [{ key: 'key', label: __('Post Type', 'bit-integrations'), required: true }]
+
+export const PostsByMetaFields = [
+  { key: 'meta_key', label: __('Meta Key', 'bit-integrations'), required: true },
+  { key: 'meta_value', label: __('Meta Value', 'bit-integrations'), required: true }
+]
+
+export const PostMetaByKeyFields = [
+  { key: 'post_id', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'meta_key', label: __('Meta Key', 'bit-integrations'), required: true }
+]
+
+export const UpdatePostStatusFields = [
+  { key: 'post_id', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'post_status', label: __('Post Status', 'bit-integrations'), required: true }
+]
+
+// === Comment Fields ===
+export const CreateCommentFields = [
+  { key: 'comment_post_ID', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'comment_content', label: __('Comment Content', 'bit-integrations'), required: true },
+  { key: 'comment_author', label: __('Author Name', 'bit-integrations'), required: false },
+  { key: 'comment_author_email', label: __('Author Email', 'bit-integrations'), required: false },
+  { key: 'comment_author_url', label: __('Author URL', 'bit-integrations'), required: false },
+  { key: 'comment_parent', label: __('Parent Comment ID', 'bit-integrations'), required: false }
+]
+
+export const ReplyCommentFields = [
+  { key: 'comment_parent', label: __('Parent Comment ID', 'bit-integrations'), required: true },
+  { key: 'comment_content', label: __('Comment Content', 'bit-integrations'), required: true },
+  { key: 'comment_post_ID', label: __('Post ID', 'bit-integrations'), required: false },
+  { key: 'comment_author', label: __('Author Name', 'bit-integrations'), required: false },
+  { key: 'comment_author_email', label: __('Author Email', 'bit-integrations'), required: false }
+]
+
+export const CommentIdField = [
+  { key: 'comment_id', label: __('Comment ID', 'bit-integrations'), required: true }
+]
+
+export const CommentMetaByKeyFields = [
+  { key: 'comment_id', label: __('Comment ID', 'bit-integrations'), required: true },
+  { key: 'meta_key', label: __('Meta Key', 'bit-integrations'), required: true }
+]
+
+// === Post Type Fields ===
+export const RegisterPostTypeFields = [
+  { key: 'key', label: __('Post Type Slug', 'bit-integrations'), required: true },
+  { key: 'label', label: __('Label', 'bit-integrations'), required: true },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false },
+  { key: 'supports', label: __('Supports (comma separated)', 'bit-integrations'), required: false },
+  { key: 'menuPosition', label: __('Menu Position', 'bit-integrations'), required: false },
+  { key: 'rewriteSlug', label: __('Rewrite Slug', 'bit-integrations'), required: false }
+]
+
+export const PostTypeFeaturesFields = [
+  { key: 'key', label: __('Post Type', 'bit-integrations'), required: true },
+  { key: 'supports', label: __('Features (comma separated)', 'bit-integrations'), required: true }
+]
+
+// === Tag / Taxonomy / Term Fields ===
+export const CreateTagFields = [
+  { key: 'name', label: __('Tag Name', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const UpdateTagFields = [
+  { key: 'termId', label: __('Tag ID', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Tag Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const TagIdField = [{ key: 'termId', label: __('Tag ID', 'bit-integrations'), required: true }]
+
+export const TaxonomyToPostFields = [
+  { key: 'postId', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'taxonomy', label: __('Taxonomy', 'bit-integrations'), required: true },
+  { key: 'term', label: __('Term (ID or slug)', 'bit-integrations'), required: true }
+]
+
+export const TagsToPostFields = [
+  { key: 'postId', label: __('Post ID', 'bit-integrations'), required: true },
+  { key: 'tags', label: __('Tags (comma separated IDs/slugs)', 'bit-integrations'), required: true }
+]
+
+// === Media Fields ===
+export const AddImageFields = [
+  { key: 'image_url', label: __('Image URL', 'bit-integrations'), required: true },
+  { key: 'title', label: __('Title', 'bit-integrations'), required: false },
+  { key: 'caption', label: __('Caption', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false },
+  { key: 'altText', label: __('Alt Text', 'bit-integrations'), required: false }
+]
+
+export const MediaIdField = [{ key: 'id', label: __('Media ID', 'bit-integrations'), required: true }]
+
+export const RenameMediaFields = [
+  { key: 'id', label: __('Media ID', 'bit-integrations'), required: true },
+  { key: 'title', label: __('New Title', 'bit-integrations'), required: true }
+]
+
+export const MediaTitleField = [{ key: 'title', label: __('Title', 'bit-integrations'), required: true }]
+
+// === Taxonomy Fields ===
+export const TaxonomyField = [{ key: 'slug', label: __('Taxonomy', 'bit-integrations'), required: true }]
+
+export const RegisterTaxonomyFields = [
+  { key: 'slug', label: __('Taxonomy Slug', 'bit-integrations'), required: true },
+  { key: 'postTypes', label: __('Post Types (comma separated)', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Label', 'bit-integrations'), required: true },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false },
+  { key: 'rewriteSlug', label: __('Rewrite Slug', 'bit-integrations'), required: false }
+]
+
+// === Term Fields ===
+export const TermIdTaxonomyFields = [
+  { key: 'termId', label: __('Term ID', 'bit-integrations'), required: true },
+  { key: 'taxonomy', label: __('Taxonomy', 'bit-integrations'), required: true }
+]
+
+export const TermByFieldFields = [
+  { key: 'field', label: __('Field (id/name/slug)', 'bit-integrations'), required: true },
+  { key: 'value', label: __('Value', 'bit-integrations'), required: true },
+  { key: 'taxonomy', label: __('Taxonomy', 'bit-integrations'), required: true }
+]
+
+export const CreateTermFields = [
+  { key: 'name', label: __('Term Name', 'bit-integrations'), required: true },
+  { key: 'taxonomy', label: __('Taxonomy', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const UpdateTermFields = [
+  { key: 'termId', label: __('Term ID', 'bit-integrations'), required: true },
+  { key: 'taxonomy', label: __('Taxonomy', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Term Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+// === Category Fields ===
+export const CreateCategoryFields = [
+  { key: 'name', label: __('Category Name', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const UpdateCategoryFields = [
+  { key: 'termId', label: __('Category ID', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Category Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const CategoryIdField = [
+  { key: 'termId', label: __('Category ID', 'bit-integrations'), required: true }
+]
+
+export const AddCategoryToPostFields = [
+  { key: 'postId', label: __('Post ID', 'bit-integrations'), required: true },
+  {
+    key: 'categories',
+    label: __('Category IDs (comma separated)', 'bit-integrations'),
+    required: true
+  }
+]
+
+// === WooCommerce Tag/Category/Type Fields ===
+export const CreateProductTagFields = [
+  { key: 'name', label: __('Tag Name', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const UpdateProductTagFields = [
+  { key: 'termId', label: __('Tag ID', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Tag Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const CreateProductCategoryFields = [
+  { key: 'name', label: __('Category Name', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const UpdateProductCategoryFields = [
+  { key: 'termId', label: __('Category ID', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Category Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false },
+  { key: 'description', label: __('Description', 'bit-integrations'), required: false }
+]
+
+export const CreateProductTypeFields = [
+  { key: 'name', label: __('Type Name', 'bit-integrations'), required: true },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false }
+]
+
+export const UpdateProductTypeFields = [
+  { key: 'termId', label: __('Type ID', 'bit-integrations'), required: true },
+  { key: 'name', label: __('Type Name', 'bit-integrations'), required: false },
+  { key: 'slug', label: __('Slug', 'bit-integrations'), required: false }
+]
+
+export const ProductTypeIdField = [
+  { key: 'termId', label: __('Type ID', 'bit-integrations'), required: true }
+]
+
+// === Plugin Fields ===
+export const PluginPathField = [
+  { key: 'pluginFile', label: __('Plugin Path (folder/file.php)', 'bit-integrations'), required: true }
+]
+
+export const EmptyFields = []
diff --git a/frontend/src/components/AllIntegrations/ZagoMail/ZagoMailAuthorization.jsx b/frontend/src/components/AllIntegrations/ZagoMail/ZagoMailAuthorization.jsx
index 9288dce80..5a5f27ba9 100644
--- a/frontend/src/components/AllIntegrations/ZagoMail/ZagoMailAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZagoMail/ZagoMailAuthorization.jsx
@@ -5,7 +5,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import Note from '../../Utilities/Note'
 import { refreshZagoMailList } from './ZagoMailCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZagoMailAuthorization({
@@ -77,7 +76,7 @@ const [isAuthorized, setisAuthorized] = useState(false)
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zago Mail" links={tutorialLinks?.zagoMail || {}} />
+            <TutorialLink linkKey="zagoMail" />
 
       <div className="mt-3 wdt-200">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Zapier/Zapier.jsx b/frontend/src/components/AllIntegrations/Zapier/Zapier.jsx
index 8a63514f0..4f68dbb94 100644
--- a/frontend/src/components/AllIntegrations/Zapier/Zapier.jsx
+++ b/frontend/src/components/AllIntegrations/Zapier/Zapier.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksIntegration from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function Zapier({ formFields, setFlow, flow, allIntegURL }) {
@@ -34,7 +33,7 @@ const [zapier, setZapier] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Zapier" links={tutorialLinks?.zapierLinks || {}} />
+                <TutorialLink linkKey="zapierLinks" />
 
         <WebHooksIntegration
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/Zendesk/ZendeskAuthorization.jsx b/frontend/src/components/AllIntegrations/Zendesk/ZendeskAuthorization.jsx
index a2235fba5..27b4d776e 100644
--- a/frontend/src/components/AllIntegrations/Zendesk/ZendeskAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Zendesk/ZendeskAuthorization.jsx
@@ -4,7 +4,6 @@ import { useState } from 'react'
 import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { zendeskAuthentication } from './ZendeskCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZendeskAuthorization({
@@ -40,7 +39,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zendesk" links={tutorialLinks?.zendesk || {}} />
+            <TutorialLink linkKey="zendesk" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoAnalytics/ZohoAnalyticsAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoAnalytics/ZohoAnalyticsAuthorization.jsx
index 68ede7a52..81f8a2a08 100644
--- a/frontend/src/components/AllIntegrations/ZohoAnalytics/ZohoAnalyticsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoAnalytics/ZohoAnalyticsAuthorization.jsx
@@ -5,7 +5,6 @@ import CopyText from '../../Utilities/CopyText'
 import LoaderSm from '../../Loaders/LoaderSm'
 import { handleAuthorize, refreshWorkspaces } from './ZohoAnalyticsCommonFunc'
 import BackIcn from '../../../Icons/BackIcn'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoAnalyticsAuthorization({
@@ -56,7 +55,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Analytics" links={tutorialLinks?.analytics || {}} />
+            <TutorialLink linkKey="analytics" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoBigin/ZohoBiginAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoBigin/ZohoBiginAuthorization.jsx
index 37eb5f680..229a5b4fb 100644
--- a/frontend/src/components/AllIntegrations/ZohoBigin/ZohoBiginAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoBigin/ZohoBiginAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
 import { refreshModules } from './ZohoBiginCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoBiginAuthorization({
@@ -48,7 +47,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Bigin" links={tutorialLinks?.zohoBigin || {}} />
+            <TutorialLink linkKey="zohoBigin" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoCRM/ZohoCRMAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoCRM/ZohoCRMAuthorization.jsx
index 849c8cacc..0ae96a010 100644
--- a/frontend/src/components/AllIntegrations/ZohoCRM/ZohoCRMAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoCRM/ZohoCRMAuthorization.jsx
@@ -6,7 +6,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import { refreshModules } from './ZohoCRMCommonFunc'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
 import { $appConfigState } from '../../../GlobalStates'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoCRMAuthorization({
@@ -46,7 +45,7 @@ const scopes = 'ZohoCRM.modules.ALL,ZohoCRM.settings.ALL,ZohoCRM.users.Read,zoho
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho CRM" links={tutorialLinks?.zohoCRM || {}} />
+            <TutorialLink linkKey="zohoCRM" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoCampaigns/ZohoCampaignsAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoCampaigns/ZohoCampaignsAuthorization.jsx
index 57f3724b2..11004b841 100644
--- a/frontend/src/components/AllIntegrations/ZohoCampaigns/ZohoCampaignsAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoCampaigns/ZohoCampaignsAuthorization.jsx
@@ -7,7 +7,6 @@ import { refreshLists } from './ZohoCampaignsCommonFunc'
 import BackIcn from '../../../Icons/BackIcn'
 import { $appConfigState } from '../../../GlobalStates'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoCampaignsAuthorization({
@@ -47,7 +46,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Campaigns" links={tutorialLinks?.zohoCampaigns || {}} />
+            <TutorialLink linkKey="zohoCampaigns" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoCreator/ZohoCreatorAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoCreator/ZohoCreatorAuthorization.jsx
index a6c5376c1..1763c7a36 100644
--- a/frontend/src/components/AllIntegrations/ZohoCreator/ZohoCreatorAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoCreator/ZohoCreatorAuthorization.jsx
@@ -4,7 +4,6 @@ import { __ } from '../../../Utils/i18nwrap'
 import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize, refreshApplications } from './ZohoCreatorCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoCreatorAuthorization({
@@ -53,7 +52,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Creator" links={tutorialLinks?.zohoCreator || {}} />
+            <TutorialLink linkKey="zohoCreator" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoDesk/ZohoDeskAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoDesk/ZohoDeskAuthorization.jsx
index 169b06c62..6e781f1e9 100644
--- a/frontend/src/components/AllIntegrations/ZohoDesk/ZohoDeskAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoDesk/ZohoDeskAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
 import { refreshOrganizations } from './ZohoDeskCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoDeskAuthorization({
@@ -48,7 +47,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Desk" links={tutorialLinks?.zohoDesk || {}} />
+            <TutorialLink linkKey="zohoDesk" />
 
       <div className="wdt-200 d-in-b mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoFlow/ZohoFlow.jsx b/frontend/src/components/AllIntegrations/ZohoFlow/ZohoFlow.jsx
index aba308c35..cd19b6e64 100644
--- a/frontend/src/components/AllIntegrations/ZohoFlow/ZohoFlow.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoFlow/ZohoFlow.jsx
@@ -7,7 +7,6 @@ import Steps from '../../Utilities/Steps'
 import { saveIntegConfig } from '../IntegrationHelpers/IntegrationHelpers'
 import WebHooksLayouts from '../IntegrationHelpers/WebHook/WebHooksIntegration'
 import WebHooksStepTwo from '../IntegrationHelpers/WebHook/WebHooksStepTwo'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 function ZohoFlow({ formFields, setFlow, flow, allIntegURL }) {
@@ -35,7 +34,7 @@ const [zohoFlow, setZohoFlow] = useState({
       <div
         className="btcd-stp-page"
         style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-                <TutorialLink title="Zoho Flow" links={tutorialLinks?.zohoFlowLinks || {}} />
+                <TutorialLink linkKey="zohoFlowLinks" />
 
         <WebHooksLayouts
           formID={formID}
diff --git a/frontend/src/components/AllIntegrations/ZohoMarketingHub/ZohoMarketingHubAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoMarketingHub/ZohoMarketingHubAuthorization.jsx
index c39725601..88b6cae18 100644
--- a/frontend/src/components/AllIntegrations/ZohoMarketingHub/ZohoMarketingHubAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoMarketingHub/ZohoMarketingHubAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
 import { refreshLists } from './ZohoMarketingHubCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoMarketingAuthorization({
@@ -47,7 +46,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Marketing Automation (Zoho Marketing Hub)" links={tutorialLinks?.zohoMarketingHub || {}} />
+            <TutorialLink linkKey="zohoMarketingHub" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoRecruit/ZohoRecruitAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoRecruit/ZohoRecruitAuthorization.jsx
index 2b4d320bb..f81c23824 100644
--- a/frontend/src/components/AllIntegrations/ZohoRecruit/ZohoRecruitAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoRecruit/ZohoRecruitAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { handleAuthorize } from '../IntegrationHelpers/IntegrationHelpers'
 import { refreshModules } from './ZohoRecruitCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoRecruitAuthorization({
@@ -47,7 +46,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Recruit" links={tutorialLinks?.zohoRecruit || {}} />
+            <TutorialLink linkKey="zohoRecruit" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZohoSheet/ZohoSheetAuthorization.jsx b/frontend/src/components/AllIntegrations/ZohoSheet/ZohoSheetAuthorization.jsx
index 35622d44b..006d2ba89 100644
--- a/frontend/src/components/AllIntegrations/ZohoSheet/ZohoSheetAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZohoSheet/ZohoSheetAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import { $appConfigState } from '../../../GlobalStates'
 import { handleAuthorization } from './ZohoSheetCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZohoSheetAuthorization({
@@ -46,7 +45,7 @@ const nextPage = () => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && 'auto' } }}>
-            <TutorialLink title="Zoho Sheet" links={tutorialLinks?.zohoSheet || {}} />
+            <TutorialLink linkKey="zohoSheet" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/Zoom/ZoomAuthorization.jsx b/frontend/src/components/AllIntegrations/Zoom/ZoomAuthorization.jsx
index e9086a353..3a0b38533 100644
--- a/frontend/src/components/AllIntegrations/Zoom/ZoomAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/Zoom/ZoomAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import Note from '../../Utilities/Note'
 import { handleAuthorize, zoomAllMeeting } from './ZoomCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZoomAuthorization({
@@ -60,7 +59,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && `${100}%` } }}>
-            <TutorialLink title="Zoom Meeting" links={tutorialLinks?.zoomMeeting || {}} />
+            <TutorialLink linkKey="zoomMeeting" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/AllIntegrations/ZoomWebinar/ZoomWebinarAuthorization.jsx b/frontend/src/components/AllIntegrations/ZoomWebinar/ZoomWebinarAuthorization.jsx
index a9e2cac0f..ccf6e91be 100644
--- a/frontend/src/components/AllIntegrations/ZoomWebinar/ZoomWebinarAuthorization.jsx
+++ b/frontend/src/components/AllIntegrations/ZoomWebinar/ZoomWebinarAuthorization.jsx
@@ -7,7 +7,6 @@ import LoaderSm from '../../Loaders/LoaderSm'
 import CopyText from '../../Utilities/CopyText'
 import Note from '../../Utilities/Note'
 import { handleAuthorize, zoomAllWebinar } from './ZoomCommonFunc'
-import tutorialLinks from '../../../Utils/StaticData/tutorialLinks'
 import TutorialLink from '../../Utilities/TutorialLink'
 
 export default function ZoomWebinarAuthorization({
@@ -59,7 +58,7 @@ const handleInput = e => {
     <div
       className="btcd-stp-page"
       style={{ ...{ width: step === 1 && 900 }, ...{ height: step === 1 && `${100}%` } }}>
-            <TutorialLink title="Zoom Webinars" links={tutorialLinks?.zoomWebinar || {}} />
+            <TutorialLink linkKey="zoomWebinar" />
 
       <div className="mt-3">
         <b>{__('Integration Name:', 'bit-integrations')}</b>
diff --git a/frontend/src/components/Flow/New/SelectAction.jsx b/frontend/src/components/Flow/New/SelectAction.jsx
index 0ffdaa1aa..aa9bfebf2 100644
--- a/frontend/src/components/Flow/New/SelectAction.jsx
+++ b/frontend/src/components/Flow/New/SelectAction.jsx
@@ -44,7 +44,7 @@ export default function SelectAction() {
     { type: 'Google Calendar' },
     { type: 'Pods' },
     { type: 'Zoho Flow' },
-    { type: 'WP User Registration' },
+    { type: 'WP User Registration', logo: 'registration' },
     { type: 'Mail Poet' },
     { type: 'Brevo(SendinBlue)', logo: 'brevo' },
     { type: 'Telegram' },
@@ -177,6 +177,7 @@ export default function SelectAction() {
     { type: 'MailerPress' },
     { type: 'CreatorLms' },
     { type: 'FluentCart' },
+    { type: 'WordPress' },
     { type: 'PeepSo' },
     { type: 'Ninja Tables' },
     { type: 'WC Affiliate' },
diff --git a/frontend/src/components/Triggers/ActionHook.jsx b/frontend/src/components/Triggers/ActionHook.jsx
index 69bd405b9..07f3593fe 100644
--- a/frontend/src/components/Triggers/ActionHook.jsx
+++ b/frontend/src/components/Triggers/ActionHook.jsx
@@ -37,6 +37,12 @@ const ActionHook = () => {
   const [snack, setSnackbar] = useState({ show: false })
   const [showResponse, setShowResponse] = useState(false)
   const isFetchingRef = useRef(false)
+  const actionHookTutorialLinks = {
+    actionHook: {
+      docLink: 'https://bitapps.pro/docs/bit-integrations/trigger/action-hook-integrations',
+      youTubeLink: 'https://youtu.be/pZ-8JuZfIco?si=Xxv857hJjv6p5Tcu'
+    }
+  }
 
   let controller = new AbortController()
   const signal = controller.signal
@@ -338,14 +344,8 @@ const ActionHook = () => {
           </button>
         </div>
       )}
-      <Note note={info} isInstruction={true} maxWidth="100%" >
-        <TutorialLink
-          style={{ margin: 0 }}
-          links={{
-            docLink: "https://bitapps.pro/docs/bit-integrations/trigger/action-hook-integrations",
-            youTubeLink: "https://youtu.be/pZ-8JuZfIco?si=Xxv857hJjv6p5Tcu"
-          }}
-        />
+      <Note note={info} isInstruction={true} maxWidth="100%">
+        <TutorialLink linkKey="actionHook" linksMap={actionHookTutorialLinks} style={{ margin: 0 }} />
       </Note>
     </div>
   )
@@ -386,4 +386,4 @@ const info = `<h4>${sprintf(
   'Bit Integrations Trigger Hooks',
   'bit-integrations'
 )}</a>
-            </h5>`
\ No newline at end of file
+            </h5>`
diff --git a/frontend/src/components/Triggers/CustomFormSubmission.jsx b/frontend/src/components/Triggers/CustomFormSubmission.jsx
index 7b852ead4..7a5b683bf 100644
--- a/frontend/src/components/Triggers/CustomFormSubmission.jsx
+++ b/frontend/src/components/Triggers/CustomFormSubmission.jsx
@@ -33,6 +33,15 @@ const CustomFormSubmission = () => {
   const [snack, setSnackbar] = useState({ show: false })
   const [showResponse, setShowResponse] = useState(false)
   const isFetchingRef = useRef(false)
+  const triggerLinkKey = newFlow?.triggered_entity
+  const triggerTutorialLinks = triggerLinkKey
+    ? {
+      [triggerLinkKey]: {
+        docLink: newFlow?.triggerDetail?.documentation_url || '',
+        youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
+      }
+    }
+    : undefined
 
   let controller = new AbortController()
   const signal = controller.signal
@@ -318,13 +327,11 @@ const CustomFormSubmission = () => {
       )}
       <div className="flx flx-center">
         <div style={{ width: '100%', maxWidth: 450 }}>
-          <Note note={info(newFlow)} isInstruction={true} maxWidth="100%" >
+          <Note note={info(newFlow)} isInstruction={true} maxWidth="100%">
             <TutorialLink
+              linkKey={triggerLinkKey}
+              linksMap={triggerTutorialLinks}
               style={{ marginTop: 0 }}
-              links={{
-                docLink: newFlow?.triggerDetail?.documentation_url,
-                youTubeLink: newFlow?.triggerDetail?.tutorial_url
-              }}
             />
           </Note>
         </div>
@@ -362,4 +369,3 @@ const info = newFlow => `<h4>${sprintf(
     ? `<h4 className="mt-0">Note</h4>${newFlow?.triggerDetail?.note}`
     : ''
   }`
-
diff --git a/frontend/src/components/Triggers/CustomTrigger.jsx b/frontend/src/components/Triggers/CustomTrigger.jsx
index 82fc7a7dc..564a07aba 100644
--- a/frontend/src/components/Triggers/CustomTrigger.jsx
+++ b/frontend/src/components/Triggers/CustomTrigger.jsx
@@ -30,6 +30,15 @@ const CustomTrigger = () => {
   const [snack, setSnackbar] = useState({ show: false })
   const [showResponse, setShowResponse] = useState(false)
   const isFetchingRef = useRef(false)
+  const triggerLinkKey = newFlow?.triggered_entity
+  const triggerTutorialLinks = triggerLinkKey
+    ? {
+        [triggerLinkKey]: {
+          docLink: newFlow?.triggerDetail?.documentation_url || '',
+          youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
+        }
+      }
+    : undefined
 
   let controller = new AbortController()
   const signal = controller.signal
@@ -212,8 +221,9 @@ const CustomTrigger = () => {
       <div className="flx flx-between">
         <button
           onClick={handleFetch}
-          className={`btn btcd-btn-lg sh-sm flx ${isLoading ? 'purple' : newFlow.triggerDetail?.data ? 'gray' : 'purple'
-            }`}
+          className={`btn btcd-btn-lg sh-sm flx ${
+            isLoading ? 'purple' : newFlow.triggerDetail?.data ? 'gray' : 'purple'
+          }`}
           type="button"
           disabled={!hookID}>
           {isLoading
@@ -259,13 +269,11 @@ const CustomTrigger = () => {
           </button>
         </div>
       )}
-      <Note note={info} isInstruction={true} >
+      <Note note={info} isInstruction={true}>
         <TutorialLink
+          linkKey={triggerLinkKey}
+          linksMap={triggerTutorialLinks}
           style={{ marginTop: 0 }}
-          links={{
-            docLink: newFlow?.triggerDetail?.documentation_url || '',
-            youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
-          }}
         />
       </Note>
     </div>
@@ -279,9 +287,9 @@ const info = `<h4>${sprintf(
 )}</h4>
             <ul>
             <li>${__(
-  'Copy the <b>do action hook</b> snippet and paste it into your form submission function.',
-  'bit-integrations'
-)}</li>
+              'Copy the <b>do action hook</b> snippet and paste it into your form submission function.',
+              'bit-integrations'
+            )}</li>
               <li>${__('Click <b>Fetch</b>.', 'bit-integrations')}</li>
               <li>${__('Submit the form to send test data.', 'bit-integrations')}</li>
               <li>${__('Select the fields you need, then click <b>Set Action</b>.', 'bit-integrations')}</li>
diff --git a/frontend/src/components/Triggers/FormPlugin.jsx b/frontend/src/components/Triggers/FormPlugin.jsx
index f605b10ed..738884302 100644
--- a/frontend/src/components/Triggers/FormPlugin.jsx
+++ b/frontend/src/components/Triggers/FormPlugin.jsx
@@ -23,6 +23,15 @@ const FormPlugin = () => {
   const [isLoad, setIsLoad] = useState(false)
   const btcbi = useRecoilValue($appConfigState)
   const { isPro } = btcbi
+  const triggerLinkKey = newFlow?.triggered_entity
+  const triggerTutorialLinks = triggerLinkKey
+    ? {
+        [triggerLinkKey]: {
+          docLink: newFlow?.triggerDetail?.documentation_url || '',
+          youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
+        }
+      }
+    : undefined
 
   const { data, isLoading } = useFetch({
     payload: {},
@@ -148,19 +157,16 @@ const FormPlugin = () => {
 
               <Note note={info(newFlow)} isInstruction={true}>
                 <TutorialLink
+                  linkKey={triggerLinkKey}
+                  linksMap={triggerTutorialLinks}
                   style={{ marginTop: 0 }}
-                  links={{
-                    docLink: newFlow?.triggerDetail?.documentation_url || '',
-                    youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
-                  }}
                 />
               </Note>
             </>
           )}
         </div>
-      )
-      }
-    </div >
+      )}
+    </div>
   )
 }
 export default FormPlugin
@@ -175,7 +181,8 @@ const info = newFlow => `<h4>${sprintf(
               <li>${__('Choose the form or task you want to use.', 'bit-integrations')}</li>
               <li>${__('Click <b>Next</b> to <b>Go</b>.', 'bit-integrations')}</li>
             </ul>
-            ${newFlow?.triggerDetail?.note
-    ? `<h4>${__('Note', 'bit-integrations')}</h4>${newFlow?.triggerDetail?.note}`
-    : ''
-  }`
+            ${
+              newFlow?.triggerDetail?.note
+                ? `<h4>${__('Note', 'bit-integrations')}</h4>${newFlow?.triggerDetail?.note}`
+                : ''
+            }`
diff --git a/frontend/src/components/Triggers/Webhook.jsx b/frontend/src/components/Triggers/Webhook.jsx
index a594c68b2..cf2faae07 100644
--- a/frontend/src/components/Triggers/Webhook.jsx
+++ b/frontend/src/components/Triggers/Webhook.jsx
@@ -26,6 +26,15 @@ const Webhook = () => {
   const { api } = useRecoilValue($appConfigState)
   const [showResponse, setShowResponse] = useState(false)
   const intervalRef = useRef(null)
+  const triggerLinkKey = newFlow?.triggered_entity
+  const triggerTutorialLinks = triggerLinkKey
+    ? {
+        [triggerLinkKey]: {
+          docLink: newFlow?.triggerDetail?.documentation_url || '',
+          youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
+        }
+      }
+    : undefined
   let controller = new AbortController()
   const signal = controller.signal
   const setTriggerData = () => {
@@ -164,13 +173,11 @@ const Webhook = () => {
       </button>
       <div className="flx flx-center">
         <div style={{ width: '100%', maxWidth: 500 }}>
-          <Note note={info} isInstruction={true} maxWidth="100%" >
+          <Note note={info} isInstruction={true} maxWidth="100%">
             <TutorialLink
+              linkKey={triggerLinkKey}
+              linksMap={triggerTutorialLinks}
               style={{ marginTop: 0 }}
-              links={{
-                docLink: newFlow?.triggerDetail?.documentation_url || '',
-                youTubeLink: newFlow?.triggerDetail?.tutorial_url || ''
-              }}
             />
           </Note>
         </div>
@@ -190,20 +197,20 @@ const info = `${__(
             <h4>${__('Quick Setup', 'bit-integrations')}</h4>
             <ul>
                 <li>${__(
-  'Copy the Webhook URL and add it to your form or app.',
-  'bit-integrations'
-)}</li>
+                  'Copy the Webhook URL and add it to your form or app.',
+                  'bit-integrations'
+                )}</li>
                 <li>${__(
-  'Click <b>Fetch</b>, then submit your form (or send a test request).',
-  'bit-integrations'
-)}</li>
+                  'Click <b>Fetch</b>, then submit your form (or send a test request).',
+                  'bit-integrations'
+                )}</li>
                 <li>${__(
-  'When response data appears, click <b>Set Action</b> to continue.',
-  'bit-integrations'
-)}</li>
+                  'When response data appears, click <b>Set Action</b> to continue.',
+                  'bit-integrations'
+                )}</li>
             </ul>
             <p><b>${__('Important', 'bit-integrations')}:</b> ${__(
-  'The Fetch button will keep spinning until you submit the form/task.',
-  'bit-integrations'
-)}</p>
+              'The Fetch button will keep spinning until you submit the form/task.',
+              'bit-integrations'
+            )}</p>
   `
diff --git a/frontend/src/components/Utilities/TutorialLink.jsx b/frontend/src/components/Utilities/TutorialLink.jsx
index 6444f2e60..2a90718b9 100644
--- a/frontend/src/components/Utilities/TutorialLink.jsx
+++ b/frontend/src/components/Utilities/TutorialLink.jsx
@@ -8,6 +8,7 @@ import GrokIcn from '../../Icons/GrokIcn'
 import PerplexityIcn from '../../Icons/PerplexityIcn'
 import YoutubeIcn from '../../Icons/YoutubeIcn'
 import { __, sprintf } from '../../Utils/i18nwrap'
+import tutorialLinks from '../../Utils/StaticData/tutorialLinks'
 
 const aiTools = [
   {
@@ -42,7 +43,8 @@ const aiTools = [
   }
 ]
 
-function TutorialLink({ title, subtitle, links, style }) {
+function TutorialLink({ subtitle, linkKey, style, linksMap }) {
+  const links = linkKey ? linksMap?.[linkKey] || tutorialLinks?.[linkKey] || {} : {}
   const youTubeLink = links?.youTubeLink && links.youTubeLink !== '#' ? links.youTubeLink : undefined
   const docLink = links?.docLink && links.docLink !== '#' ? links.docLink : undefined
   const [showAiTools, setShowAiTools] = useState(false)
@@ -90,7 +92,7 @@ function TutorialLink({ title, subtitle, links, style }) {
   const encodedPrompt = encodeURIComponent(aiSummaryPrompt)
 
   return (
-    <div className='mb-1' style={style}>
+    <div className="mb-1" style={style}>
       {youTubeLink && (
         <span className="tutoriallink p-1 youtube">
           <YoutubeIcn size="19" className="mr-1" />
diff --git a/frontend/src/resource/img/integ/registration.webp b/frontend/src/resource/img/integ/registration.webp
index 5b83ee493..c16b919cf 100644
Binary files a/frontend/src/resource/img/integ/registration.webp and b/frontend/src/resource/img/integ/registration.webp differ
diff --git a/frontend/src/resource/img/integ/wordPress.webp b/frontend/src/resource/img/integ/wordPress.webp
new file mode 100644
index 000000000..5b83ee493
Binary files /dev/null and b/frontend/src/resource/img/integ/wordPress.webp differ