1. Pergi ke dashboard Blogger.com
2. Lalu pilih Template
3. Edit Template
4. Simpan code CSS di bawah ini di atas ]]></b:skin> atau </style> biar mudah untuk mencari TEKAN CTRL+F
/* -- Llylsll.blogspot.com Button --*/
.button {
text-align: center;
width: 100%;
margin: 10px 0;
padding: 0;
font-size: 14px;
font-family: 'Tahoma', Geneva, Sans-serif;
color: #fff;
margin-left: 0em !important;
}
.button ul {
margin: 0;
padding: 0;
}
.button li {
display: inline-block;
margin: 10px 0;
padding: 0;
}
.demo {
border-radius: 3px;
padding: 8px 12px;
background: #e74c3c;
color: #fff !important;
transition: background-color 1s 0s ease-out;
}
.download {
border-radius: 3px;
padding: 8px 12px;
background: #3498db;
color: #fff !important;
transition: background-color 1s 0s ease-out;
}
.buton a {
color: #fff;
}
.demo:hover {
background: #c0392b;
color: #fff;
}
.download:hover {
background: #2980b9;
color: #fff;
}
.download:before {
content: "\f019";
font-family: FontAwesome;
font-weight: normal;
padding: 8px;
background: #2980b9;
margin-left: -12px;
margin-right: 6px;
border-radius: 3px 0 0 3px;
font-size: 16px;
}
.demo:before {
content: "\f06e";
font-family: FontAwesome;
font-weight: normal;
padding: 8px;
background: #c0392b;
margin-left: -12px;
margin-right: 6px;
border-radius: 3px 0 0 3px;
font-size: 16px;
}
#Attribution1 {
height:0px;
visibility:hidden;
display:none
} <link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"></link> 6. Lalu buatlah post dan ubah dari COMPOSE ke HTML berikut code HTML nya di bawah ini
<ul class="button"><li><a class="download" href="http://hilwankiba.blogspot.com/"><i class="icon-cloud-download"></i> Download</a></li><li><a class="demo" href="http://hilwankiba.blogspot.com/"><i class="icon-desktop"></i> Demo</a></li></ul></div><div class="clear">
</div> Sekian cara cara diatas untuk membuat Tombol Download dan Demo dengan icon awesome semoga bermanfaat
Salam Blogger
0 komentar