KAFITRIYA: TIPS BLOGGER

Showing posts with label TIPS BLOGGER. Show all posts

January 11, 2021

Ingin Hardware dan Software Laptop Anda Awet? Ini tips nya!

Kafitriya January 11, 2021 0

Bagi seorang pekerja online, tentunya laptop merupakan alat perang yang paling penting. Tanpa laptop, tentunya penghasilan kita akan sangat berkurang dari yang seharusnya bisa anda dapatkan. Oleh karena itu, anda wajib menjaga dan merawat laptop anda agar awet dan dapat berfungsi dengan baik untuk jangka waktu lama.

Saya sendiri sudah hampir 6 tahun menggunakan laptop Asus A455L yang saya gunakan saat ini dan Alhamdulillah belum pernah mengalami kerusakan hardware ataupun software karena saya menerapkan tips yang akan saya share di artikel ini.

Hardware

1. Jangan menaruh laptop diatas kasur

Seringkali karena kita ingin merasa santai sambil tidur-tiduran, kita menaruh laptop diatas kasur.

Stop kebiasaan tersebut! Kebiasaan buruk tersebut hanya akan membuat sirkulasi pembuangan udara panas dari laptop akan sulit keluar dan akibatnya pembuangan hawa panas tersebut akan kembali lagi masuk ke laptop dan membuat komponen-komponen laptop anda menjadi bertambah panas dan kelamaan akan rusak.

Jadi usahakan menaruh laptop diatas permukaan datar agar sirkulasi udaranya lancar.

2. Jangan terburu-buru menutup laptop saat habis digunakan, apalagi dalam keadaan laptop belum mati sempurna

Kenapa begitu? Karena setelah digunakan tentu saja laptop masih dalam keadaan panas kan? Hal ini akan membuat hawa panas tersebut akan langsung mengenai LCD laptop anda dan mengalami kerusakan.

Bila laptop dalam keadaan belum mati sempurna juga akan berakibat fatal pada komponen dan LCD laptop.

3. Jangan menggunakan laptop terlalu lama

Laptop yang digunakan terlalu lama baik untuk main game ataupun bekerja dapat mengakibatkan overheat dan komponen didalamnya akan rusak, jadi untuk mensiasati ini anda hanya perlu mengatur penggunaan laptop tersebut, tentunya anda juga perlu untuk istirahat kan?

Nah, disaat anda istirahat ada baiknya anda memberikan waktu istirahat laptop anda juga, sekitar 15 - 30 menit.

4. Rajin membersihkan laptop

Debu yang menempel di laptop sangat rawan mengakibatkan kerusakan pada laptop anda. Debu akan masuk melalui celah keyboard dan lubang sirkulasi udara, ini akan mengakibatkan komponen laptop anda mengalami kerusakan karena banyaknya debu yang masuk.

Cukup rajin mengelapnya dengan kapas / kain bersih saja, atau bila anda ingin maksimal lakukan pembersihan bagian CPU laptop dengan cara membongkarnya agar bagian komponen laptop anda bersih juga, tetapi harus dilakukan oleh professional ya.

5. Gunakan pelindung layar LCD, penutup lubang dan pelindung keyboard

Ada kaitannya juga dari point nomor 4, pelindung layar ( screen protector ), penutup lubang-lubang laptop dan keyboard protector akan melindungi layar LCD dan keyboard anda dari debu/kotoran.

Pelindung laptop tersebut sudah banyak sekali dijual di berbagai toko yang menjual aksesoris komputer. Berapa harganya? Untuk harga saat ini saya kurang tahu ya,tapi saya sendiri membeli screen protector seharga Rp. 100.000 di Mall Ambasador pada tahun 2015, jadi ya kemungkinan harganya tidak berbeda jauh ( bukan promosi loh ya, hehe )

6. Jangan taruh laptop di dekat minuman/benda cair lainnya

Hal ini dilakukan untuk antisipasi jika hal tak diinginkan terjadi, seperti laptop ketumpahan minuman dan menyebabkan air masuk kedalam komponen laptop anda.

Tentunya hal ini akan membuat laptop anda rusak dan mengeluarkan biaya servis yang cukup mahal bukan?

7. Gunakan Cooling Pad

Alangkah baiknya bila anda menggunakan laptop di ruangan yang dingin agar mesin laptop anda tidak terlalu panas, tetapi bila ruangan anda tidak bersuhu dingin dan laptop anda tidak dilengkapi pendingin suhu otomatis, anda wajib menggunakan cooling pad agar suhu laptop anda tidak terlalu panas.

