Blogger İletişim Formu Nasıl Yapılır? – Güncel Kod (2020)

Spread the love

Blogger eklentileri arasında en popüler olan ve insanların sizler ile iletişime geçmesini sağlayan Blogger İletişim Formunun nasıl yapılacağını bu konuda detaylı bir şekilde anlatacağız.

Blogger İletişim Formunu Nasıl Eklerim?

  • Öncelikle Blogger paneline giriş yapın. Yerleşim → Gadget Ekle → İletişim Formu yolunu izleyerek İletişim Formunu ekleyin ve Düzenlemeyi kaydet butonuna basın. (Önceden eklediyseniz bu adımı atlayın.)
  • Eklentinin görünürlüğünü kaldırmak için Tema → HTML’yi Düzenle yolunu izleyin. Kodların içerisine her hangi bir yere bir kere tıklayın, Ctrl + F yardımı ile </head> kapanış etiketini aratın ve aşağıdaki kodu etiketin hemen üzerine ekleyip Temayı kaydet butonuna basıp değişiklikleri kaydedin.

kod: <style type=’text/css’>
#ContactForm1,#ContactForm1 br{display:none}
</style>

  • Ardından Sayfalar → Yeni Sayfa yolunu izleyin ve aşağıda verilen iki kodu ard arda görselde gözüktüğü gibi sayfanın HTML bölümüne ekleyin.

KOD:

<form name=”contact-form”>
<div class=’formcolumn1′>
<input id=”ContactForm1_contact-form-name” name=”name” placeholder=’İsminiz’ size=”30″ type=”text” value=”” />
</div>
<div class=’formcolumn2′>
<input id=”ContactForm1_contact-form-email” name=”email” placeholder=’Eposta Adresiniz’ size=”30″ type=”text” value=”” />
</div>
<div class=’formcolumn3′>
<textarea cols=”25″ id=”ContactForm1_contact-form-email-message” name=”email-message” placeholder=’Mesajınız’ rows=”7″></textarea>
</div>
<div class=’formcolumn4′>
<input class=”ripplelink” id=”ContactForm1_contact-form-submit” type=”button” value=”Gönder” />
</div>
<div style=”max-width: 100%; text-align: center; width: 100%;”>
<div id=”ContactForm1_contact-form-error-message”>
</div>
<div id=”ContactForm1_contact-form-success-message”>
</div>
</div>
</form><style scoped=”” type=”text/css”>
#ContactForm1,#comments{display:none}
#ContactForm1_contact-form-name,#ContactForm1_contact-form-email{display:inline-block;width:100%;height:auto;margin:10px auto;padding:14px;background:#fff;color:#222;border:1px solid rgba(0,0,0,0.08)}
#ContactForm1_contact-form-email-message{font-family:’Roboto’;width:100%;height:250px;margin:10px auto;padding:14px;background:#fff;color:#222;border:1px solid rgba(0,0,0,0.08)}
#ContactForm1_contact-form-name:focus,#ContactForm1_contact-form-email:focus,#ContactForm1_contact-form-email-message:focus{background:#fff;outline:none;border-color:rgba(0,0,0,0.18)}
#ContactForm1_contact-form-submit{background:#fff;color:#5f6368;font-size:16px;width:161px;height:45px;float:left;padding:0 0 0 20px;margin:10px 0 3px 5px;cursor:pointer;border:none;border-radius:24px;box-shadow:0 1px 2px 0 rgba(60,64,67,0.302),0 1px 3px 1px rgba(60,64,67,0.149);transition:box-shadow .08s linear,min-width .15s cubic-bezier(0.4,0.0,0.2,1)}
.formcolumn4{position:relative}
.formcolumn4:before{background-image:url(https://2.bp.blogspot.com/-nkmaptT0VoA/WumFePAy9DI/AAAAAAAAGlM/8lA5aRi2E-okumpdikjQancIKDjYaGNqwCLcBGAs/s1600/mailme.png);background-position:center;background-repeat:no-repeat;background-size:20px;content:”;display:block;height:63px;width:32px;position:absolute;z-index:1;left:15px;top:0}
#ContactForm1_contact-form-submit:hover{background:#fafafb;box-shadow:0 1px 3px 0 rgba(60,64,67,0.302),0 4px 8px 3px rgba(60,64,67,0.149)}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{margin-top:35px}
form{color:#888}
.formcolumn1,.formcolumn2{float:left;width:50%}
.formcolumn1,.formcolumn2{margin:0 0 10px 0;padding:0 10px 0 0}
.formcolumn2{padding:0 0 0 10px}
@media only screen and (max-width:768px){.formcolumn1,.formcolumn2{width:100%;padding:0}}
</style>

<script src=”https://www.blogger.com/static/v1/widgets/2271878333-widgets.js” type=”text/javascript”></script>
<script type=”text/javascript”>
//<![CDATA[
if (typeof(BLOG_attachCsiOnload) != ‘undefined’ && BLOG_attachCsiOnload != null) { window[‘blogger_templates_experiment_id’] = “templatesV1″;window[‘blogger_blog_id’] = ‘8249729980980245035’;BLOG_attachCsiOnload(”); }_WidgetManager._Init(‘//www.blogger.com/rearrange?blogID\x3d8249729980980245035′,’//www.hiledebiz.com/’,’8249729980980245035′);
_WidgetManager._RegisterWidget(‘_ContactFormView’, new _WidgetInfo(‘ContactForm1’, ‘footer1’, null, document.getElementById(‘ContactForm1’), {‘contactFormMessageSendingMsg’: ‘Gönderiliyor…’, ‘contactFormMessageSentMsg’: ‘Mesajınız İletildi.’, ‘contactFormMessageNotSentMsg’: ‘Mesajınız İletilemedi. Lütfen Tekrar Deneyin.’, ‘contactFormInvalidEmailMsg’: ‘Bir Mail Adresi Eklemelisiniz.’, ‘contactFormEmptyMessageMsg’: ‘Lütfen Bir Mesaj Girin.’, ‘title’: ‘Contact Form’, ‘blogId’: ‘7342017194742683056’, ‘contactFormNameMsg’: ‘Name’, ‘contactFormEmailMsg’: ‘Email’, ‘contactFormMessageMsg’: ‘Message’, ‘contactFormSendMsg’: ‘Send’, ‘submitUrl’: ‘https://www.blogger.com/contact-form.do’}, ‘displayModeFull’));
//]]>
</script>

  • İkinci kod içerisinde 4 adet bulunan 8249729980980245035 kodunu kendi blog ID’niz ile www.hiledebiz.com linkini kendi blog linkiniz ile değiştin.
  • Sayfa ayarları bölümünden Seçenkler kısmında İzin verme, mevcut olanı gizleHTML’yi olduğu gibi gösterSatır sonları için ENTER tuşuna bas. seçeneklerini işaretleyin Tamamlandı butonuna basın ve Yayınla butonuna basıp sayfayı yayınlayın.
  • Not : Özel domain kullanıyorsanız alan adınzı başına www koyarak ekleyin. Eğer blogspot domain kullanıyorsanız www koymadan ekleyin.

İşte bu kadar basit. Emeğe saygı adına bir teşekkürü çok görmezseniz minnettar kalırım.

Add a Comment

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir