Fie ca bucuriile şi gândurile bune ale prezentului să-ţi devină amintirile frumoase ale viitorului

joi, 17 martie 2011

Cum adaugi butonul "Back to top" in blog

     Blogger ca si Wordpress ofera cititorilor posibilitatea navigarii in pagini din partea de jos a blogului ceea ce este foarte bine ,dar,in momentul cand vrei sa accesezi alta categorie si esti in partea de jos a blogului este o problema .Trebuie sa revii prin rotirea butonului scroll ori trecand la pagina urmatoare ceea ce necesita timp iar daca blogul are un timp de incarcare ceva mai mare atunci problema este stresanta.
   Acest incovenient se poate rezolva usor prin adaugarea unui widget "Back to top" .Aceste se poate face pur si simplu scris sau personalizat cu o imagine.Se procedeaza cam asa :....

La inceput trebuie gasita o imagine apoi urcata pe un site de hosting cum ar fi :

Tinypic
My.imageshack.us
Box.net
Filebox.ro
Picassa
..........etc oricum sunt o groaza.Dupa urcarea imaginii copiem Direct link.

  Acum,.daca facem acest lucru in Blogger mergem la pagina de design si adaugam un obiect gadget si anume HTML/JavaScript. Il asezam in pozitia dorita in blog ,de preferinta in partea de jos a blogului apoi introducem acest script pe care il copiem initial intr-un fisier notepad:

<a style="display:scroll;
    position:fixed;
    bottom:33px;
    right:20px;
    " href="#" title="Back to Top">
    <img src="DIRECT LINK  IMAGINE /"</a>

  In acest script bottom 33px reprezinta distanta fata de marginea de jos a paginii iar right 20px reprezinta distanta fata de partea dreapta a paginii.Prin schimbarea valorilor se maresc sau se micsoreaza distantele si deasemenea right se poate schimba cu left in cazul in care dorim ca butonul sa fie in partea stanga a paginii,iar bottom se poate schimba cu top in cazul in care vren ca butonul sa fie in partea de sus a paginii. In loc de DIRECT LINK IMAGINE se trece linkul imaginii noastre.

In cazul in care se doreste doar scrierea a ceva atunci copiem acest cod:

<a style="display:scroll;
    position:fixed;
    bottom:33px;
    right:20px;
    " href="#" title="Back to Top">TEXT</a>

  Il introducem in widget iar in loc de TEXT se poate scrie orice. Sau putem folosi un widget pe care il personalizam si obtinem apoi codul gratuit pe acest SITE .

   Daca folosim acest lucru in Wordpress mergem in Dashboard >Appearance>Widget si de acolo alegem un widget text pe care il asezam in ce parte a paginii dorim apoi introducem unul din codurile de mai sus, salvam si gata !

Pentru acest articol m-am inspirat din Totul despre Blogger

Se poate deasemenea creea buton si pentru pagina jos dar asta presupune interventie asupra codului HTML al blogului .Modalitatea se gaseste deasemenea pe Totul despre Blogger.

0 comentarii:

Trimiteți un comentariu

>