8. Jangan menaruh barang berat diatas laptop

Hal ini dilakukan untuk menghindari kerusakan layar LCD laptop anda, bahkan hal terburuk layar LCD anda akan timbul garis-garis yang sangat menggangu dan berujung pada kerusakan laptop.

9. Perhatikan penggunaan baterai

Melakukan pengisian baterai ketika baterai laptop sudah sangat habis sangat tidak dibenarkan.

Hal ini akan mengakibatkan baterai laptop anda rusak. Mengisi baterai secara berlebihan juga amat beresiko, karena dapat mengakibatkan baterai anda jebol, boros dan pada akhirnya tidak dapat dipergunakan lagi.

10. Simpan Laptop dengan baik

Menyimpan laptop dengan baik juga sangat berperan untuk membuat laptop tetap awet dan apabila laptop tidak dipakai dalam jangka waktu yang lama, copotlah baterainya dan simpan laptop ditempat yang cukup sejuk dan kering.

Software

1. Matikan laptop sesuai prosedur

Mematikan laptop dengan cara menekan tombol powernya sangat beresiko bagi laptop, hal ini dapat mengakibatkan motherboard, RAM dan processor laptop anda rusak sehingga mengakibatkan laptop anda menjadi blue screen dan pada akhirnya mati total.

Jadi alangkah baiknya mematikannya dengan menggunakan tombol shutdown dan menutup layar laptop ketika laptop sudah mati sempurna.

2. Hapus file dan program yang tidak perlu

Seperti yang diketahui, file dan program yang terinstall di laptop tentunya membutuhkan space/ruang memori. Nah, jika terlalu banyak aplikasi yang terpasang tentunya ini akan berakibat pada performa laptop anda menjadi lemot. Atau bila anda memang membutuhkan banyak aplikasi untuk pekerjaan anda, anda bisa mensiasatinya dengan menambah RAM anda agar performa tetap maksimal

3. Gunakan Antivirus

Bagi anda yang sangat sering berselancar di internet, tentunya bila tidak hati-hati maka laptop anda sangat rentan terkena virus.

Untuk mencegah hal ini, anda diharuskan untuk memasang antivirus agar laptop anda tetap sehat dan bebas dari virus yang dapat merusak laptop anda.

4. Pilih sistem operasi yang cocok sesuai spesifikasi laptop anda

Sistem operasi sangat berpengaruh bagi performa laptop anda, bila pricessor anda masih pentium maka menggunakan windows 10 akan terasa begitu berat dan laptop anda menjadi lemot.

Nah sekiranya cukup itu saja tips yang dapat saya bagikan menurut pengalaman saya pada anda, semoga bermanfaat ya😊

Tags # TIPS BLOGGER Continue Reading

June 8, 2018

Cara Menghapus Iklan Adsense di Postingan Blogger

Kafitriya June 08, 2018 0

Pagi ini, lagi lagi dapet surat cinta dari google adsense kalau salah satu postingan saya telah melanggar kebijakan dari google adsense.

Sedih rasanya, selama 6 bulan saya bergabung di adsense sudah 2 kali postingan saya kena tegur dan masalahnya pun sama seperti postingan pertama, YUP apalagi kalau tidak lain dan tidak bukan karena postingan PTC, hahaha.

Ya habis gimana ya, saya kan cuma mau memberi tips bagaimana cara menghasilkan uang online dan salah satunya ya memang dari PTC. Google Adsense memang setia banget deh ama para customer nya, sampe-sampe para publisher nya tidak boleh merekomendasikan situs PTC lain selain dia.hehe.

Akhirnya google adsense memberi dua pilihan kepada saya, apakah saya ingin merubah artikel tersebut ataukah menghapus unit iklan adsense yang ada di artikel tersebut?

Kebetulan postingan saya yang melanggar tersebut adalah salah satu postingan yang paling laris dan menyumbangkan banyak visitor per hari nya, sayang juga kalau harus dihapus.

Ya sudahlah, akhirnya saya memilih pilihan kedua untuk menghapus unit iklan adsense di dalam artikel tersebut.

Bagaimana Cara Menghilangkan Unit Iklan Adsense di Postingan yang Melanggar Kebijakan Tersebut?

Bagi publisher yang menaruh unit iklan adsense secara manual di kode HTML postingan nya tentunya ini adalah hal yang mudah kan, anda hanya perlu menghapus iklan tersebut di HTML postingan anda.

