Size Kazançlı Bir Teklifim Var

Bugüne kadar blog yazarlarının kendilerini ve bloglarını geliştirmelerine yönelik pek çok faydalı yazı yazdım.Şimdi de uzun süredir bünyesinde oluğum ve size her bakımdan çok şey kazandıracak Bumerang Network’ten bahsedeceğim.

 

Bumerang Nedir?

 

Bumerang; Hürriyet’in blog yazarları için oluşturduğu, blogcuların trafik ve para kazanmasını sağlayan bir projedir.Bumerang’a katılmanın size sunduğu avantajlar şunlardır:

• Aylık 500bin’den fazla ziyaretçisi olan Yazar Kafe’de yazılarınızı yayınlayabilirsiniz.
• Hurriyet.com.tr’de blogunuzun tanıtımını yapma fırsatı yakalayabilirsiniz.
• Hurriyet’in dizini olan Hurlist’e blogunuzu ekleyebilirsiniz.
• Sponsor firmaların reklamlarını yayınlayarak para kazanabilirsiniz.

 

Hemen Üye Ol, 20 TL Kazan!

 

Bumerang İkili Kazanç Sistemi isminde bir kampanya başlattı.Bu kampanya sayesinde başlangıcı 20 TL ile yapabilirsiniz.Nasıl mı?

 

1. Adım: Bumerang üyelik sayfasına gidin.

 

2. Adım: Bumerang üyelik ekranında promosyon kodu bölümüne T1DD5604 yazın.

 

 

3. Adım: Eğer promosyon kodunu doğru girdiyseniz kısa bir süre sonra yayınlamanız için bir teklif gelecek ve o teklifi başarılı bi şekilde yayınladığınız taktirde 20 TL hesabınıza aktarılacak.

 

Peki Ya Sonra?

Bundan sonra Bumerang Network’un nimetlerinden faydalanmaya devam edeceksiniz.Bumerang skorunuzu arttırarak tekliflerden daha çok kazanabilir, platin üye olarak Yazar Kafe’ye yazılarınızı gönderebilir, sosyal medya paylaşımları yaparak çeşitli hediyeler kazanabilirsiniz.

Güncelleme

Toplam 5 kişinin bu tekliften yararlanma şansı vardı ve kota doldu. Bilginize…

Jquery İle Sayfa Üstüne Sabit Açılır Menü Ekleme

Jquery sayesinde web sitelerine görsel açıdan oldukça zengin öğeler eklemek mümün oluyor.Daha önce jquery ile oluşturulmuş dikey bir menü paylaşmıştım.Bu yazıda ise onun yatay versiyonu diyebileceğim bir menü paylaşacağım.

 

 

Dikey versiyonunda olduğu gibi yatay versiyonuna da ikonlardan faydalanıyoruz.Sayfa açıldığında smenünün sadece yazılı bölümü gözüküyor.Üzerine gelindiğinde ise aşağı doğru açılarak ikon gözüküyor.Aşağıdaki video daha net anlatacaktır.

 

 

Bu menüyü blogunuza eklemek isterseniz şablonunuzdan </body> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<div class='clear'/>
<style>
ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 0px;
list-style: none;
z-index:999999;
width:721px;
}
ul#navigation li {
width: 103px;
display:inline;
float:left;
border:0;
}
ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#eeeeee;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
text-decoration:none;
text-align:center;
padding-top:80px;
opacity: 0.96;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
ul#navigation li a:hover{
background-color:#CAE3F2;
}
ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#60ACD8;
font-family:trebuchet-ms, arial, tahoma, Sans-Serif;
font-weight:bold;
text-shadow: 0 -1px 1px #fff;
}
ul#navigation .anasayfa a {
background-image: url(http://icons.iconarchive.com/icons/delacro/once/48/Home-icon.png);
}
ul#navigation .hakkimda a {
background-image: url(http://icons.iconarchive.com/icons/delacro/once/48/Friends-icon.png);
}
ul#navigation .takipet a {
background-image: url(http://icons.iconarchive.com/icons/delacro/once/48/Link-icon.png);
}
ul#navigation .arsiv a{
background-image: url(http://icons.iconarchive.com/icons/delacro/once/48/Search-icon.png);
}
ul#navigation .iletisim a {
background-image: url(http://icons.iconarchive.com/icons/delacro/once/48/Mail-icon.png);
}
</style>
<script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'>
</script>
<script type='text/javascript'>
$(function() {
var d=300;
$(&#39;#navigation a&#39;).each(function(){
$(this).stop().animate({
&#39;marginTop&#39;:&#39;-80px&#39;
},d+=150);
});
$(&#39;#navigation &gt; li&#39;).hover(
function () {
$(&#39;a&#39;,$(this)).stop().animate({
&#39;marginTop&#39;:&#39;-2px&#39;
},200);
},
function () {
$(&#39;a&#39;,$(this)).stop().animate({
&#39;marginTop&#39;:&#39;-80px&#39;
},200);
}
);
});
</script>
<ul id='navigation'>
<li class='anasayfa'><a href='http://bloghocam.blogspot.com'>Ana Sayfa</a></li>
<li class='hakkimda'><a href='http://bloghocam.blogspot.com/p/hakkmda.html'>Hakkımda</a></li>
<li class='takipet'><a href='http://bloghocam.blogspot.com/p/takip-et.html'>Takip Et</a></li>
<li class='arsiv'><a href='http://bloghocam.blogspot.com/p/arsiv.html'>Arşiv</a></li>
<li class='iletisim'><a href='http://bloghocam.blogspot.com/p/iletisim.html'>İletişim</a></li></ul>

 

