1 Nisan 2012 Pazar

Blogger Yukar� ��k Butonu

Posted by Unknown On 14:09 No comments


Yukar� ��k Butonu 




Bug�n  yukar� ��k butonunun nas�l yap�ld���n�  ��reneceksiniz,  Blog i�eri�inizde �zel, blogunuzdaki ziyaret�iler i�in kullan�m� kolay. 




Yukar� ��k veya a�a�� in butonu gibi  ziyaret�ilerinizin  daha kolay gezinmelerini sa�lam�� olacaks�n�z.






1. 19 Farkl� Stiller ile Top D��meler G�r�nt�



Ad�m 1



Tamam, �imdi blogger hesab�na gidin ve Dashboard >> D�zen>> D�zenle html>> ve a�a��daki kodu bulabilirsiniz.


 ]]></ b: skin>
Ve bu kodu eklemeden �nce
 # Backtotop {
padding: 5px;

position: fixed;

bottom: 10px; sa�: 10px;

cursor: pointer;

}
Ad�m 2
�imdi a�a��daki kodu bulun.
</ body>
ve bir sonraki kodu eklemeden �nce.
<a href="#" id="backtotop"> <img src = " Resim URL "alt =" geri d�n "/></ a>  
Ama bu kodu �ablonunuza eklemeden �nce l�tfen a�a��daki favori d��mesini se�in k�rm�z�, kelimeleri de�i�tirmek G�r�nt� URL d��mesine url.
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2ONBU4Kr1y6BRjIsOHhaA3PBABKThuma9akSGW9J4VKN4boRjZWBO2DP80d2nTTSkH_ZdoSfAVw4rxGhFTQMOTjICyySQliAUv1DHqECsDQpP7aTcJWBe63Lc3cIuifi04v7OXNeE9aeC/s1600/bttp-5.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioZqRyTO960udkNSMDwxrAblwASTzHid1OUMsjiRyHBmMe3rQmZMn_6FyLgEOCZRPQMi1b0morOs8p9pIZzZXGuQtcw0lJj9wEfnVtbVoHGcYDqpP1PXJZUkAH7o8HXDr6CkvVuPLdDEub/s1600/bttp-4.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs2oQ1BlRq0oUNjxgWjviVYkYO1IhkMd1KjEwWjwYASntwX1XmhhxNCvGJl7EtTiThSgRjnUbQaeQwAh1XabYkuzmXZQ_DxXsLvFHlE5xAEH4XZ-80EN36vE7Qmki3ahUiPfPMPidXJ2rt/s1600/bttp-3.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_eLMQf2AOzpkUR0doNNrmex-1YTg3KwEsHhmXkOsOWMsol20rZOYtoKWAASJzDYMDqYg8gCYBeoI_auM-KT6FWX-LiR6TRFLzP6wyUIRBroO40mqkUX7CDYN0yHj22ZsmsBpPHYjbAX1k/s1600/bttp-1.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_r0zQ024IYLySG0NPR4dkFAjeXnYU_u836JnLZ4vD8mLDhgU3EKuT46s-uYthX-EMfHD1yGpHihnxL8Qp9sR1h5tFxXOF7h4vPUdqR_LHa6BMWExxsml0JaB0RTf0RRQJXp413REwYhgs/s1600/bttp-2.png
Blogger i�in en geri
http://4.bp.blogspot.com/_JwD5r652h00/SvDBBZGgr-I/AAAAAAAAAQg/1X96vgeWqaw/s400/bttp-6.png0/bttp-7.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnKSMdVz3xAdkGhJuC7wo1xc4D-4dyAAwRgPhwlKe-q8PwSWoJ8UbtSn36MppBSYXODaaLkizziliOMNEGc3Bd11sqlfGLXwnAM4ThjG2jIk01eJrEAeuglKh631aG6apmwepXSYogIIh9/s400/bttp-10.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe-XIvrZq_5dbVYGPypxqcYqXDrmixdWRX6K8pVkLWwtrqm2DORlzTjQwgjZFpP0SubouYQOQPglVhQfF3VnYxDmr0LTEOLuH9c2GcV4yrrzNwqgp_bvF-W106mhyxGnsqI-MWNnrrRvYx/s400/bttp-9.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_zgTJcoeBAUm7syjlD6Pb_a7qqawMma22-3KEHPOM8fhZcwD4x-bhp52UdMkNqMOBvs_dtYI_Qb9LJ5PjWqLpNNZBVMeR4prrcyv0ZHEOX5AQCVhl1grEyi9e0xFaVCAcvNfkJgxvIgM6/s400/bttp-8.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp-bUmR9SeEL2oVsLSigiC_ZkJcuHppcVF6ZoW9i1r0tV8ZKC0ICzeuvt52lxleQw548njLcMCkdj5XGtnvouwdj95EtBI0Vr3Xf047hRE7i9qGfccz_MI-EG58VePi8zq0-uxSpu_h9yz/
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2lNb9A_YHMVre2-GUQfyRd3mZHfj7TJcyWiU-ly8Er96KSv8KhK5SjszKAi6zmTlznmfm2UNcgfZM_9tS_JPizxaqgKVyIkbom1g_NOEu897vUcAYb6F6re9LrxVlFWbM6Sa8ZCVLr6mi/s400/bttp-11.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbedvwh65mgRNyIcN2Crgr_k1aGCdZuLn8Clk0yzsbrfNcMpSXx5rdplVf35h5ieI-A6cxF17YOkpgSR4HLGD2ghXVAPCHHYG8WkpFiR_jL-nvjVoDgRn2rsqd2tDb2B1ybo0dBHjVeSIs/s400/bttp-12.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrfaKGEpFLVZepMp4yGQ_wvyBBUG1Gkj3M-h8STipRJi99qCGxHDX4Aq0o3Z0J3mVbZmdx0hUSn7tnekXDdg7YbtrHOeKcQogcnBMLjTiZw-JxWSXvILItK0V3re8KJCdRuM1NJBU_6EmZ/s400/bttp-13.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZRTYCRfY_RMwHkaIUdeKtxcpW5Mjt51yomCOntXLUR6RtTx3rmzSBicheEgSRZkMNQF9SC5UZHyd-uNWstCkKQzlW0TgZMqMILgUkJQj8B24m8k0n5Ug4haLb9-cLqM2oXzrGaT5ToJlM/s400/bttp-14.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0Jbx9KpKtvjmqfvzFpfuxrPI4Wz40O1J9vcJfuWj59ZHTR88U0JO43pw_Nf49zG985CZvoVLeSYN4pIqADHm3Hx-hxxiFPKKZ7KAQqFrA0fCKJDALvFNn_u_3oV2ERhstl0ctY5T9TOa_/s400/bttp-15.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9XaMhR1I26JPmFUsEncHH0RuC3mF_p9lfTMfWzteWmq96J2hvG9aNJlXY7KYeVysKSKGc8EwKXFdQxms4HoWkUXzT3u-fIbNn0V6bt9AFhKrfhXhMAXwl_PqdoDMK9QNkdTdrsce_I7Tf/s1600/bttp-16.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU7xUQHvPFfED6XuMwToSTl2DZNiRkL8fpa5OcTAiBA9N3ey1zYxQDOV55Nx8YUquCslC8DHl34HSLXeOpfveOFqGMNqE9ImzQHrVxdKNViAyF0sMIG0r93ZztruZhHssFWkkKO10Djng1/s400/bttp-17.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilQCoNhq_u1jCeo15rxQM3naRu66tFzYBSA38BivLfEqZ8AD5Zm-etS2eky1mDyRnSGUwhG7fj1wu-Aayeh2PCayXUFI6RsjK_afizHRVIssX_CFQf74o4Y3wsu-_0zl6ESm8xPMak-_HQ/s400/bttp-19.png
Blogger i�in en geri
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy0IwfL3G5cv5j6rggDFep3AJHT-M_tdcZhgoJHNge0MKKM3x7G_EiQHzX2XKinuOEbskOjzHOYChktlWFnpE1q1PIKHPcYXrf33oWb0wH1KflGtyZSxAXwucPhj0kayyfW55w3o7meeAf/s400/20.png
De�i�tirilmesi sonra Resim-URL favori d��mesi url ile bu gibi g�r�n�yor
<a href="#" id="backtotop"><img src = " https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy0IwfL3G5cv5j6rggDFep3AJHT-M_tdcZhgoJHNge0MKKM3x7G_EiQHzX2XKinuOEbskOjzHOYChktlWFnpE1q1PIKHPcYXrf33oWb0wH1KflGtyZSxAXwucPhj0kayyfW55w3o7meeAf/s400/20.png "alt =" geri d�n "/></ a>
�ablon kodunuzu yap��t�r�n.
Ad�m 3
A�a��daki kodu bulun
<head>
Ve sonra bu kodu yap��t�r�n.
<Script src = ' http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js '
type = "text / javascript"> </ script>