Tapi bagaimana bila iklan adsense tersebut otomatis tampil di setiap postingan dalam template anda?

nah ini yang akan saya bahas disini :

1. Pindahkan artikel postingan anda yang melanggar kebijakan tersebut ke Page ( halaman )

Buka akun blogger anda
Pada sisi kiri menu pilih Page / Halaman

Pada menu Pages / laman , pilih new page dan copy paste artikel anda dan beri judul yang sama dengan postingan yang melanggar kebijakan adsense tersebut.
Publish laman anda dan buka laman anda tersebut, salin kode URL nya

Kembali ke halaman akun blogger anda, di sisi kiri menu pilih settings/ setelan -> search preferences

Di menu search preferences, lakukan redirect URL dari artikel postingan yang melanggar kebijakan adsense tersebut ke URL laman yang anda buat barusan.

Caranya :

Klik pada link edit Custom Redirects

Akan muncul tampilan seperti ini :

Cara Pengisian :

From

Isi dengan URL artikel postingan anda yang melanggar kebijakan adsense, isi ujung URL nya saja tanpa domain.

contoh :

http://kafitriya.blogspot.com/2018/05/part-ii-setelah-3-bulan-nyari-duit-di.html

maka anda hanya perlu mengisinya : /2018/05/part-ii-setelah-3-bulan-nyari-duit-di.html

Isi dengan URL artikel postingan anda yang melanggar kebijakan adsense, isi ujung URL nya saja tanpa domain.

contoh :

http://kafitriya.blogspot.com/p/part-ii-setelah-3-bulan-nyari-duit-di.html

maka anda hanya perlu mengisinya : /p/part-ii-setelah-3-bulan-nyari-duit-di.html

Save

Jika berhasil, apabila anda mengklik postingan artikel anda yang lama maka anda akan teralihkan ke laman baru yang anda teah buat sebelumnya.

2. Menambahkan Kondisional Tag diantara kode iklan anda

Buka akun blogger anda
Pada sisi kiri menu pilih theme -> edit HTML

Tambahkan kondisional dengan format seperti ini di setiap kode iklan yang terpasang di blog anda :

<b:if cond='data:blog.pageType == "static_page"'>

KODE IKLAN ADSENSE

</b:if>

Contoh :

Dengan memasang kondisional tag seperti ini, maka iklan adsense tidak akan muncul di pages / laman postingan anda yang melanggar kebijakan google adsense yang telah anda buat sebelumnya.

Cara tersebut juga secara otomatis mengatur agar semua iklan adsense tidak tayang di semua pages / laman yang ada di blog anda, termasuk laman about, privacy policy, disclaimer dan contact yang biasanya dibuat di laman/pages blog.

Bagaimana?

Mudah bukan? Bila anda mengikuti langkah demi langkah dijamin anda akan berhasil dan akun adsense anda pun akan aman.

Semoga bermanfaat dan Happy Blogging.

Tags # ADSENSE # TIPS BLOGGER Continue Reading

January 30, 2018

Cara Mengetahui Siapa Yang Sedang Melihat Blog Dengan Aplikasi Who's Amung Us

Kafitriya January 30, 2018 3

Kali ini saya akan membahas bagaimana sih caranya melihat siapa yang mengunjungi ( visitor ) blog anda dengan aplikasi ini. Apakah anda sudah pernah mendengar aplikasi Who's Amoung Us?

Nah, Aplikasi ini lah yang akan saya bahas di artikel saya kali ini.

Who's Amoung Us

Ini layanan yang memudahkan kita untuk melihat jumlah real time visitor yang sedang berada di blog anda, dari negara mana, memakai device apa dan apa yang sedang dilakukan oleh visitor tersebut di blog kita.

Sebenarnya ada banyak aplikasi serupa di luar sana, seperti google analytics, histats dan lainnya, akan tetapi saya lebih memilih aplikasi ini, kenapa? karena :

Penggunaannya mudah, untuk mendapatkan kodenya tidak perlu registrasi terlebih dahulu di websitenya seperti aplikasi-aplikasi serupa lainnya yang mengharuskan anda untuk daftar terlebih dahulu.
Datanya akurat
Tersedia banyak jenis pilihan tampilannya
Tampilannya simple
GRATISSS😀

Cara Pasang

Langkah I

