How to add a contact page for blogger?

Contact pages are very useful in today's world. Your portfolio contains a separate contact us page. Even your blog should have it so that during the times of necessities, the correspondent sender can contact you with the help of page.

I am not going to take it further but elsewise provide you the necessary code in order to make a sleek contact us page. We are going to take help of a site called as 100forms.

<div class='cFormL'>
   <div class='cFormB'>
      <div class='cFormM'>Get ourselves in contact?</div>
      <div class='cFormSvg'></div>
   </div>
</div>
<div class='cFormR'>
   <div class='cFormB'>
      <div class='ContactForm' id='ContactForm1'>
         <form name='cForm' method='post' action='//submit.form' onsubmit='return validateForm()'>
            <div style='margin-right: 1%; margin-left:0'>First name<span style='color: red'> *</span><br />
               <input type='text' id='data_1' name='data_1' class='form-control'>
            </div>
            <p>
               Last name:<span style='color: red'> *</span><br />
               <input type='text' id='data_2' name='data_2' class='form-control'><br />
               Email:<span style='color: red'> *</span><br />
               <input type='text' id='data_3' name='data_3' class='form-control'><br />
               Country:<span style='color: red'> *</span><br />
               <select id='data_4' name='data_4' style='max-width : 450px' class='form-control'></select><br />
               Message:<br />
               <textarea id='data_6' false='' name='data_6' style='max-width : 450px; margin-bottom:20px' rows='6' class='form-control'></textarea>
               <br />
               <input name='skip_Submit' value='Submit' type='submit'><br />
               <a href='https://www.100forms.com' id='lnk100' title='form to email'>form to email</a><br />
               <!--[If possess own cdn, replace the link with your own cdn. Checked: 07/14/23 1:46:07 IST] -->
               <script type='text/javascript' src='http://sr7themes.rf.gd/wp-admin/js/contactform.js'></script>
         </form>
      </div>
   </div>
</div>

As prescribed, replace sr7themes.rf.gd with your own cdn such as githubusercontent.com, statically.io, jsdelivr.com if you want. Hopefully it helps you. Keeping it into your /root/js/directory is suggested.

Warning!Changing the cdn and modifying the js is a must if you want to get the emails right in your inbox.

var emailLink = "";
document.write(emailLink);
function isEmpty() { return (a.length === 0 || !a.trim()) }
function validateEmail(a) {
              var b = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,15}(?:\.[a-z]{2})?)$/i;
              return isEmpty(a) || b.test(a)
          }

function validateForm() {
              if (isEmpty(document.getElementById('data_1').value.trim())) {
                  alert('First name is required!');
                  return false
              }
              if (isEmpty(document.getElementById('data_2').value.trim())) {
                  alert('Last name is required!');
                  return false
              }
              if (isEmpty(document.getElementById('data_3').value.trim())) {
                  alert('Email is required!');
                  return false
              }
              if (!validateEmail(document.getElementById('data_3').value.trim())) {
                  alert('Email must be a valid email address!');
                  return false
              }
              return true
          }

This should be the content of the JS file uploaded in different cdns to fetch. Now, your contact form is ready !