==========================================
Model I
==========================================
Kode Scriptnya :
/*-----Labels Cloud widget V.1 by Dido Borneo ----*/
.label-size{
background-color:#ffffff;
border:2px solid #2AA4CF;
float:left;
font-family:georgia;
font-size:12px;
margin:0px 1px 1px 0px;
padding:7px;
text-transform:uppercase;
box-shadow:rgba(0, 0, 0, 0.45098) 0 1px 11px;
}
.label-size:hover {
background-color:#ffffff;
border:none;
border-bottom-left-radius:12px;
border-bottom-right-radius:12px;
border-top-left-radius:12px;
border-top-right-radius:12px;
font-family:georgia;
font-weight:bold;
padding:7px;
text-decoration:none;
border-bottom-style:solid;
text-color:#fff;
border-bottom-color:#595b67;
border-bottom-width:4px;box-shadow:rgba(0, 0, 0, 0.45098) 0 1px 11px;
}
==========================================
Model II
==========================================
Kode Scriptnya :
/*-----Labels Cloud Styled widget V.2 by Dido Borneo----*/
.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 #B20000; 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;
}
==========================================
==========================================
Kode Scriptnya :
/*-----Labels Cloud Styled widget V.3 by Dido Borneo----*/#Label1 .cloud-label-widget-content {text-align:center;font-weight: bold;padding: 4px 0}
#Label1 .cloud-label-widget-content span {display: inline-table; line-height: 1.2;}
#Label1 .cloud-label-widget-content span a {padding:3px 4px;color:#fff}
#Label1 .label-size {margin:4px 0;}
#Label1 .label-size span {background:#E95D0C;padding:3px 4px;color:#fff}
#Label1 .label-size-1 a {background:#ff8c00;font-size:11px;}
#Label1 .label-size-2 a {background:#556b2f;font-size:11px;}
#Label1 .label-size-3 a {background:#cd5c5c;font-size:11px;}
#Label1 .label-size-4 a {background:#B32A32;font-size:11px;}
#Label1 .label-size-5 a {background:#66CC00;font-size:11px;}
#Label1 .cloud-label-widget-content span a:hover {background:#006400;}
==========================================
==========================================
Kode Scriptnya :
/*-----Labels Cloud Styled widget V.2 by Dido Borneo----*/
.label-size {display: block; float: left; background: #555 !important; margin: 0 1px 1px 0; color: #eee; font-size: 100%; }
.label-size:hover, .label-size a:hover, .label-size span:hover{background:#3384ff;}
.label-size a, .label-size span {display: inline-block; color: #fff; padding: 4px 4px;}
==========================================
==========================================
Kode Scriptnya :
/*-----Labels Cloud widget by Dido Borneo ----*/
#Label1 a{outline:none;
border: 1px rgba(0,0,0,0.2) solid;
padding: 4px 6px 4px 12px;
text-decoration:none;
color:black;
width:auto;
white-space: nowrap;
font-family: arial;
font-size: 13px;
font-weight: bold;
position: relative !important;
background-image: linear-gradient(bottom, rgb(32,107,107) 47%, rgb(34,201,184) 100%, rgb(35,95,97) 100%);
background-image: -o-linear-gradient(bottom, rgb(32,107,107) 47%, rgb(34,201,184) 100%, rgb(35,95,97) 100%);
background-image: -moz-linear-gradient(bottom, rgb(32,107,107) 47%, rgb(34,201,184) 100%, rgb(35,95,97) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(32,107,107) 47%, rgb(34,201,184) 100%, rgb(35,95,97) 100%);
background-image: -ms-linear-gradient(bottom, rgb(32,107,107) 47%, rgb(34,201,184) 100%, rgb(35,95,97) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.47, rgb(32,107,107)),
color-stop(1, rgb(34,201,184)),
color-stop(1, rgb(35,95,97))
);
float:left;
padding: 4px 3px;
margin: 0 5px 5px 0;
border-radius:8px 8px; -moz-border-radius:8px 8px 8px 8px; -khtml-border-radius:8px 8px 8px 8px; -webkit-border-radius:8px 8px 8px 8px; border-radius:8px 8px 8px 8px;
}
#Label1 a:hover {
background-image: linear-gradient(bottom, rgb(92,12,12) 47%, rgb(0,0,0) 100%, rgb(120,26,26) 100%);
background-image: -o-linear-gradient(bottom, rgb(92,12,12) 47%, rgb(0,0,0) 100%, rgb(120,26,26) 100%);
background-image: -moz-linear-gradient(bottom, rgb(92,12,12) 47%, rgb(0,0,0) 100%, rgb(120,26,26) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(92,12,12) 47%, rgb(0,0,0) 100%, rgb(120,26,26) 100%);
background-image: -ms-linear-gradient(bottom, rgb(92,12,12) 47%, rgb(0,0,0) 100%, rgb(120,26,26) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.47, rgb(92,12,12)),
color-stop(1, rgb(0,0,0)),
color-stop(1, rgb(120,26,26))
);
color:#fff;
}
#Label1 a:active {
background:#EC88C9;}
==========================================
==========================================
- Pada dashboard, Pilih Template
- Klik Edit Html
- Cari Kode ]]></b:skin>
- Copy Paste kode script Label Cloud Pilihan sobat
- Letakkan tepat Diatas Kode ]]></b:skin>
- Save dan Lihat Hasil
0 Comments