Buka aplikasi ini https://whos.amung.us
Scrool kebawah dan pilih WHO.AMUNG.US FREE dan pilih PICK WIDGET
Lalu anda akan dihadapkan dengan tampilan seperti di bawah ini, anda tinggal memilih tampilan seperti apa yang akan anda gunakan dan anda tinggal klik GET CODEnya saja. Kode pun akan langsung tersedia dibagian bawah.

Our smallest widget fits in perfectly on every website, yaitu menampilkan widget dengan ukuran yang sangat kecil
The Original widget, menampilkan widget dengan model serupa dengan smallest widget, akan tetatpi ukurannya agak sedikit lebih besar ( normal )
Like the original, but now with different colors, menampilkan widget dengan model dan ukuran serupa dengan versi original, akan tetapi anda dapat memilih sendiri warna apa yang akan digunakan di widget tersebut. Anda dapat melakukan pengaturan di tampilan sebelah kiri kolom kode.

Position this tab widget on the edges of your website, tampilan widget yang akan terlihat lebih besar, dan terletak anda dapat mengatur sendiri di posisi mana widget tersebut akan ditampilkan, samping kiri, kanan, bawah atau atas blog. Anda dapat melakukan pengaturan di tampilan sebelah kiri kolom kode.

Add a map to your website, widget yang akan ditampilkan yaitu dalam bentuk peta dunia. Didalamnya terdapat simbol dari negara mana saja visitor anda berasal. Anda dapat melakukan setting atas simbol, warna dan ukuran peta yang akan ditampilkan di blog anda dengan melakukan setting di tampilan sebelah kiri kolom kode.

Langkah II

Copy code yang telah anda dapatkan
Buka blogger.com anda
Pilih Tata letak
Pilih di bagian sebelah mana anda akan menempatkan widget tersebut
Klik tambahkan gadget / add gadget
Klik HTML/Java Script
Paste kode ke dalam kolom konten ( judulnya kosongkan saja )
Simpan

Nah, sekarang anda sudah dapat melihat berapa jumlah user yang sedang mengunjungi blog anda kan?

Untuk melihat detailnya bisa klik di aplikasi tersebut, dan akan terlihat jumlah pastinya. Device apa yang visitor gunakan, dengan browser apa, dari negara mana, dan apa yang sedang visitor itu lakukan, sedang melihat suatu artikel ataukah hanya mengamati designnya saja, hehe.

Baiklah, sekiranya itu saja yang bisa saya ulas tentang Who's Amoung Us ini, semoga informasi yang saya sampaikan dapat berguna bagi pembaca blog saya. Bila ada yang masih belum jelas bisa ditanyakan langsung kepada saya melalui kolom komentar ya...

Akhir kata saya ucapkan have a nice day and happy blogging😊

Tags # TIPS BLOGGER Continue Reading

January 18, 2018

15 Label keren dan cara memasangnya di blogspot

Kafitriya January 18, 2018 0

Setelah sebelumnya saya membuat artikel tentang cara membuat dan memasang label di blogspot , kali ini saya akan membahas bagaimana cara membuat tampilan label itu lebih berbeda dan keren dari tampilan biasanya.

Berikut ini saya kumpulkan berbagai label - label keren dari berbagai sumber yang telah saya temui selama perjalanan saya membuat blog ini. Silahkan anda memilih design mana yang cocok dengan anda dan ikuti cara-cara membuat dan memasangnya.

Cara Membuat :

1. Buka halaman blogger anda

2. Pilih menu Tema - Sesuaikan

3. Pilih Lanjutan - Tambahkan CSS

Nah, sementara itu kita tinggalkan dulu bagian ini, tetapi jangan sampai anda close ya.

Untuk design - design tabelnya bisa anda di pilih dibawah ini berikut kode HTML nya yang harus anda copy dan paste kan ke dalam box CSS diatas dan klik terapkan ke blog untuk menyimpan hasilnya.

Design 1

