How to send an email in a static HTML page using google sheets scripts?

Reading Time: 4 minutes

Introduction.

Sometimes you have a sample static websites created with HTML, CSS, and javascript and you may have a contact page on that website.

As you know a contact page will accept some fields from users like his Email, Name, message and then save them to the database. In your backend, you will have a page that can see that contact messages and reply to users from.

Or maybe you need to send an email from your website, but you don’t want to use any server side language like php,asp,node.js, or any other language. you want to send an email without even using any SMTP server.

In this article or small lecture, I will show you how to send an email to your static page using only javascript and google sheets service.

Step by Step Guide.

1. The first thing you have to do is to open the link below:

Google sheet Link

 

2.click on make a copy. You will see a spreadsheet on from of you as the following:

3. Rename the file if you want.

4.click on tools > script editor.

5. Go to line number 8, uncomment and send the target email you want to send to.

 

6. Now save the script then click on file > manage versions > write any description and click on save version.

 

7. Click on publish > Deploy as web app.

Make sure to select the project version( in your case must be one) but when you save a different version of the script, select the right one.

And leave the access to anyone, even anonymous.

Click update and if it asks for authenticating just click allow.

 

8.Copy the generated script (we will use this in our page)

 

9. Now download this test HTML contact page:

Simple mail HTML page

 

Open the file and go to this part:

Paste the script link you got from google sheets in step 8 in the action value.

10. Now open the file in the browser and test it, just fill the form and click send.

Check your inbox to see the magic!

Also, every email you send will be recorded in the online google sheet.

This is my results:

Gmail inbox:

Recorded emails:

 

Please if you have any question, feel free to leave it in the questions area.

 

This article is based on a GitHub tutorial, check it here.

3 thoughts on “How to send an email in a static HTML page using google sheets scripts?”

  1. Dear Sir,

    according to your instructions, I receive the following content on the website:

    {“result”:”success”,”data”:”{\”name\”:[\”sdfsaf\”],\”message\”:[\”fasdfasf\”],\”email\”:[\”asdfasf@fsaf.de\”]}”}

    Unfortunately, it does not open the Thank you messsage.

    Thanks in advance for your help

Leave a Comment

Your email address will not be published. Required fields are marked *