İsterseniz .png uzantılı ikonların yerine kendi ikonlarınızı kullanabilirsiniz.Menüde kendi sayfalarıma link verdim.Kodlarda benim bloguumua ait adreslerin yerine kendi sayfalarınıza ait adresleri yazın.

LÖSEV Gönüllüsü Olmak Bir Ayrıcalıktır...

Büyük LÖSEV Ailesi, lösemili&kanserli çocuk ve ailelerin bu zorlu mücadelede yalnız olmadıklarını göstermek için sevgi ve azimle çalışan bir vakıftır. LÖSEV kurulduğu 1998 yılından bugüne dek faaliyetlerini duyarlı kişi ve kuruluşların destekleri ve binlerce GÖNÜLLÜSÜ’nün katkılarıyla gerçekleştirmiş; Türk halkının konu hakkında daha bilinçli ve duyarlı olmasıyla beraber tedavide %91'lere çıkardığı başarısını %100’e çıkartmayı hedeflemiştir.

 

LÖSEV'e gönlünü veren gönüllüler LÖSEV’in her etkinliğinde aktif rol almakta, vakıf çalışmalarına aktif katılım göstererek çocukları hayata bağlamaktadırlar.

 

Yüreğinde paylaşım ve sevgiye yer olan herkesi Lösev gönüllüsü olmaya davet ediyoruz.

 

Lösev gönüllüsü olabilmek için aşağıdaki formu doldurmanız yeterli: http://bit.ly/losevgonullusu
Lösev’i Facebook’ta takip etmek için: www.facebook.com/losev0660
Lösev’i Twitter’da da @losev1998 hesabından takip edebilir, #LosevHayatVerir hashtag’i ile  paylaşımlarınızla destekleyebilirsiniz.

 

Bir bumads sosyal sorumluluk içeriğidir.

3 Farklı Etiket Bulutu Stili

Blogunuzda ister etiketleme, ister kategorileme sistemini kullanın kenar çubuğuna bunu eklemeniz ziyaretçilerin blogunuzda okumak istediği şeyleri okumasına yarar. Ziyaretçileriniz sayfalar arasında geçiş yaparak ilgisini çeken içeriği aramak yerine ilgilendiği konudaki etiket ismine tıklayarak o konudaki yazılara hızlı bir şekilde ulaşabilir.

 

Etiket listelerinin veya etiket bulutlarının kötü yanı ise tasarım olarak zayıf kalmaları ve çoğu zaman blog temasına uyum göstermemeleri.Bunun için daha önce flash animasyonlu etiket bulutu eklemeyi anltamıştım.Şimdi internette denk geldiğim ve paylaşmak istediğim bu 3 farklı stil ile etiket bulutunu daha görsel bir hale getireceğiz.

 

Öncelikle blogunuza Etiketler gadgetını ekleyin ve görüntüleme seçeneği olarak bulutu işaretleyin.Nasıl yapacağınızı bilmiyorsanız daha önce yazdığım etiket bulutu ekleme yazıma bakabilirsiniz.

 

İkinci olarak şablonunuzda ]]></b:skin> kodunu bulun ve kullanmak istediğiniz stilin altındaki kodları ]]></b:skin> kodunun hemen üstüne ekleyin.

 

Stil 1

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

.label-size{
margin:0;
padding:0;
position:relative;
}
.label-size a{
float:left;
height:24px;
line-height:24px;
position:relative;
font-size:12px;
margin-bottom: 9px;
margin-left:20px;
padding:0 10px 0 12px;
background:#0089e0;
color:#fff;
text-decoration:none;
-moz-border-radius-bottomright:4px;
-webkit-border-bottom-right-radius:4px;
border-bottom-right-radius:4px;
-moz-border-radius-topright:4px;
-webkit-border-top-right-radius:4px;
border-top-right-radius:4px;
}
.label-size a:before{
content:"";
float:left;
position:absolute;
top:0;
left:-12px;
width:0;
height:0;
border-color:transparent #0089e0 transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0; 
}
.label-size a:after{
content:"";
position:absolute;
top:10px;
left:0;
float:left;
width:4px;
height:4px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
background:#fff;
-moz-box-shadow:-1px -1px 2px #004977;
-webkit-box-shadow:-1px -1px 2px #004977;
box-shadow:-1px -1px 2px #004977;
} 

