Cum pun buton de download pe blog?

Butoane pe blog,site sau forum.


Live Demo    Download  

Pentru adaugarea acestor butoane in blog-ul Blogger urmati pasii urmatori:
Ne logam la contul blogger;
Clik pe sablon;
Inainte de a edita html-ul ar fi bine sa va salvati o copie a sablonului in calculator, in caz ca ceva nu merge bine,sau apasati pe butonul Salvati fara a Previzualiza. Astfel puteti reveni la vechiul sablon oricand doriti. Dati clic pe, 
"Descărcaţi şablonul complet" si salvati o copie;
Clik pe editati html;
Dam un clik in interiorul html-ul-ui;
Apoi apasam simultan tastele Ctrl si F,iar in casuta care va aparea scriem urmatorul cod:


 </b:skin>

4. Dupa ce il gasiti adaugati imediat deasupra lui urmatorul cod CSS:
  
.button {
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius:5px 5px 5px 5px;
border-radius:5px 5px 5px 5px;
-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
box-shadow:0 1px 3px rgba(0, 0, 0, 0.25);
background:url("http://www.zurb.com/images/overlay-button.png") repeat-x scroll 0 0 #222222;
border-bottom:1px solid rgba(0, 0, 0, 0.25);
color:#FFFFFF !important;
cursor:pointer;
font-weight:bold;
line-height:1;
overflow:visible;
font-size:17px;
padding:8px 19px 9px;
position:relative;
text-decoration:none;
text-shadow:0 -1px 1px rgba(0, 0, 0, 0.25);
width:auto;
}
.demobutton {
background-color:#999999;
text-align:center;
width:150px;
}
.demobutton:hover {
background-color:#00A0EE;
}
.downloadbutton {
background-color:#91BD09;
text-align:center;
width:150px;
}
.downloadbutton:hover {
background-color:#00AC00;
}
.button:hover {
-moz-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
-webkit-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
box-shadow:0 1px 11px rgba(0, 0, 0, 0.45);
}

 Salvati sablonul.

Acum nu ne mai ramane decat sa adaugam butoanele pentru Download si Demo in articolele unde dorim sa le inseram. Pentru a le adauga, dati click in editorul HTML al postarii si in locul unde doriti sa le adaugati lipiti urmatoarele coduri:

Pentru butoul Demo;   

<a class="demobutton button" href="pune link-ul tau aici" rel="nofollow" style="float: center;" target="_blank"><span style="display: inline-block;">Live Demo</span></a>     

Pentru butonul Download;

<a class="button downloadbutton" href="pune link-ul tau de download aici" rel="nofollow" style="float: center;" target="_blank"><span style="display: inline-block;">Download</span></a> 

Inlocuiti,"pune link-ul tau aici" si "pune link-ul tau de download aici" din cele doua coduri, cu link-urile  voastre.

В Blogger В Twitter Marcaje

Niciun comentariu:

Trimiteți un comentariu

Aboneaza-te prin E-mail si vei primi actualizari gratuite cu noile postari!
Booking.com