HTML etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
HTML etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

6.05.2017

Inputla Oluşturulmuş Formlarda Kenarlık(Border) Kaldırma


Chrome ve Opera gibi tarayıcılarda arama formları ve iletişim formları gibi alanlarda sizin border oluşturmamanıza rağmen bir kenarlık gözükür bu kenarlığı kaldırmanın yolu basit bir css kodu, bu kodu stil dosyanıza ekledikten sonra o kenarlıkların (borderların) kalktığını göreceksiniz.  
input:focus, textarea:focus, select:focus{ outline: none;}
Bu kodu stil dosyanıza ekleyerek sorunu halledebilirsiniz. Kolay gelsin.
Devamı

3.05.2017

Blogger Sayılı Pagenavi Oluşturmak - Sayılı Navigasyon


Bloggerların çoğunun şikayetçi olduğu şey anasayfanın en alt kısmındaki Pagenavi kısmıdır, yani sayfa navigasyonu, sayfalar arasında geçiş yapan kısım. Bu kısım blogspot sitelerde, önceki yazılar ve sonraki yazılar şeklindedir. Oysa ki çoğu kişi bu kısmı sayılı bir şekilde göstermek ister. İşte bu yapacağınız işlemler istediğiniz sayılı navigasyonu(pagenaviyi) oluşturacaktır. Şunu belirmek istiyorum ki bu işlemleri yapmadan önce şablonunuzun yedeğini alın, sadece bu işlem için değil herhangi bir işlem yaparken özellikle kodlamalarda yapılacak değişiklikten önce mutlaka Blogger Şablonunuzun yedeğini alın. Bloggerlar için hazırladığım Türkçeleştirilmiş Blogger Temalarına da göz atmanızı öneririm.   öncelikle;

]]></b:skin>

kodunu buluyoruz aşağıdaki kodları bu kodun üst kısmına yapıştırıyoruz. ( Copy + Paste)

/* Sayfa Navigasyonu */

.pagenavi{clear:both;margin:10px auto;text-align:center}
.pagenavi span,.pagenavi a{padding:3px;margin-right:5px;background:#fff;border:1px solid #c20c0c}
.pagenavi a:visited{color:#c20c0c}
.pagenavi a:hover,.pagenavi .current{background:#c20c0c;color:#fff;text-decoration:none}
.pagenavi .pages,.pagenavi .current{font-weight:bold}
.pagenavi .pages{border:none}

Daha sonra, kaynakta şu kodu aratıyorsunuz.

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>

bulduğunuz bu kodu silmeyin hemen altına aşağıdaki kodları ekleyin.

<b:includable id='page-navi'>
<div class="pagenavi">
<script type="text/javascript">
var pageNaviConf = {
perPage: 5,
numPages: 9,
firstText: "First",
lastText: "Last",
nextText: "Next",
prevText: "Prev"
}
</script>
<script type="text/javascript" src="https://raw.githubusercontent.com/halituzan/halituzan-com/master/sayilipagenavi.js"></script>
<div class="clear" />
</div>
</b:includable>

Bu eklediğiniz kodlarda değişiklik yaparak navigasyonunuzu Türkçeleştirebilirsiniz. Daha sonra da kaynakta aşağıdaki kodu aratın.

<b:include name='nextprev'/>

Aratıp bulduğunuz bu kodu silin ve yerine aşağıdaki kodları yapıştırın.

<b:if cond='data:blog.pageType == "index"'>
<b:include name='page-navi' />
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<b:include name='page-navi' />
</b:if>
</b:if>

Eğer bu aşamadaki kod dizimini bulamadıysanız şunu aratın. (bu işlemi yapmak zorunda değilsiniz eğer bu aşamadaki kod dizimi olan <b:include name='nextprev'/> bulamadıysanız bunu yapacaksınız.)

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'>
...
<b:includable id='main' var='top'>
...
</b:includable>
</b:widget>
</b:section>

bulduğunuz bu kodda  </b:includable> un hemen üstüne şu kodu yapıştırın.

<b:if cond='data:blog.pageType == "index"'>
<b:include name='page-navi' />
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<b:include name='page-navi' />
</b:if>
</b:if>

Şu an için eksik bir şey yapmadıysanız Sayılı Pagenavi (Önceki ve Sonraki Yazılar) kısmınız hazır demektir. Navigasyonun renk ayarlamalarını Css kodlarıyla oynayarak değiştirebilirsiniz. Yapmış olduğunuz bu işlemlerle sayfalarınız çok şık bir görünüme kavuşmuş olacaktır. Yorumlarınızı eksik etmeyin. Herkese iyi bloglamalar.
Devamı

Html, Php Sayfalara .Swf Dosyasi Gomme Yontemi


Swf kültürünün iyice artması sebebiyle swf'lerimizi sitelerimize gömme isteği de ortaya çıktı. Html sayfalarda kullanabileceğiniz iki kod mevcut biri basit bir kod dizimi diğeri ise biraz daha detaylı sistem, iki sistem de sizin işinizi görecektir.

  İlk kod basit olan kod : 


<embed height="270" src="http://sitenizinadi.com/flashiniz.swf" width="530"></embed> 

Daha kapsamlı olan kod :

<object id="flaşım" width="180" height="180" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase=";http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="movie" value="flashiniz.swf" /><param name="quality" value="high" /><param name="wmode" value="transparent" /><embed src="SWF NİN BULUNDUĞU ADRES" quality="high" wmode="transparent" width="700" height="400" name="benim flashım" align="" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /></object>

kırmızı yazılı olanlardan SWF NİN BULUNDUĞU ADRES yazan yere swf adresini yazın. Width(Genişlik) ile Height (Yükseklik) Swf nizin sayfadaki boyutunu belirler sayfanıza göre de bunları değiştirerek ayarlama yapabilirsiniz bu kodun örnek olarak nasıl çalıştığını görmek için Şu Linke tıklayabilirsiniz
Devamı