.label-size a:hover{background:#555;}
.label-size a:hover:before{border-color:transparent #555 transparent transparent;}

 

Stil 2

 

 

 

 

 

 

 

 

 

 

 

 

.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 3px;
float:left;
text-decoration:none;
font-size:10px;
color:#666;
}

.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-moz-transition: all 0.5s ease-out; 
-o-transition: all 0.5s ease-out; 
-webkit-transition: all 0.5s ease-out; 
-ms-transition: all 0.5s ease-out; 
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg); 
-o-transform: rotate(7deg); 
-webkit-transform: rotate(7deg); 
-ms-transform: rotate(7deg); 
transform: rotate(7deg); 
filter: progid:DXImageTransform.Microsoft.Matrix(
                    M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1; 
}

.label-size a  {
text-transform: uppercase;
float:left;
text-decoration: none;
}
.label-size a:hover  {
text-decoration: none;
}

 

Stil 3

 

 

 

 

 

 

 

 

 

 

 

 

 

 

.label-size {
    float:left;
    margin:0 0 7px 20px;
    position:relative;
    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:0.75em;
    font-weight:bold;
    text-decoration:none;
    color:#996633;
    text-shadow:0px 1px 0px rgba(255,255,255,.4);
    padding:0.417em 0.417em 0.417em 0.917em;
    border-top:1px solid #d99d38;
    border-right:1px solid #d99d38;
    border-bottom:1px solid #d99d38;
    -webkit-border-radius:0 0.25em 0.25em 0;
    -moz-border-radius:0 0.25em 0.25em 0;
    border-radius:0 0.25em 0.25em 0;
    background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');
    -webkit-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    -moz-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
 
    z-index:100;
}

.label-size:before {
    content:'';
    width:1.30em;
    height:1.39em;
    background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');
    position:absolute;
    left:-0.69em;
    top:.2em;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    border-left:1px solid #d99d38;
    border-bottom:1px solid #d99d38;
    -webkit-border-radius:0 0 0 0.25em;
    -moz-border-radius:0 0 0 0.25em;
    border-radius:0 0 0 0.25em;
    z-index:1;
}

.label-size:after {
    content:'';
    width:0.5em;
    height:0.5em;
    background:#fff;
    -webkit-border-radius:4.167em;
    -moz-border-radius:4.167em;
    border-radius:4.167em;
    border:1px solid #d99d38;
    -webkit-box-shadow:0 1px 0 #faeaba;
    -moz-box-shadow:0 1px 0 #faeaba;
    box-shadow:0 1px 0 #faeaba;
    position:absolute;
    top:0.667em;
    left:-0.083em;
    z-index:9999;
}
.label-size:hover {
    background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');
    border-color:#e1b160;
}
 
.label-size:hover:before {
    background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');
    border-color:#e1b160;
}
#Label1 {height:210px !important;}

 

Son bir hatırlatma etiket gadgetını eklerken esçeneklerdeki Her etiketteki kayıt sayısını göster seçeneğini işaretlemeyin.

Float Blogger Teması

Yeni bir orjinal tema paylaşımı ile karşınızdayım.Bu temanbın ismi ise Float.Blogcuların kullandıüı temalar birbrine o kadar benziyor ki böyle usta tasarımcıarın elinden çıkan orjinal bir tema ile karşılaştıımda çok hoşuma gidiyor ve paylaşma ihtiyacı duyuyorum.

 

Demo – Download

 

Üstteki yatay menüyü düzenlemek için şanblondan şu kodlrı bulun:

 

<ul class='menu' id='menu-menu'>
<li><a href='#'>Home</a></li>
<li><a href='#'>Styling</a></li>
<li><a href='#'>Drop-down</a>
<ul class='sub-menu'>
<li><a href='#'>News</a></li>
<li><a href='#'>Video</a></li>
<li><a href='#'>Lorem Ipsum</a></li>
<li><a href='#'>Some Link</a></li>
</ul>
</li>
<li><a href='#'>Archives</a></li>
<li><a href='#'>Contact</a></li>
</ul>

 

Menüdeki her bir öğeyi şu şekilde düzenleyeceksiniz:

 

<li><a href='Açılacak link'>Öğenin adı</a></li>

 

Düzenlemeniz gereken diğer bir yer ise sosyal butonlar.Bunun için şablondan aşağıdaki kodları bulun:

 

<ul>
<li><a href='#' id='dribbble'>Dribbble</a></li>
<li><a href='http://facebook.com' id='facebook'>Facebook</a></li>
<li><a href='#' id='flickr'>Flickr</a></li>
<li><a href='http://twitter.com' id='twitter'>Twitter</a></li>
<li><a href='#' id='google'>Google+</a></li>
<li><a href='#' id='tumblr'>Tumblr</a></li>
<li><a href='#' id='pinterest'>Pinterest</a></li>
<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' id='rss'>RSS</a></li>
</ul>

 

Her bir sosyal ağın önündei # işareti yerine o sosyal ağa ait adresinizi yazın.Örneğin:

 

<li><a href='http://twitter.com/bloghocam' id='twitter'>Twitter</a></li> gibi

 

Eğer listedeki sosyal ağlar arasında hesabınız olmayanlar varsa o satırı tamamen silebilirsiniz.