Cara Buat Halaman Kontak Plus UI V3.0

Halo pagi sobat kembali lagi dengan saya yang  dimana hari ini saya akan membagikan sebuah tutorial Cara Buat Halaman Kontak Plus UI V3.0
yang dimana ketika kita download template Plus Ui v3 ini bukan yang resminya kita hanya kamu mendapatkan template nya saja.

Cara Buat Halaman Kontak Plus UI V3.0

<p>Got a question? We'd love to hear from you. Send us a message and we'll respond as soon as possible.</p>
<!--[ Blogger contact form ]-->
<form class='blogger-contact-form'>
  <div class='inF'>
    <input type='text' name='name' id='cf-a-name' placeholder=' '/>
    <label for='cf-a-name'>Name</label>
  </div>
  <div class='inF' data-message='A valid email address is required.'>
    <input type='email' name='email' id='cf-a-email' placeholder=' ' required=''/>
    <label for='cf-a-email'>Email</label>
  </div>
  <div class='inF' data-message='Message field cannot be empty.'>
    <textarea name='message' id='cf-a-message' placeholder=' ' required=''></textarea>
    <label for='cf-a-message'>Message</label>
  </div>
  <button id='cf-a-submit' class='ciB' type='submit'>Submit</button>
  <button id='cf-a-reset' class='ciB' type='reset'>Reset</button>
</form>

<script src='https://www.blogger.com/static/v1/widgets/2271878333-widgets.js'></script>
<script>
  /*<![CDATA[*/
  /* Contact Form Settings */
  var contactSettings = {
    'domain':https://matericodingan.blogspot.com,
    'blogId':7003328061781991879,
    'contactFormMessageSendingMsg': '<span>Sending...</span>',
    'contactFormMessageSentMsg': '<span><i class="check"></i>Your message has been sent.</span>',
    'contactFormMessageNotSentMsg': '<span>Message could not be sent. Please try again later.</span>',
    'contactFormInvalidEmailMsg': '<span><i class="warn"></i>A valid email address is required.</span>',
    'contactFormEmptyMessageMsg': '<span><i class="warn"></i>Message field cannot be empty.</span>',
    'title': 'Contact Form',
    'contactFormNameMsg': 'Name',
    'contactFormEmailMsg': 'Email',
    'contactFormMessageMsg': 'Message',
    'contactFormSendMsg': 'Send',
    'submitUrl': 'https://www.blogger.com/contact-form.do'
  };

  if (typeof(BLOG_attachCsiOnload) != 'undefined' && BLOG_attachCsiOnload != null) {
    window['blogger_templates_experiment_id'] = "templatesV1";
    window['blogger_blog_id'] = contactSettings['blogId'];
    BLOG_attachCsiOnload('');
  }
  _WidgetManager._Init('//www.blogger.com/rearrange?blogID\\' + contactSettings['blogId'], contactSettings['domain'], contactSettings['blogId']);
  _WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'footer1', null, getid('ContactForm1'), contactSettings, 'displayModeFull'));
  var inputs = qSell('.widget input[type=text], .widget input[type=email], .widget textarea');
  for (var i = 0; i < inputs.length; i++) {
    var input = inputs[i];
    input.addEventListener('input', function() {
      var bg = this.value ? 'fl' : 'nfl';
      this.setAttribute('data-text', bg);
    });
  }
  /*]]>*/
</script>

Penutupan