Html to Google Sheets


Many of you have been asking ‘ Can I create a Landing page with HTML and then save it in Google form ?’. Yes. One of the simplest ways is to use It provides 2 free HTML to Google Sheets integration. There are many benefits to creating a landing page. Among the benefits are,

  1. Leads generations
  2. Promotions
  3. Advertisements

Marketing Ideas
A landing page is a standalone web page designed to persuade visitors to take a specific action, such as signing up for a newsletter or making a purchase. Landing pages have become an essential component of online marketing campaigns because of their numerous benefits.

Here are some of the key benefits of using a landing page:

  1. Increased Conversions:
  2. Targeted Messaging:- User will be directed to download PDF, Discounts, Coupons and etc
  3. Improved SEO
  4. Better User Experience:
  5. Enhanced Analytics:

Steps to Integrate

Steps to Integrate HTML Landing Page to Google Form
Step 1: Create Google Sheet Form (Make sure you share the file with the public and ensure you place the title)
Step 2: Sign up at Link the google sheets to your account
Step 3: Get your endpoint

Look at the example for the Landing Page HTML

HTML Javascript

<!DOCTYPE html>
<html lang=”en”>
    <meta charset=”UTF-8″>
    <meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
    <link href=”” rel=”stylesheet” integrity=”sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ” crossorigin=”anonymous”>
    <script src=”” integrity=”sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe” crossorigin=”anonymous”></script>
    <link rel=”stylesheet” href=”style.css”>
    <title>Your Training landing Page</title>
    <form method=”post” id=”myform”  action=””>
    <div class=” mycontainer pt-3 text-white”>
        <P>You decide the KFC Fusion cuisine in June 2023</P>
          <div class=”mb-3″>
            <label for=”name” class=”form-label”>Name</label>
            <input type=”text” class=”form-control” id=”name” name=”data[name]” required>
          <div class=”mb-3″>
            <label for=”contact” class=”form-label”>Contact Number</label>
            <input type=”number” class=”form-control” id=”contact” name=”data[contact]” required>
          <div class=”form-check”>
            <input class=”form-check-input” type=”radio” name=data[food] id=”flexRadioDefault1″ value = ‘Rojak’>
            <label class=”form-check-label” for=”flexRadioDefault1″>
          <div class=”form-check”>
            <input class=”form-check-input” type=”radio” name=”data[food]” id=”flexRadioDefault2″ value=”Laksa”>
            <label class=”form-check-label” for=”flexRadioDefault2″>
          <div class=”form-check”>
            <input class=”form-check-input” type=”radio” name=”data[food]” id=”flexRadioDefault3″ value = ‘Hokkien Mee’>
            <label class=”form-check-label” for=”flexRadioDefault3″>
              Hokkien Mee
          <div class=”form-check”>
            <input class=”form-check-input” type=”radio” name=”data[food]” id=”flexRadioDefault4″ value=”Char Ho Fun”>
            <label class=”form-check-label” for=”flexRadioDefault4″>
             Char Ho Fun
         <button class = ‘btn btn-success’ type=”submit” id=”mybutton” >Submit</button>
    var form = document.getElementById(‘myform’);
    form.addEventListener(“submit”, e => {
      fetch(form.action, {
          method : “POST”,
          body: new FormData(document.getElementById(“myform”)),
          response => response.json()
      ).then((html) => {
        // you can put any JS code here
        window.location.href = ‘’;