Header Ads

Numrerad sidnavigering

Har ni tänkt på att det längst ner, efter alla inlägg, står äldre inlägg. Där kan man ju klicka sig bakåt i arkivet till äldre inlägg. Men varför inte styla denna länk med siffror istället?

Allt du behöver göra är att kopiera följande kod och klistra in i en html-gadget, under layout. Du kan även ändra färger m m enligt instruktioner nedan.

<style type='text/css'>
#blog-pager{padding:10px 0;clear:both;}
.showpageNum a {
color:#333333;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px 7px;
background-color:#FFFFFF;
}
.showpageNum a:hover, .showpage a:hover, .showpagePoint {
color:#333333;
border: 1px solid #cccccc;
padding:3px 7px;
background-color:#cccccc;
margin:0 3px;
}
.showpageOf {
color:#333;
text-decoration:none;
padding:3px 7px;
margin: 0 3px 0 0;
}
</style>
<a href="http://24work.blogspot.com/" target="_blank" title="Grab this"><img src="http://24work.ucoz.com/24work-blogspot/www.24work.blogspot.com.png" alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a>
<a href="http://24work.blogspot.com/" target="_blank" title="Free Backlinks"><img src="http://24work.ucoz.com/24work-blogspot/www.24work.blogspot.com.png" alt="Free Backlinks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a>
<script style='text/javascript'>
var numshowpage=3;
var postperpage =5;
var upPageWord="<<";
var downPageWord=">>";
var urlactivepage=location.href;
var home_page="/";
</script>
<script style='text/javascript' src='http://safir85.ucoz.com/24work-blogspot/page-navigation/0-test-p-n-01_00.js'></script>

.showpageNum a {
color:#333333; - färg på knapparna
border: 1px solid #cccccc; - färg på ramen runt knapparna
margin:0 3px;
padding:3px 7px;
background-color:#FFFFFF; - bakgrundsfärg

.showpageNum a:hover, .showpage a:hover, .showpagePoint {
color:#333333- färg på knapparna, när man håller musen över
border: 1px solid #cccccc; - färg på ramen runt knapparna, när man håller musen över
padding:3px 7px;
background-color:#cccccc;  - bakgrundsfärg, när man håller musen över
margin:0 3px;

var numshowpage=3; - antal sidor för och efter aktuell sida
var postperpage =5; - antal inlägg per sida
var upPageWord="<<"; - Kan bytas ut om valfria ord, t ex äldre, nyare, prev, next osv
var downPageWord=">>"; - Kan bytas ut om valfria ord, t ex äldre, nyare, prev, next osv

Koder för alla färger hittar du hos t x colorpicker.com
Lycka till!


Denna kod kommer ursprungligen från 24work.blogspot.com


9 comments:

  1. Åh vilket bra tips.
    Tack för en bra instruktion.
    Beem

    ReplyDelete
  2. Jättebra!
    Det finns fler tips i forumlänken, som nämns nederst i inlägget.

    ReplyDelete
  3. Kanon & jag som har "boxar" lade in detta i samma gadget som "Min status" så slapp jag få en tom box hihi :)

    ReplyDelete
  4. Tack! La genast till denna gadget, så snyggt det blev!!

    ReplyDelete
  5. Tack, vilken himla bra funktion!

    ReplyDelete
  6. Tog bort min igen tänkte fösöka på Svensk text ;)
    Men en riktigt fin & bra funktion/Kram

    ReplyDelete
  7. Tusen tack för en bra sida. Funkade lätt med dina enkla instruktioner.
    Annelie

    ReplyDelete
  8. Väldigt väldigt trevligt tips det här.
    Tackar så enormt mycket.

    Hälsningar,
    Baaartil

    ReplyDelete
  9. Hej!

    Jag har en skitsnygg design på min blogg MEN jag har ingen knapp "äldre inlägg" eller sidnumrering alls! Vet inte hur jag ska göra (använder blogg.se)

    Jag har fixat så det bara får plats max 5 inlägg på starsidan, men eftersom man inte kan gå tillbaka i äldre inlägg så "försvinner" min äldre inlägg.

    Hur ska jag göra?

    Tack på förhand!
    Emmagalen

    ReplyDelete

-------------------------------
Lämna gärna en hälsning! Har du en bloggfråga är du välkommen att ställa den på vårt forum. På så vis kan fler svara alternativt få hjälp om de har samma problem. Tack!
Du hittar en länk till forumet högst upp till vänster här på Fixabloggen.
-------------------------------