BAYRAĞIM


Ey mavi göklerin beyaz ve kızıl süsü

Kızkardeşimin gelinliği, şehidimin son örtüsü.

Işık ışık, dalga dalga bayrağım,

Senin destanını okudum, senin destanını yazacağım.



Sana benim gözümle bakmayanın

Mezarını kazacağım.

Seni selamlamadan uçan kuşun

Yuvasını bozacağım.



Dalgalandığın yerde ne korku ne keder...

Gölgende bana da, bana da yer ver!

Sabah olmasın, günler doğmasın ne çıkar!

Yurda, ay-yıldızının ışığı yeter.



Savaş bizi karlı dağlara götürdüğü gün

Kızıllığında ısındık;

Dağlardan çöllere düşürdüğü gün

Gölgene sığındık.



Ey şimdi süzgün, rüzgarlarda dalgalı;

Barışın güvercini, savaşın kartalı...

Yüksek yerlerde açan çiçeğim;

Senin altında doğdum,

Senin dibinde öleceğim.


Tarihim, şerefim, şiirim, herşeyim;

Yer yüzünde yer beğen:

Nereye dikilmek istersen

Söyle seni oraya dikeyim!

 


 
   Bu yazımızda blogger'ın orjinal blogger iletişim formunu sabit sayfaya nasıl ekleyeceğimizi göstermeye çalışacağım. Böylece herkesin okuyucularıyla bağlantı kurmaları için bir iletişim sayfası olacak. Blogger bu eklentisini hizmete sunmadan önce kendimiz Google Dökümanları kullanarak iletişim formu oluşturmuştuk. Bu gadgetı sidebar yani blog sayfamızın yan kısımına eklemek oldukça basit. Fakat bunu sabit bir sayfaya eklemek için ek olarak işlemler yapmamız gerekiyor. Tüm blogger kullanıcıları için iletişim formu çok önemli bir yer almaktadır. Bu makalemde blogger iletişim formunu sabit sayfaya eklemeyi göstereceğim.Daha önce sitemizde yayınlamış olduğumuz İletişim altında ki kategoride ki diğer iletişim formlarını da deneyebilirsiniz.

Şimdi bu iletişim formlarına nasıl sahip olabiliriz adımlarla görelim;

1.ADIM

   Öncelikle Blog sitenizde iletişim gadgeti yoksa yapacak olduğumuz ilk işlem Yerleşim > Gadget ekle > Diğer Gadgetler > İletişim formu gadgetini seçin
2.ADIM

   İletişim formunun sidebarda olmasını istemediğimiz bu adımda formun gadget olarak görünmemesi için gerekli kod değişikliğini yapacağız. Blogger kumanda paneline girip Şablon > HTML’yi Düzenle yolunu takip ettikten sonra sonra Widget’a Atla > ContactForm1 diyerek iletişim formuna ait kodların olduğu bölüme gelin. Bu bölümdeki kodların sol tarafındaki ► ikonuna tıklayarak kodları genişletin. Genişletme işlemini yaptığınızda iletişim formu gadgetıne ait kodlar şu şekilde gözükecektir:
<b:widget id='ContactForm1' locked='false' title='İletişim Formu' type='ContactForm'>
    <b:includable id='main'>
<b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        <br/>
        <input class='contact-form-name' expr:id='data:widget.instanceId + &quot;_contact-form-name&quot;' name='name' size='30' type='text' value=''/>
        <p/>
        <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <input class='contact-form-email' expr:id='data:widget.instanceId + &quot;_contact-form-email&quot;' name='email' size='30' type='text' value=''/>
        <p/>
        <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + &quot;_contact-form-email-message&quot;' name='email-message' rows='5'/>
        <p/>
        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + &quot;_contact-form-submit&quot;' expr:value='data:contactFormSendMsg' type='button'/>
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>
  <b:include name='quickedit'/>
</b:includable>
  </b:widget>
Burada kırmızı renkle gösterdiğim kodların tamamını silerseniz blogunuz iletişim formunu algılayacak ancak sidebarda gadget olarak gözükmeyecek. Sonraki adım sabit bir iletişim sayfası oluşturarak iletişim formunu burada göstermek olacak.

