Using gmail : Send email from Html + Spreadsheet as database
Tags: beginners, tutorial, css, javascript
Published: 2020-06-09 17:36:27

We needed a way of sending an email from a "static" HTML page when you don't (want to) have a server.

***Advantages:*** 
-No "Backend" to Deploy/Maintain/Pay for
-Fully Customisable - every aspect is customisable!
-Email sent via Google Mail which is Whitelisted Everywhere (high deliverability success)
-Collect/Store any form data in a Spreadsheet for easy viewing
(perfect if you need to share it with non-technical people)

Steps:
***STEP-1:*** Make a Copy of the Sample Spreadsheet
Sample: https://docs.google.com/spreadsheets/d/1Bn4m6iA_Xch1zzhNvo_6CoQWqOAgwwkOWJKC-phHx2Q/copy

![](https://user-images.githubusercontent.com/1406149/29245471-feb7b034-7f97-11e7-9c0d-f06238e8362b.png)
You will get a Spreadsheet like this:
![](https://cloud.githubusercontent.com/assets/194400/10559710/3aec92f0-74ef-11e5-9295-f1988a23257b.png)

***STEP-2:*** Open the Script Editor
Open the Script editor... by clicking "Tools" > "Script editor..."
![](https://cloud.githubusercontent.com/assets/194400/10559732/8db2b9f6-74ef-11e5-8bf2-de286f079929.png)

***STEP-3:*** Set the TO_ADDRESS in the Script
![](https://cloud.githubusercontent.com/assets/194400/10560379/9efa5b3a-7501-11e5-96ba-a9e3b2d77ee4.png)

***STEP-4:*** Save a New Version of your Script
![](https://cloud.githubusercontent.com/assets/194400/10558249/527f3c98-74c1-11e5-8290-5af7fa7f5f75.png)
![](https://cloud.githubusercontent.com/assets/194400/10558250/53d21d5e-74c1-11e5-88c5-7bc2d8ce6228.png)

***STEP-5:*** Publish the Updated Script as a Web App
![](https://cloud.githubusercontent.com/assets/194400/10558251/570a5428-74c1-11e5-8ced-5dd26d3de3c4.png)

***STEP-6:*** Authorize the Script to Send Emails
![](https://cloud.githubusercontent.com/assets/194400/10560412/89d3fb0c-7502-11e5-81ce-fb239bf545b2.png)

![](https://user-images.githubusercontent.com/1406149/44312495-79583780-a3b6-11e8-9740-8c9b50f195d6.png)
![](https://cloud.githubusercontent.com/assets/194400/10560416/a86a26ae-7502-11e5-9add-d5081d409af4.png)
![](https://cloud.githubusercontent.com/assets/194400/10558255/6eec31e2-74c1-11e5-9c07-cea6209526df.png)

***STEP-7:*** Create your basic HTML Form
![](https://user-images.githubusercontent.com/1406149/44312329-9b9c8600-a3b3-11e8-9816-4bdbbc96dc62.png)

***STEP-8:*** Open the HTML Form (page) in your Browser
![](https://cloud.githubusercontent.com/assets/194400/10560494/674b64c4-7504-11e5-801a-b537d276f671.png)

#***Part Two - Make It Look Good ...***
Okay we can add more like Submit the Form using JavaScript "AJAX", Adding a customised 'Thank You Message' Shown when Form Submitted or more css...
![](https://github-cloud.s3.amazonaws.com/assets/194400/10566392/f38bc454-75dd-11e5-85dd-6819494a98f2.png)

Please visit for more {% github dwyl/learn-to-send-email-via-google-script-html-no-server no-readme %}

I hope you people like the above article and learned something.
######***IMP REQUEST:***
###### You are most welcome to join my team [ form for joining ](https://forms.gle/pSCALuEWHus3pg9F6).
###### *Also you are most welcome to join OPEN SOURCE INTELLIGENT SYSTEM (OSINT) if you can help in open source project regarding safeguarding humans from various diseases like CORONA outbreak*
######https://github.com/Manishfoodtechs/OSINTHRH/wiki

Contact email: Manishfoodtechs@gmail.com. 

If you have any problem, our team is also engaged in professional consultancy and delivery.


![](https://media2.giphy.com/media/oNrPzIy3OhHm7zrvA3/source.gif)