Blogger İletişim Sayfası Kodları/Eklentisi

Blogger İletişim Sayfası Kodları

Blogger İletişim Sayfası/Formu Neden Lazım?

Her blogta/sitede kullanıcılarınızın sizinle iletişime geçmesi için bir iletişim formu yada iletişim sayfası olması lazım aşağıdaki verdiğim kodları kullanarak sizde kendi iletişim sayfanızı yapabilirsiniz.

Blogger İletişim Sayfası/Formu Nasıl Eklenir?

1-Blogger panelinde sol menüde ki Tema kısmına girin 2-Sayfanın ortasında ki HTML’i düzenle kısmına tıklayın 3-Kodların olduğu herhangi bir yere tıklayın ve CTRL+F tuş kombinasyonu yardımıyla arama kutusunu açın 4- ]]></b:skin> kodunu aratıp bir satır üzerine aşağıda ki kodu ekleyin.
#ContactForm1 {
    display: none;
}

#ContactForm1_contact-form-name, #ContactForm1_contact-form-email {
    width: 300px;
    height: auto;
    margin: 10px auto;
    padding: 10px;
    background: #fdfdfd;
    color: #666;
    border: 1px dashed #ddd;
    transition: all 0.5s ease-in-out;
}

#ContactForm1_contact-form-email-message {
    width: 450px;
    height: 175px;
    margin: 10px auto;
    padding: 10px;
    background: #fdfdfd;
    color: #666;
    font-family: 'Roboto',sans-serif;
    border: 1px dashed #ddd;
    transition: all 0.5s ease-in-out;
}

#ContactForm1_contact-form-name:focus, #ContactForm1_contact-form-email:focus, #ContactForm1_contact-form-email-message:focus {
    background: #fff;
    outline: none;
    border: 1px dashed #f8a82a;
}

#ContactForm1_contact-form-submit {
    font-family: 'Roboto';
    font-size: 15px;
    width: 101px;
    height: 35px;
    float: left;
    color: #fff;
    padding: 0;
    margin: 10px 0 3px 0;
    cursor: pointer;
    background: #aaa;
    border: none;
    border-radius: 2px;
    transition: background 0.4s linear;
}

#ContactForm1_contact-form-submit:hover {
    background: #f8a82a;
}

#ContactForm1_contact-form-error-message, #ContactForm1_contact-form-success-message {
    width: 450px;
    margin-top: 35px;
}
5-Kodların olduğu herhangi bir yere tıklayın ve CTRL+F tuş kombinasyonu yardımıyla arama kutusunu açın 6- <head> kodunu aratıp bir satır altına aşağıda ki kodu ekleyin.
<link href = '// netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel = "stylesheet" />
7-Sol menüden sayfalar kısmına girin 8-Yeni sayfa ekle kısmına tıklayın 9-Sayfanıza başlık ekleyin 10-Sol köşeden HTML yazan yere tıklayın 11-Aşağıda ki kodları yapıştırın
<form name="contact-form">
<div style="text-align: center;">
<span style="font-family: &quot;helvetica neue&quot; , &quot;arial&quot; , &quot;helvetica&quot; , sans-serif;"><i class="fa fa-user"></i>&nbsp; İsim&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </span>&nbsp;<input id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" /></div>
<div style="text-align: center;">
&nbsp; &nbsp; &nbsp;<span style="font-family: &quot;helvetica neue&quot; , &quot;arial&quot; , &quot;helvetica&quot; , sans-serif;"><i class="fa fa-envelope"></i>Email Adresi<span style="color: red; font-weight: bolder;">*</span></span> 
<input id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" /></div>
<div style="text-align: center;">
&nbsp;&nbsp;<span style="font-family: &quot;helvetica neue&quot; , &quot;arial&quot; , &quot;helvetica&quot; , sans-serif;">Mesajınız<span style="color: red; font-weight: bolder;">*</span></span>
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea></div>
<div style="text-align: center;">
&nbsp;
<input id="ContactForm1_contact-form-submit" type="button" value="Gönder" style="float: inherit" /></div>
</form>
  12-Sağ üstten Yayınla yazan yere tıklayıp sayfanızı yayınlayın iletişim formunuz hayırlı olsun :)