3. ADIM

   Sıra sayfayı oluşturma geldi. Sayfalar > Yeni Sayfa > Boş Sayfa yolunu takip ederek yeni bir sayfa oluşturun ve sayfa başlığına İletişim yazın. Daha sonra sol üst taraftaki Oluştur / HTML sekmelerinde HTML sekmese geçerek aşağıdaki kodları buraya yapıştırın.
<div class='widget ContactForm' id='ContactForm1'>  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p>İsim<p>
        <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
        <p>E-Posta *</p>
        <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
        <p>Mesaj *</p>
        <textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
        <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Gönder'/>
        <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
        <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
      </form>
    </div>
  </div>
</div>
Ön izleme yaparak her hangi bir hata yoksa şablonu kaydedin ve kumanda paneline geri dönün.

4. ADIM

   Yukarıda verdiğim kod bloggerin standart orjinal iletişim formuydu. Sidebarınızdan alıp iletişim sayfanıza koyduk. Ama Eğer orjinalini beğenmiyorsanız, isterseniz aşağıda resimlerle gösterdiğim stillerden birini seçip iletişim sayfanıza direk onuda ekleyebilirsiniz.
<style type='text/css'>
#ContactForm1{display:none;}
#contact_wrap{width:321px;height:360px;border-radius:1em;border-top:1px solid #dbdbdb;border-right:1px solid #b2b2b2;border-left:1px solid #dbdbdb;border-bottom:1px solid #9d9d9d;background-color:#ccc;filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f2f2f2',endColorstr='#cccccc');background-image:linear-gradient(top,#f2f2f20%,#e6e6e650%,#cccccc100%);box-shadow:1px 1px 5px #ccc;margin:auto;padding:25px;}
#contact_wrap h3{color:#e8f3f9;font-family:"Microsoft Sans Serif",Georgia,arial;font-size:20px;font-weight:400;text-align:center;text-shadow:2px 0 0 #1f4962;-webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;-moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;background-color:#3689b9;position:relative;margin:0 -36px 20px;padding:12px;}
#contact_wrap h3:before{content:' ';position:absolute;bottom:-10px;left:0;width:0;height:0;border-color:#333 transparent transparent;border-style:solid;border-width:10px 0 0 10px;}
#contact_wrap h3:after{content:' ';position:absolute;bottom:-10px;right:0;width:0;height:0;border-color:transparent transparent transparent #333;border-style:solid;border-width:0 0 10px 10px;}
#ContactForm1_contact-form-name{width:270px;height:auto;background:#f6f6f6 url(http://2.bp.blogspot.com/-GoNmkIDybR0/UZuZDpVOXaI/AAAAAAAAEO8/pNPaQU1aiwQ/s1600/user.png)no-repeat 10px center;color:#777;border:1px solid #ccc;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;margin:5px auto;padding:10px 10px 10px 40px;}
#ContactForm1_contact-form-email{width:270px;height:auto;background:#f6f6f6 url(http://1.bp.blogspot.com/-QduNKpNbFyQ/UZuZPuE_OfI/AAAAAAAAEPU/Rv4C4Kic2I0/s1600/msg2.png)no-repeat 10px center;color:#777;border:1px solid #ccc;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;margin:5px auto;padding:10px 10px 10px 40px;}
#ContactForm1_contact-form-email-message{width:270px;height:150px;font-family:Arial, sans-serif;background:#f6f6f6 url(http://3.bp.blogspot.com/-zGxMJ_C5R60/UZuZGnKgcuI/AAAAAAAAEPE/KwPOHFuBffc/s1600/pen.png)no-repeat 10px 10px;color:#777;border:1px solid #ccc;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;box-shadow:rgba(0,0,0,0.247059) 0 1px 3px inset, #f5f5f5 0 1px 0;margin:5px auto;padding:10px 10px 10px 40px;}
#ContactForm1_contact-form-submit{width:95px;height:30px;float:right;color:#FFF;cursor:pointer;border-radius:4px;text-shadow:1px 0 0 #1f4962;-webkit-box-shadow:inset 0 0 35px rgba(0,0,0,0.3),0px 1px 5px #666;-moz-box-shadow:inset 0 0 35px rgba(0,0,0,0.3),0px 1px 5px #666;box-shadow:inset 0 0 35px rgba(0,0,0,0.3),0px 1px 5px #666;background-color:#3689b9;border:1px solid #194f6d;margin:10px 0;padding:0;}
#ContactForm1_contact-form-submit:hover{background:#4c9bc9;}
#ContactForm1_contact-form-error-message,#ContactForm1_contact-form-success-message{width:320px;margin-top:35px;}
</style>
<div id="contact_wrap">
<h3>İletişim</h3>
<form name="contact-form">
<input id="ContactForm1_contact-form-name" name="name" placeholder="İsim" size="30" type="text" value="" />
<input id="ContactForm1_contact-form-email" name="email" placeholder="E-Posta" size="30" type="text" value="" />
<textarea cols="25" id="ContactForm1_contact-form-email-message" name="email-message" placeholder="Mesaj" rows="5"></textarea>
<input id="ContactForm1_contact-form-submit" type="button" value="Gönder" />
<div style="max-width: 222px; text-align: center; width: 100%;">
<div id="ContactForm1_contact-form-error-message">
</div>
<div id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
</div>
<style type='text/css'>
.contact-form-widget{width:500px;max-width:100%;background:#E6E7E8;color:#000;border:1px solid #656E75;box-shadow:0 1px 4px rgba(0,0,0,0.25);border-radius:10px;margin:0 auto;padding:10px;}
.contact-form-name,.contact-form-email,.contact-form-email-message{width:100%;max-width:100%;margin-bottom:10px;}
.contact-form-button-submit{background:#E6E7E8;color:#000;width:20%;max-width:20%;margin:0;border:1px solid #656E75;}
.contact-form-button-submit:hover{background:#679EC9;color:#fff;border:1px solid #FAFAFA;}
</style>
<div class='widget ContactForm' id='ContactForm1'>  <div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<p>İsim<p>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<p>E-Posta *</p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<p>Mesaj *</p>
<textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Gönder'/>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</form>
</div>
</div>
</div>
<style type='text/css'>
.contact-form-widget{width:75%;max-width:100%;background:#5F8CB0;color:#fff;border:1px solid #5F8CB0;border-radius:1px;margin:0 auto;padding:10px;}
.contact-form-name,.contact-form-email,.contact-form-email-message{width:100%;max-width:100%;margin-bottom:10px;}
.contact-form-button-submit{height:40px;color:#5F8CB0;background:url(http://3.bp.blogspot.com/-U0t7gMWJOLs/U-uCm5Ye0bI/AAAAAAAAA_U/6TomQ9_Sgxw/s1600/send_message_40.png) #fff 5px center no-repeat;padding-left:44px;}
.contact-form-button-submit:hover{background:url(http://3.bp.blogspot.com/-U0t7gMWJOLs/U-uCm5Ye0bI/AAAAAAAAA_U/6TomQ9_Sgxw/s1600/send_message_40.png) #357AE8 5px center no-repeat;border:1px solid #404040;color:#FFF;border-color:#2F5BB7;}
</style>
<div class='widget ContactForm' id='ContactForm1'>  <div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<p>İsim<p>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
<p>E-Posta *</p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
<p>Mesaj *</p>
<textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Gönder'/>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</form>
</div>
</div>
</div>
<style type='text/css'>
.contact-form-widget{margin:0;width:75%;max-width:100%;padding:10px;}
.contact-form-name,.contact-form-email,.contact-form-email-message{max-width:220px;width:100%;font-weight:700;}
.contact-form-name{background:#FFF url(http://2.bp.blogspot.com/-bNZePDihTPU/UZ-lhWAHXqI/AAAAAAAAJuo/aSVVE_A6HpE/s320/name.png) no-repeat 7px 4px;background-color:#FFF;border:1px solid #ddd;box-sizing:border-box;color:#A0A0A0;display:inline-block;font-family:Arial,sans-serif;font-size:12px;font-weight:700;height:24px;vertical-align:top;margin:5px 0 0;padding:5px 15px 5px 28px;}
.contact-form-email{background:#FFF url(http://3.bp.blogspot.com/-Wf_IBW4cEts/UZ-li4SsnvI/AAAAAAAAJuw/qYAi9lghY1E/s320/email.png) no-repeat 7px 4px;background-color:#FFF;border:1px solid #ddd;box-sizing:border-box;color:#A0A0A0;display:inline-block;font-family:Arial,sans-serif;font-size:12px;font-weight:700;height:24px;vertical-align:top;margin:5px 0 0;padding:5px 15px 5px 28px;}
.contact-form-email:hover,.contact-form-name:hover{border:1px solid #bebebe;box-shadow:0 1px 2px rgba(5,95,255,.1);padding:5px 15px 5px 28px;}
.contact-form-email-message:hover{border:1px solid #bebebe;box-shadow:0 1px 2px rgba(5,95,255,.1);padding:10px;}
.contact-form-email-message{background:#FFF;background-color:#FFF;border:1px solid #ddd;box-sizing:border-box;color:#A0A0A0;display:inline-block;font-family:arial;font-size:12px;vertical-align:top;max-width:350px!important;height:150px;border-radius:4px;margin:5px 0 0;padding:10px;}
.contact-form-button{height:32px;line-height:28px;font-weight:700;border:none;zoom:1;display:inline;vertical-align:baseline;outline:none;cursor:pointer;text-align:center;text-decoration:none;font:14px/100% Arial, Helvetica, sans-serif;text-shadow:0 1px 1px rgba(0,0,0,.3);-webkit-border-radius:.5em;-moz-border-radius:.5em;border-radius:.5em;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);-moz-box-shadow:0 1px 2px rgba(0,0,0,.2);box-shadow:0 1px 2px rgba(0,0,0,.2);margin:0 2px;padding:.5em 2em .55em;}
.contact-form-button:hover{text-decoration:none;}
.contact-form-button:active{position:relative;top:1px;}
.MEF-button-color{color:#fef4e9;border:solid 1px #da7c0c;background:-webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));background: -moz-linear-gradient(top, #faa51a, #f47a20);;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a',endColorstr='#f47a20');}
.MEF-button-color:hover{background:-moz-linear-gradient(top, #f88e11, #f06015);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11',endColorstr='#f06015');border-color:#F47C20!important;}
</style>
<!--[if IE 9]>
<style type='text/css'>
.contact-form-name{background:#FFF url(http://2.bp.blogspot.com/-bNZePDihTPU/UZ-lhWAHXqI/AAAAAAAAJuo/aSVVE_A6HpE/s320/name.png) no-repeat 7px 0;}
.contact-form-email{background:#FFF url(http://3.bp.blogspot.com/-Wf_IBW4cEts/UZ-li4SsnvI/AAAAAAAAJuw/qYAi9lghY1E/s320/email.png) no-repeat 7px 6px;}
</style>
<![endif]-->  
<div class='widget ContactForm' id='ContactForm1'>  <div class='contact-form-widget'>
<div class='form'>
<form name='contact-form'>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' value="&#304;sim" size='30' type='text' onblur='if (this.value == &quot;&quot;) {this.value = &quot;&#304;sim&quot;;}' onfocus='if (this.value == &quot;&#304;sim&quot;) {this.value = &quot;&quot;;}' />
<p></p>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' value="E-Posta"  size='30' type='text' onblur='if (this.value == &quot;&quot;) {this.value = &quot;E-Posta&quot;;}' onfocus='if (this.value == &quot;E-Posta&quot;) {this.value = &quot;&quot;;}'/>
<p></p>
<textarea class='contact-form-email-message'  id='ContactForm1_contact-form-email-message' name='email-message'  value='Mesajınızı bırakın...'  onblur='if (this.value == &quot;&quot;) {this.value = &quot;Mesajınızı bırakın...&quot;;}' onfocus='if (this.value == &quot;Mesajınızı bırakın...&quot;) {this.value = &quot;&quot;;}'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit MEF-button-color' type='reset' value='Temizle'/> 
<input class='contact-form-button contact-form-button-submit MEF-button-color' id='ContactForm1_contact-form-submit' type='button' value='G&#246;nder'/>
<p></p>
<div style='text-align: center; max-width: 250px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>
</div>


Blogumuza Abone Olun
Yeni Yazılar E-posta Adresinize Gelsin
Not: Gelen Maili Aktif Etmeyi Unutmayınız!

Yorum Gönder Blogger

 
Top