In CodeDesign, you can seamlessly integrate your form data with Google Sheets using Webhooks. This powerful feature allows you to automate the process of saving form submissions directly to a Google Sheet, making it easier to organize and manage your data. In this article, we will guide you through the steps to set up Webhooks integration and start saving your form data to a Google Sheet.
IMPORTANT NOTE : Prior to setting up the Webhooks integration to save form data to Google Sheets, ensure your form is already connected to the CodeDesign Database as per our previous article. Read 'Setting Up Forms with CodeDesign Database' and setup the CodeDesign Database with your form first.
Step 1: Accessing the Webhooks Tab
Open your project in CodeDesign.
Navigate to the Database Workspace.
Locate the 'Webhooks' tab in the workspace.
Step 2: Configuring Webhooks Integration in CodeDesign
In the 'Webhooks' tab, you will find three fields: 'Name', 'API Key', and 'Save Changes'.
Enter a name for your webhook activity in the 'Name' field.
Obtain the API key from the Google Sheets Integration.
Paste the API key into the 'API Key' field.
Click on the 'Save Changes' button to apply the settings.
Step 3: Setting Up Google Sheets Integration
Open your web browser and visit the following link: 'https://workspace.google.com/marketplace/app/webhooks_for_sheets/860288437469'.
Make sure you are signed in with your Google account.
Install the 'Webhooks for Sheet' Add-on from the Google Workspace Marketplace.
Open Google Sheets and create a new blank sheet.
Look for the Webhooks App icon in the side panel of the Sheets window. If you don't see the side panel, click on the small left arrow button on the bottom right part of the Sheet page.
Rename the sheet to your desired name.
Enable the 'Apps Script API' by clicking the button and sliding the option to 'On'.
Refresh the sheet page to apply the changes.
Click on the 'Create' button in the Webhooks App and authorize the Webhooks access when prompted.
Reload the sheet page and find the new custom menu labeled 'Webhooks' at the top of the page. Click on it and select 'Authorize' to grant the necessary permissions.
Once authorized, the page will display 'Running Script', and you will receive a pop-up saying 'Authorization Required'. Click on 'Continue', select your account, and allow access to Webhooks.
Go back to the side panel in Google Sheets, click on 'Next', and copy the Webhooks URL.
Step 4: Connecting Webhooks URL to CodeDesign
Return to CodeDesign and paste the copied Webhooks URL into the 'API' field in the CodeDesign Webhooks Integration.
Save the changes.
Congratulations! You have successfully set up Webhooks integration to save form data to Google Sheets using CodeDesign. From now on, every form submission will be automatically recorded in the designated Google Sheet, providing you with a convenient way to manage and analyze your data.