Kode

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10} .cloud-label-widget-content{text-align:left} .label-size{background:#0dd7b4;display:block;float:left;margin:0 3px 3px 0;color:#ffffff;font-size:11px;text-transform:uppercase} .label-size a,.label-size span{display:inline-block;color:#ffffff!important;padding:6px 8px;font-weight:bold} .label-size:hover{background:#333333} .label-count{white-space:nowrap;padding-right:3px;margin-left:-3px;background:#333333;color:#fff!important} .label-size{line-height:1.2}

Design 2

Kode

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10} .cloud-label-widget-content{text-align:left} .label-size{background:#08A2FA;border-radius:30px;display:block;float:left;margin:0 3px 3px 0;color:#ffffff;font-size:11px;text-transform:uppercase} .label-size a,.label-size span{display:inline-block;color:#ffffff!important;padding:6px 8px;font-weight:bold} .label-size:hover{background:#000000} .label-count{white-space:nowrap;padding-right:3px;margin-left:-3px;background:#000000;color:#fff!important} .label-size{line-height:1.2}

Design 3

Kode

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10} .cloud-label-widget-content{text-align:left} .label-size{border:5px dashed #000000;border-bottom-right-radius:30px;border-top-left-radius:30px;background:#FA0830;display:block;float:left;margin:0 3px 3px 0;color:#ffffff;font-size:11px;text-transform:uppercase} .label-size a,.label-size span{display:inline-block;color:#ffffff!important;padding:6px 8px;font-weight:bold} .label-size:hover{border:5px dashed #FA0830;background:#000000} .label-count{white-space:nowrap;border-bottom-right-radius:30px;border-top-left-radius:30px;padding-right:3px;margin-left:-3px;background:#000000;color:#fff!important} .label-size{line-height:1.2}

Design 4

Kode

.label-size-1,.label-size-2,.label-size-3,.label-size-4,.label-size-5{font-size:100%;filter:alpha(100);opacity:10} .cloud-label-widget-content{text-align:left} .label-size{background:#08A2FA;border-radius:30px;display:block;float:left;margin:0 3px 3px 0;color:#ffffff;font-size:11px;text-transform:uppercase} .label-size a,.label-size span{display:inline-block;color:#ffffff!important;padding:6px 8px;font-weight:bold} .label-size:hover{background:#000000} .label-count{white-space:nowrap;padding-right:3px;margin-left:-3px;background:#000000;color:#fff!important} .label-size{line-height:1.2}

Design 5

Kode

.cloud-label-widget-content {text-align: left;}
.label-size {background: #5498C9;display: block;float: left;margin: 0 3px 3px 0;color: #fff;font-family: Oswald, Arial, Sans-Serif;font-size: 11px;text-transform: uppercase;}
.label-size:nth-child(1) {background: #F53477;}
.label-size:nth-child(2) {background: #89C237;}
.label-size:nth-child(3) {background: #44CCF2;}
.label-size:nth-child(4) {background: #01ACE2;}
.label-size:nth-child(5) {background: #94368E;}
.label-size:nth-child(6) {background: #A51A5D;}
.label-size:nth-child(7) {background: #555;}
.label-size:nth-child(8) {background: #f2a261;}
.label-size:nth-child(9) {background: #00ff80;}
.label-size:nth-child(10) {background: #b8870b;}
.label-size:nth-child(11) {background: #99cc33;}
.label-size:nth-child(12) {background: #ffff00;}
.label-size:nth-child(13) {background: #40dece;}
.label-size:nth-child(14) {background: #ff6347;}
.label-size:nth-child(15) {background: #f0e68d;}
.label-size:nth-child(16) {background: #7fffd2;}
.label-size:nth-child(17) {background: #7a68ed;}
.label-size:nth-child(18) {background: #ff1491;}
.label-size:nth-child(19) {background: #698c23;}
.label-size:nth-child(20) {background: #00ff00;}
.label-size a, .label-size span {
display: inline-block;
color: #fff !important;
padding: 4px 10px;
font-weight: bold;
}
.label-size:hover {
background: #222;
}
.label-count {
white-space: nowrap;
padding-right: 3px;
margin-left: -3px;
background: #333;
color: #fff ;
}
.label-size:hover .label-count, .label-size:focus+.label-count {
background-color: #ff6bb5;
}

Design 6

Kode

.label-size {

    float: left;

    margin: 0 0 7px 20px;

    position: relative;

    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

    font-size: 0.75em;

    font-weight: bold;

    text-decoration: none;

    color: #996633;

    text-shadow: 0px 1px 0px rgba(255,255,255,.4);

    padding: 0.417em 0.417em 0.417em 0.917em;

    border-top: 1px solid #d99d38;

    border-right: 1px solid #d99d38;

    border-bottom: 1px solid #d99d38;

    -webkit-border-radius: 0 0.25em 0.25em 0;

    -moz-border-radius: 0 0.25em 0.25em 0;

    border-radius: 0 0.25em 0.25em 0;

    background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));

    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');

    -webkit-box-shadow: inset 0 1px 0 #faeaba,

        0 1px 1px rgba(0,0,0,.1);

    -moz-box-shadow: inset 0 1px 0 #faeaba,

        0 1px 1px rgba(0,0,0,.1);

    box-shadow: inset 0 1px 0 #faeaba,

        0 1px 1px rgba(0,0,0,.1);

    z-index: 1;

}


.label-size:before {

    content: '';

    width: 1.30em;

    height: 1.39em;

    background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));

    background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));

    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');

    position: absolute;

    left: -0.69em;

    top: .2em;

    -webkit-transform: rotate(45deg);

    -moz-transform: rotate(45deg);

    -o-transform: rotate(45deg);

    transform: rotate(45deg);

    border-left: 1px solid #d99d38;

    border-bottom: 1px solid #d99d38;

    -webkit-border-radius: 0 0 0 0.25em;

    -moz-border-radius: 0 0 0 0.25em;

    border-radius: 0 0 0 0.25em;

    z-index: 1;

}


.label-size:after {

    content: '';

    width: 0.5em;

    height: 0.5em;

    background: #fff;

    -webkit-border-radius: 4.167em;

    -moz-border-radius: 4.167em;

    border-radius: 4.167em;

    border: 1px solid #d99d38;

    -webkit-box-shadow: 0 1px 0 #faeaba;

    -moz-box-shadow: 0 1px 0 #faeaba;

    box-shadow: 0 1px 0 #faeaba;

    position: absolute;

    top: 0.667em;

    left: -0.083em;

    z-index: 9999;

}


#Label1 {

    height: 210px;

}


.label-size:hover {

    background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));

    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');

    border-color: #e1b160;

}


.label-size:hover:before {

    background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));

    background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));

    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');

    border-color: #e1b160;

Design 7

Kode :

.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; 
}

Design 8

Kode :

.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;

display:inline-block;float:none;font-family:"Trebuchet MS","Arial","Helvetica",sans-serif;font-style:normal;font-weight:bold;text-decoration:none;background-color:#1BA1E2;color:#fff !important;-webkit-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-moz-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-o-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-webkit-box-shadow:0 0 1px #999999;-moz-box-shadow:0 0 1px #999999;-o-box-shadow:0 0 1px #999999;box-shadow:0 0 1px #999999;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:-webkit-transform 0.1s ease-in;-moz-transition:-moz-transform 0.1s ease-in;-o-transition:-o-transform 0.1s ease-in;transition:transform 0.1s ease-in;

}

.label-size:hover {

color:#fff;background-color:#0c92da;-webkit-box-shadow:0 0 20px rgb(0,0,50);-moz-box-shadow:0 0 20px rgb(0,0,50);-o-box-shadow:0 0 20px rgb(0,0,50);box-shadow:0 0 10px rgb(0,0,50);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);-o-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2);

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  {

display:inline-block;float:none;margin:2px 1px;padding:6px 3px;font-family:"Trebuchet MS","Arial","Helvetica",sans-serif;font-style:normal;font-weight:bold;text-decoration:none;background-color:#252c44;color:#fff !important;-webkit-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-moz-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-o-text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;text-shadow:rgba(0,0,0,0.2) 1px 0,rgba(0,0,0,0.2) 0 1px,rgba(255,255,255,0.2) -1px 0,rgba(255,255,255,0.2) 0 -1px,rgba(0,0,0,0.2) 1px 1px,rgba(255,255,255,0.2) -1px -1px;-webkit-box-shadow:0 0 1px #999999;-moz-box-shadow:0 0 1px #999999;-o-box-shadow:0 0 1px #999999;box-shadow:0 0 1px #999999;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:-webkit-transform 0.1s ease-in;-moz-transition:-moz-transform 0.1s ease-in;-o-transition:-o-transform 0.1s ease-in;transition:transform 0.1s ease-in;background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);background-color:#252c44;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);

}

.label-size a:hover  {

color:#fff;background-color:#0c92da;-webkit-box-shadow:0 0 20px rgb(0,0,50);-moz-box-shadow:0 0 20px rgb(0,0,50);-o-box-shadow:0 0 20px rgb(0,0,50);box-shadow:0 0 10px rgb(0,0,50);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);-o-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2);-webkit-transform:rotate(-3deg) scale(1.2);-moz-transform:rotate(-3deg) scale(1.2);-o-transform:rotate(-3deg) scale(1.2);background-color:#0c92da;transform:rotate(-3deg) scale(1.2);-webkit-transform:rotate(3deg) scale(1.2);-moz-transform:rotate(3deg) scale(1.2);transform:rotate(3deg) scale(1.2);background-color:#0c92da;-webkit-transform:rotate(2deg) scale(1.2);-moz-transform:rotate(2deg) scale(1.2);background-color:#0c92da;-o-transform:rotate(2deg) scale(1.2);transform:rotate(2deg) scale(1.2);

}

Design 9

Kode :

.label-size a {

text-transform: uppercase;

float: left;

text-decoration: none;

margin: 2px 3px 6px 0;

padding: 3px;

border: solid 1px #999;

border-radius: 3px;

font-size: 12px;

-moz-transition: all 0.3s ease-out;

-o-transition: all 0.3s ease-out;

-webkit-transition: all 0.3s ease-out;

-ms-transition: all 0.3s ease-out;

transition: all 0.3s ease-out;

-webkit-transform: rotate(10deg) scale(1) skew(5deg) translate(0px);

-moz-transform: rotate(10deg) scale(1) skew(5deg) translate(0px);

-ms-transform: rotate(10deg) scale(1) skew(5deg) translate(0px);

-o-transform: rotate(10deg) scale(1) skew(5deg) translate(0px);

}

.label-size a:hover {

border: 1px solid black;

-webkit-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);

-moz-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);

-ms-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);

-o-transform: rotate(0deg) scale(1.2) skew(5deg) translate(0px);

}

Design 10

Kode :

.label-size a {

font-size: 14px!important;

padding: 1px 6px;

border-top: 1px solid #CACACA;

border-left: 4px solid #00A8FF;

margin-bottom: 5px;

float: left;

margin-right: 5px;

background: #F5F5F5;

border-right: 1px solid #CACACA;

border-bottom: 1px solid #CACACA;

}

.label-size a:hover {

border-left: 2px solid #222222;

border-right: 3px solid #222222;

background: #fff;

}

Design 11

Kode :

.label-size a {

text-transform: uppercase;

float: left;

text-decoration: none;

margin: 2px 3px 6px 0;

padding: 3px;

border: solid 1px #999;

border-radius: 3px;

font-size: 12px;

-moz-transition: all 0.3s ease-out;

-o-transition: all 0.3s ease-out;

-webkit-transition: all 0.3s ease-out;

-ms-transition: all 0.3s ease-out;

transition: all 0.3s ease-out;

-webkit-transform:rotate(0deg) scale(1) skew(-15deg) translate(0px);

-moz-transform: rotate(0deg) scale(1) skew(-15deg) translate(0px);

-ms-transform: rotate(0deg) scale(1) skew(-15deg) translate(0px);

-o-transform: rotate(0deg) scale(1) skew(-15deg) translate(0px);

}

.label-size a:hover {

border: 1px solid black;

-webkit-transform: rotate(0deg) scale(1) skew(15deg) translate(0px);

-moz-transform: rotate(0deg) scale(1) skew(15deg) translate(0px);

-ms-transform: rotate(0deg) scale(1) skew(15deg) translate(0px);

-o-transform: rotate(0deg) scale(1) skew(15deg) translate(0px);

}

Design 12

Kode

.label-size{
   display: inline-block;
   padding: 0px 10px;
   height: 29px;
   line-height:29px;
   border-radius: 5px;
   font-weight:bold;
   font-size:12px;
   text-decoration:none;}
.label-size{
  border: 1px solid #769e42;
  box-shadow: inset 0 1px 0 #c5e59c ;
  background-color: #9ed35a;
  text-shadow: 0px 1px 1px #6ea23b;
  color: #fff;
  background-image: linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -o-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
}
.label-size:hover{
  background-color: #b7fa66;
  background-image: linear-gradient(top, #b7fa66 0%, #7ec940 100%);
  background-image: -o-linear-gradient(top, #b7fa66 0%, #7ec940 100%);
  background-image: -moz-linear-gradient(top, #b7fa66 0%, #7ec940 100%);
  background-image: -webkit-linear-gradient(top, #b7fa66 0%, #7ec940 100%);
  background-image: -ms-linear-gradient(top, #b7fa66 0%, #7ec940 100%);
}
.label-size:active{
  background-image: linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -o-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -moz-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -webkit-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -ms-linear-gradient(top, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
}
.label-size{
  display:inline-block;
  border-radius: 5px 0 0 5px;
  border-right-width:0;
  position:relative;
  z-index:5;
  margin-right: 20px;
  margin-bottom: 10px;
}
.label-size:after{
  content: " ";
  width: 22px;
  height: 22px;
  line-height: 18px;
  font-size:25px;
  border-top: 1px solid #769e42;
  border-right: 1px solid #769e42;
  box-shadow: inset 0 1px 0 #c5e59c ;
  background-color: #9ed35a;
  text-shadow: 0px 1px 1px #7eac46;
  border-radius: 3px 7px 3px 0;
  color: #fff;
  background-image: linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -o-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -moz-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -webkit-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -ms-linear-gradient(135deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  position:absolute;
  top: 3px;
  right: -12px;
  z-index:-3;
  -webkit-transform: rotate(45deg);  /* Saf3.1+, Chrome */
       -moz-transform: rotate(45deg);  /* FF3.5+ */
        -ms-transform: rotate(45deg);  /* IE9 */
         -o-transform: rotate(45deg);  /* Opera 10.5 */
            transform: rotate(45deg);
               filter: progid:DXImageTransform.Microsoft.Matrix(/* IE6–IE9 */
                       M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476, sizingMethod='auto expand');
                 zoom: 1;
}
.label-size:hover:after{
  background-color: #b7fa66;
  background-image: linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);
  background-image: -o-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);
  background-image: -moz-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);
  background-image: -webkit-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);
  background-image: -ms-linear-gradient(-45deg, #b7fa66 0%, #7ec940 100%);
}
.label-size:active:after{
  background-image: linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -o-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -moz-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -webkit-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
  background-image: -ms-linear-gradient(-45deg, rgb(125,196,64) 0%, rgb(157,210,88) 100%);
}
.label-size:before{
  content: " ";
  height:5px;
  width:5px;
  display:block;
  position:absolute;
  right:-3px;
  top:11px;
  background-color: #fcfdf5;
  border: 1px solid #83ab52;
  border-radius:5px;
  box-shadow: 0 1px 0 #b2ddd83;
}
.label-size span{
  padding:2px 5px;
  border: 1px solid #9e5c26;
  border-radius: 5px;
  box-shadow: inset 0 1px 0 #f5bf8c;
  background-color: #ed943f;
  text-shadow: 0px 1px 1px #000;
  margin-left: 10px;
  background-image: linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);
  background-image: -o-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);
  background-image: -moz-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);
  background-image: -webkit-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);
  background-image: -ms-linear-gradient(bottom, rgb(211,95,32) 0%, rgb(223,131,45) 100%);
}
#Label1 {height:210px !important;}

Design 13

Kode

.label-size {
display:inline-block; margin: 0 4px 4px 0; padding:7px;
font:13px verdana; float:left; background: #FF0000;
-webkit-transform: translateZ(0); transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.label-size:before {
pointer-events: none; position: absolute;
content: ''; height: 0; width: 0; bottom: 0; left: 0;
background: linear-gradient(45deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.4);
-webkit-transition-duration: 0.3s; transition-duration: 0.3s;
-webkit-transition-property: width, height; transition-property: width, height;
}
.label-size:hover:before, .label-size:focus:before, .label-size:active:before {
width: 16px; height: 16px;
}
.label-size a {color: #fff; text-decoration:none;}

Design 14

Kode

.label-size {
display:inline-block; margin: 0 4px 4px 0; padding:7px;
font:13px verdana; float:left; background: #FF0000;
-webkit-transform: translateZ(0); transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.label-size:before {
pointer-events: none; position: absolute;
content: ''; height: 0; width: 0; top: 0; right: 0;
background: linear-gradient(225deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.4);
-webkit-transition-duration: 0.3s; transition-duration: 0.3s;
-webkit-transition-property: width, height; transition-property: width, height;
}
.label-size:hover:before, .label-size:focus:before, .label-size:active:before {
width: 16px; height: 16px;
}
.label-size a {color: #fff; text-decoration:none;}

Design 15

Kode

.label-size {
display:inline-block; margin: 0 4px 4px 0; padding:7px;
font:13px verdana; float:left; background: #FF0000;
-webkit-transform: translateZ(0); transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}
.label-size:before {
pointer-events: none; position: absolute;
content: ''; height: 0; width: 0; bottom: 0; right: 0;
background: linear-gradient(315deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);
box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.4);
-webkit-transition-duration: 0.3s; transition-duration: 0.3s;
-webkit-transition-property: width, height; transition-property: width, height;
}
.label-size:hover:before, .label-size:focus:before, .label-size:active:before {
width: 16px; height: 16px;
}
.label-size a {color: #fff; text-decoration:none;}