2015/04/22

Turkusowy przycisk 3D

Demo

Jak umieścić przycisk na Bloggerze?

Zaloguj się na swoje konto i przejdź do menu Szablon => Edytuj kod HTML.
Kliknij w okno edytora i wciśnij kombinację klawiszy Ctrl+F. Używając wyszukiwarki znajdź:
</head>
Tuż nad znalezionym znacznikiem wklej kod:
<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>

Teraz wyszukaj:
]]></b:skin>
I tuż nad nim wklej kod:
/* Turkusowy przycisk 3D
----------------------------------------------- */
a.btn {
background: #5DC8CD; /* kolor tła przycisku */
box-shadow: 0px 5px 0px 0px #1E8185;
display: inline-block;
position: relative;
padding: 0 40px;
margin: 10px auto;
font-weight: 600;
text-align: center;
line-height: 50px;
color: #FFF;
border-radius: 5px;
transition: all 0.2s ;
text-decoration: none;
font-family: Arial;
font-size: 16px;
}
a.btn:hover {
box-shadow: 0px 0px 0px 0px #1E8185;
margin-top: 15px;
margin-bottom: 5px;
}
a.btn:before {
font-family: FontAwesome;
}
Następnie Zapisz szablon.

Teraz przejdź do edycji nowego posta.
Edytor posta przełącz do trybu HTML i w jego treści wpisz poniższy kod. Na koniec Opublikuj.
<center><a href="http://www.blokotek.pl/" class="btn"><i class="fa fa-download"></i>Turkusowy przycisk 3D</a></center>
Kody ikon znajdziesz na stronie czcionki Font Awesome.

Brak komentarzy :

Prześlij komentarz

Komentarze zawierające SPAM zostaną usunięte.

Szablon stworzony z przez Blokotka. Wszelkie prawa zastrzeżone.