<script language="javascript">

$ (Pencere). Ready (function () {

$ ('# Backtotop') {(function (e) t�klay�n

e.preventDefault ();

$ ('Html, body') animasyon ({scrollTop: 0}, 'Yava�');

});

});

</ Script>

ve sonra �ablonu Kaydet hepsi bu.
2. Yaz� Geri farkl� stilleri ve renkleri ile en iyi Link
Ad�m 1
Tamam, �imdi blogger hesab�na gidin ve Dashboard>> D�zen>> D�zenle html>> ve a�a��daki kodu bulabilirsiniz.
 ]]></ b: skin>
Ve bu kodu eklemeden �nce
# Backtotop {
geni�lik:
100 piksel / * De�i�im Kutusu Geni�li�i * /
background: #
F4FFBF ; / * De�i�im arka plan rengi * /
border:
1px solid # ccc ; / * S�n�r Stil * /
text-align: center;

padding: 5px;

position: fixed;

bottom: 10px; sa�: 10px;

cursor: pointer;

color: #
666 ; / * Metin rengini de�i�tir * /
text-decoration: none;

}
Ve blogunuza �ablonu ile uyum ve uyum sa�lamak i�in l�tfen bu �zelliklerini de�i�tirmek
De�i�im 100 kutunun boyutunu art�rmak veya azaltmak i�in daha d���k veya daha y�ksek bir say�.
De�i�im 1px s�n�r geni�li�ini de�i�tirmek i�in.
# ccc favori renk kodunu de�i�tirmek kenarl�k rengi i�in.
De�i�im F4FFBF favori arka plan renk kodu.
De�i�im 666 ; favori Metin renk kodu.
Not: Siz bizim arac�l���yla favori renk kodlar� burada yeni hex renk kodlar� jenerat�r
Ad�m 2
A�a��daki Kodu bulun:
</ body>
Ve �nce, a�a��daki kodu yap��t�r�n.
<a href="#" id="backtotop"> Ba�a d�n </ a>
D��me metni de�i�tirmek i�in, sadece de�i�tirmek i�in , akl�n�za ne gelirse
Ad�m 3
A�a��daki kodu bulun
<head>
Ve sonra bu kodu yap��t�r�n.
<Script src = ' http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js '
type = "text / javascript"> </ script>

<script language="javascript">

$ (Pencere). Ready (function () {

$ ('# Backtotop') {(function (e) t�klay�n

e.preventDefault ();

$ ('Html, body') animasyon ({scrollTop: 0}, 'Yava�');

});

});

</ Script>

ve sonra �ablonu Kaydet kaydet.

0 yorum:

Yorum Gönder