Create a Spreadsheets Importer on your Apps or Websites

by Adhaar Sharma on 2021-12-15

Creating a way for for users to upload spreadsheets on your website is a common use case in many applications and products

Using API Spreadsheets, this task can be done in minutes, rather than months!

In this tutorial, we will walk through how to create a button on your website that will let users upload Spreadsheets or CSV files.

You will then be able to view these files on your Google Drive & Dropbox accounts

Step 1
Create an Importer on Your API Spreadsheets Account


1. Log in to your API Spreadsheets Account and Click Import

go to import tab on API Spreadsheets



2. Click on Create a Customized Importer

Click on Create Your Own Import Configuration

Step 2
Customize Various Settings and Features for your Importer


If you don't customize any of these settings, no worries!. All files uploaded can always be accessed through your API Spreadsheets dashboard

1. Create a list of Columns

You can create a list of Columns (data model) for your importer

The column names that you specify under Internal Name will be matched with the column names from the uploaded spreadsheets

Create a list of Columns

You can also specify whether these columns should be required to match or not. And if they should be converted to a particular data type

NOTE: if the conversion to a data type fails, like for example, converting "ABC" to numerical, this will result in a NULL value in the data



2. Select destinations for the uploaded files

Connect and choose any external accounts you want the uploaded files to be saved to

NOTE: no matter what, all files can be accessed through your API Spreadsheets dashboard Select destinations for the uploaded files



3. Customize how the importer should look and behave

You can select things like color of the importer square, messages to show up when upload is successful, the file extensions allowed to be uploaded, etc.

Customize how the importer should look and behave



4. Set up any actions to be taken after file upload

You can set up things like a Webhook, or Email Alerts. These will take place after the file has been uploaded

Set up any actions to be taken after file upload



Step 3
Insert Pre-Written Code on your Website


1. Copy pre-written code from the importer page

Copy pre-written code from the importer page



2. Paste code on your website

The first three lines should go in your <head> tags. The <button> should go where you want the user to click to upload the files


3. Test Import Button

Click on the button and test it out. Clicking on the button will open a modal that will walk the user through the uploading process

NOTE: The importer does not have to be a button. It can be anything as long as it invokes the function importer.importFiles();

Test Import Button

Test Import Map Columns Button



Step 4
View Uploaded Spreadsheets


1. Go to your API Spreadsheets Files Dashboard

You can use the uploaded file as an API and do many other things with it

Imported File on Dashboard



2. Go to your external accounts that you set up in destinations

The uploaded file will be saved here

Imported File on Dashboard



There you go! If you have any questions about this, feel free to email us at admin@lovespreadsheets.com