Description: TRik SEO Blogger | Percantik Tampilan Label
Rating: 4.5
Reviewer: Stasiun Geofisika Alor -
ItemReviewed: TRik SEO Blogger | Percantik Tampilan Label
Kunjungi blog Anda dan melihat label benar-benar berubah menjadi kotak persegi panjang kecil rapi dibuat. Jika dalam kasus Anda ingin kotak label untuk ukuran acak tergantung pada pasca-hitung maka cukup menghapus font-size: 10px; dari kode di atas.
Rating: 4.5
Reviewer: Mr. Sumawan
Pada tahun 2008 Blogger.com membuat update atau pembaruan. Beberapa pengembang pihak ketiga sering mengambil kesempatan emas untuk menciptakan widget untuk blog BlogSpot tapi begitu Google meluncurkan perubahan besar untuk layanan online mereka, widget resmi melakukan dengan baik karena script yang dilayani oleh server Blogger.
Halaman Daftar dan awan / daftar label desainer diaktifkan untuk membuat menu dinamis. Sejak itu stylesheet dibuat bisa diakses. Oleh karena itu kita semua mendapat kesempatan untuk bermain dengan widget dan mengubahnya benar-benar cantik dalam penampilannya. Tutorial pertama kalinya tentang cara tentang stylesheet sederhana yang akan mengubah awan label dalam blok kecil terorganisir yang berputar pada mouse.
Halaman Daftar dan awan / daftar label desainer diaktifkan untuk membuat menu dinamis. Sejak itu stylesheet dibuat bisa diakses. Oleh karena itu kita semua mendapat kesempatan untuk bermain dengan widget dan mengubahnya benar-benar cantik dalam penampilannya. Tutorial pertama kalinya tentang cara tentang stylesheet sederhana yang akan mengubah awan label dalam blok kecil terorganisir yang berputar pada mouse.
Tampilan label yang terlihat di layar cloud dan tampilan setelah Anda menerapkan gaya baru adalah sebagai berikut ini.
Cara kerjanya?
Setiap link label bersarang di dalam tag span diikuti oleh kelas bernama label-size. Jika font-size tidak ditentukan widget perubahan ukuran font-label masing-masing menurut hitungan pasca-nya. Oleh karena itu menunjukkan awan besar dan kecil.Memperkenalkan gaya kustom akan over-naik gaya keluar sehingga mengubah seluruh tampilan.
Mengaktifkan layar Cloud Acak ke Blok
Kode di bawah ini dapat disesuaikan dalam beberapa cara untuk membuat desain label menarik. Anda juga dapat menambahkan gambar latar belakang mereka.
Ikuti langkah-langkah mudah:
- Pergi ke Blogger> Settings> Layouts
- Klik tambahkan gadget dan pilih Label
- Di dalam pengaturan pastikan untuk memilih tampilan awan. Anda dapat mengatur opsi lain sesuai kebutuhan Anda. Lihat gambar di bawah sebagai contoh
Silakan memilih untuk menampilkan paling banyak 25 label. Label terlalu banyak pada homepage terlihat canggung. Showcase kategori terbaik Anda saja.
4. Sekarang simpan widget dan pergi ke Template> Pengaturan
5. Backup template Anda
6. Klik Edit html > Lanjutkan dan mencari ini
]]> </ B: skin>
7. Tepat di atas itu paste kode CSS berikut:
/*-----Custom Labels Cloud widget by www.MyBloggerTricks.com----*/
.label-size{
margin:0 2px 6px 0;
padding: 3px;
text-transform: uppercase;
border: solid 1px #C6C6C6;
border-radius: 3px;
float:left;
text-decoration:none;
font-size:10px;
color:#666;
}
.label-size:hover {
border:1px solid #6BB5FF;
text-decoration: none;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-ms-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
-moz-transform: rotate(7deg);
-o-transform: rotate(7deg);
-webkit-transform: rotate(7deg);
-ms-transform: rotate(7deg);
transform: rotate(7deg);
filter: progid:DXImageTransform.Microsoft.Matrix(
M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand');
zoom: 1;
}
.label-size a {
text-transform: uppercase;
float:left;
text-decoration: none;
}
.label-size a:hover {
text-decoration: none;
}
8. Simpan template Anda
9. Semua dilakukan!
Kunjungi blog Anda dan melihat label benar-benar berubah menjadi kotak persegi panjang kecil rapi dibuat. Jika dalam kasus Anda ingin kotak label untuk ukuran acak tergantung pada pasca-hitung maka cukup menghapus font-size: 10px; dari kode di atas.
