Bir önceki girdide belirttiğim gibi ne görsek istiyoruz durumu var, bu girdide de şu ok işaretlerini yazacağım. Hayır şimdi yazsam bir dert yazmasan bir dert kardeşim seviyor özeniyor insanlar napalım her taraf zırt”ca” zurt”ca” da dolmuş bu yüzden.
Bu navigasyon sistemi özünde yay!everyday isimli siteye ait ben o siteden önce sanırım uzun zaman önce bir thumblr tasarımında rastlamıştım orada da görünce hoşuma gitti uyarladım buraya.
Bunu yapmak bir öncekinden daha basit, sitenin <body> etiketinden sonrasına aşağıdakini ekleyin;
<div id="nav-above">
<div class="nav-previous">
<?php previous_posts_link('<span class="meta-nav">«</span>') ?>
</div>
<div class="nav-next">
<?php next_posts_link('<span class="meta-nav">»</span>') ?>
</div>
</div>
Daha sonra CSS de şöyle, style.css e ekleyin;
div#nav-above, #nav-above div{_display:none!important;}
#nav-above{display:block;position:fixed;top:35%;}
#nav-above a{display:block;padding:0 20px;color:#777;text-shadow:#fff 1px 1px 0px;}
#nav-above a:hover{color:#FFB321;text-decoration:none;}
#nav-below{clear:both;float:right;margin:3em 0 0;padding:0px;width:100%;color:#888;}
#nav-above .nav-previous {position:absolute;display:block;width:100px;top:50%;left:-90px;text-align:right;line-height:4em;font-size:5em;color:#888;}
#nav-above .nav-next {position:absolute;display:block;width:100px;top:50%;right:-850px;text-align:left;line-height:4em;font-size:5em;color:#888;}
#nav-below a {font-weight:800;margin:0px;}
.nav-next{background:transparent;float:right;font-size:1.2em;min-height:60px;padding:0;position:relative;margin:0;width:50%;}
.nav-previous{background:transparent;float:left;font-size:1.2em;min-height:60px;padding:0;position:relative;margin:0;width:50%;}
Bu da bu kadar.
Tekil yazılar için kod şöyle değişiyor, bunun farkı aynı kategoride ki yazıları sayfalaması;
<div id="nav-above" class="navigation">
<div class="nav-previous">
<?php previous_post_link('%link', '<span class="meta-nav">«</span>', true); ?>
</div>
<div class="nav-next">
<?php next_post_link('%link', '<span class="meta-nav">»</span>', true); ?>
</div>
</div>
Kullanımı yukarıda anlatıldığı gibi.
“WordPress için sayfanın sağına soluna ok işareti navigasyon” için 13 yanıt
bende blogumda kullanıyorum. tabii ki ilk olarak sen de görmüştüm. oldukça kullanışlı.
bloggera uyarlama şansımız var mı?
sayın enver arslan olur tabii uyarlamak lazım.
ben tişört yarışmasına girmek istiyorum
selam, volkan kardeşim şöyle bir durum mevcut ben daha önce yapmıştım bundan onceki temamda şimdi kodu ekleyince söyle oluyor;
ama ben;
yapmak istiyorum
<?php previous_post_link('%link', '« önceki haber', true); ?>
<?php next_post_link('%link', 'sonraki haber»', true); ?>
böyle yapıncada şöyle oluyor
bir önceki temamda düzeltmiştim ama suanda yapamiyorum yardımcı olurmusun
sayın salih,
sağlı sollu olması için sitil vermelisiniz. bunun için örnek;
bakı seyler cıkmamamıs yazında onceki ve sonraki haber seklinde yaptım lakin alt alt geliyor ben aynı sırada sağlı sollu olsun istiyorum
sayın orhan ne yarışmasıymış o bibok anlamadık bu konuda yarışma diye bir kelime yok.
sayın salih yazdıklarınız burada gözükmemiş pek birşey anlamadım, bir daha ki yorumunuzda konuyu biraz daha açıklarsanız yardımcı olmaya çalışırım.
yorumlar için teşekkürler.
simdi hocam site soyle anlatayım tekil yazı içersine önceki haber sonraki habe seklinda sağlı sollu yapmak istiyorum ama ornek veriyorum yorumu sonra silersin herhangi bisekilde reklam yada cıkarım yok http://frmbiz.com/samsun-kiz-yurdunda-yangin.html baksarsan alt altta girmiş ben bunlari aynı sira içersinde yapmak istiyorum
çok teşekkür ederim sağollasin çözüldü sorun 🙂
sende sağol salih.
yazdımda yazım gitmedi galiba. arkadaşım bende ekledim olmadı neresini yanlış yapıyo olabiliriz?
wordpress te bu kodları nereye ekleyeceğiz ben anlayamadım tam olarak kusura bakmayın.