LABEL WIDGET SIMPLE

Thursday, 29 May 2014

LABEL WIDGET SIMPLE

--------------------------------------------------------------------------------------------------------

FIND B SKIN TAG ]]></b:skin> AND REPLACE THIS BELOW CODE
COPY AND PASTE CSS CODE

Read More:
http://fbgadgets.blogspot.co.uk/2014/06/label-widget-rainbowmulti-colour-style.html
http://fbgadgets.blogspot.co.uk/2014/05/label-widget-simple.html
http://fbgadgets.blogspot.co.uk/2014/08/multi-color-label-cloud-widget.html
--------------------------------------------------------------------------------------------------------

/*****************************************
Global Links CSS CHANGE LINK INTO BUTTON
******************************************/
a{ color: #4690B3; outline:none; text-decoration: none; }
a:hover { color: #3e3e3e; text-decoration:none; }

/*========================
Label
===========================*/
.Label ul {
list-style: none;
padding: 0;
margin: 0;
}

.Label ul li {
margin: 0 auto 20px;
padding: 0;
list-style: none;
}

.Label li a {
background: #3498DB;
padding: 3px 8px;
color: #FFF;
margin: 0 5px 5px 0;
float: left;
}

.Label li span{
background: #155F8F;
padding: 3px 8px;
color: #FFF;
margin: 0 5px 5px 0;
float: left;
}

----------------------------------------------------------------------------------------------------
FIND B SKIN TAG AND REPLACE :

]]></b:skin>
-----------------------------------------------------------------------------------------------------

.cloud-label-widget-content {
text-align: left;
}
.label-size {
background: #5498C9;
display: block;
float: left;
margin: 3px 3px 0 0;
color: #fff;
font-family: 'Open Sans',"Segoe UI",Arial,Tahoma,sans-serif;
font-size: 11px;
text-transform: uppercase;
}
.label-size:last-child {
margin-bottom: 3px;
}
.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;
}

]]></b:skin>

----------------------------------------------------------------------------------------------------------------------
TAG LABEL WIDGET
http://www.hosting22.com/script
-----------------------------------------------------------------------------------------------------------------------

----------------------------------------------------------------------------------------------------------------------
CODE:
----------------------------------------------------------------------------------------------------------------------

<!DOCTYPE html>

<html>
<head>
<style>
.bar0 {
width: 100%;
color: #3d3d3d;
height: 20px;
font-weight: bold;
border: 3px double #698fc7;
background: #e8eef9 url(http://www.hosting22.com/site/template/default/images/bar0.gif) repeat-x left center;
text-align: center
}
.bar0 a:link {
color: #000
}
.bar0 a:hover {
color: #red
}
.sortart0 {
float: left;
width: 48%;
height: auto
}
.sortart1 {
float: right;
width: 48%;
height: auto
}
.sortart {
padding-bottom: 5px;
list-style: none
}
.sortart li {
margin-left: 2px;
line-height: 21px;
border-bottom: 1px dotted #ccc;
height: 21px;
overflow: hidden
}
* {
margin: 0;
padding: 0
}
table {
table-layout: auto;
word-wrap: break-word
}
div {
word-wrap: break-word
}
body {
font: 12px Verdana, Helvetica, sans-serif;
margin: 0;
padding: 8px 0;
background: #333
}
input,
textarea {
color: #000;
font-family: Tahoma, MS\ Shell\ Dlg, å®‹ä½“;
font-size: 12px;
background-color: #e8eef9
}
select {
color: #000;
font-family: Tahoma, MS\ Shell\ Dlg, å®‹ä½“;
font-size: 12px;
background-color: #e8eef9
}
.sidebar {
padding: 0;
margin: 5px
}
.sidebar ul.list {
margin: 0 3px;
padding: 0;
color: #333;
list-style: none
}
.sidebar ul.list li {
line-height: 21px;
height: 21px;
padding-left: 17px;
border-bottom: 1px solid #ccc;
background: url(http://www.hosting22.com/site/template/default/images/xbtn.gif.pagespeed.ic.dGkJaS-ceH.png) no-repeat 4px -60px;
overflow: hidden
}
.sidebar ul.list-img {
margin: 5px 0 6px;
padding: 0;
list-style: none
}
.sidebar ul.list-img li {
float: left;
margin: 3px;
_margin: 2.9px
}
.sidebar ul.list-img img {
border: 8px solid #faf8f4
}
.sidebar ul.list-img a {
display: block;
background: #000;
border: 1px solid #6a5c8f;
padding: 0;
margin: 0
}
.more {
text-align: right
}
.sidebar h2,
#subsortlist h2 {
width: 100%;
height: 25px;
font-size: 1em;
color: #fff;
text-indent: 24px;
line-height: 25px;
font-weight: bold;
background: #6a5c8f url(http://www.hosting22.com/site/template/default/zh.gif) no-repeat left center;
border-top: 3px solid #333;
border-bottom: 1px solid #000
}
.keyword,
.hotsearch {
padding: 5px
}
.keyword a,
.hotsearch a {
font-size: 1.1em;
color: #ffa500;
line-height: 110%;
display: inline-block;
padding: 2px 5px 2px 20px;
margin: 2px;
border: 1px solid #ccc
}
.keyword a:hover,
.hotsearch a:hover {
color: #fff;
background-color: #000
}
.hotsearch a {
background: #eee url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEUW7xlczI8M-q-BGT_RY3QuYclzDhtcp8CdZOwTH5dfDZUW8u2kPZXipVMQ7TSoWRBnta8FRctMYWuUiYjTjlyeE2gvR29f9SX2eIT4gGanqOysvdBGgU4yhlY390zUPX0IvMc_t-oZVy/s1600/xbtn.gif.pagespeed.ic.dGkJaS-ceH.png) no-repeat 2px -142px
}
.keyword a {
background: #eee url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEUW7xlczI8M-q-BGT_RY3QuYclzDhtcp8CdZOwTH5dfDZUW8u2kPZXipVMQ7TSoWRBnta8FRctMYWuUiYjTjlyeE2gvR29f9SX2eIT4gGanqOysvdBGgU4yhlY390zUPX0IvMc_t-oZVy/s1600/xbtn.gif.pagespeed.ic.dGkJaS-ceH.png) no-repeat 2px -124px
}
</style>
</head>
<body>
<div class="sidebar">
<h2>Hot Tags:</h2>
<p class="keyword"><a href="http://www.hosting22.com/tags/premium+wordpress+theme/ ">premium wordpress theme</a><a href="http://www.hosting22.com/tags/2+column+wordpress+themes/ ">2 column wordpress themes</a><a href="http://www.hosting22.com/tags/blogging/ ">blogging</a><a href="http://www.hosting22.com/tags/magazine/ ">magazine</a><a href="http://www.hosting22.com/tags/news/ ">news</a><a href="http://www.hosting22.com/tags/wordpress+v2.7/ ">wordpress v2.7</a><a href="http://www.hosting22.com/tags/joomla+v1.5/ ">joomla v1.5</a><a href="http://www.hosting22.com/tags/gallery/ ">gallery</a><a href="http://www.hosting22.com/tags/business/ ">business</a><a href="http://www.hosting22.com/tags/corporate/ ">corporate</a><a href="http://www.hosting22.com/tags/widget-ready/ ">widget-ready</a><a href="http://www.hosting22.com/tags/3+column+wordpress+themes/ ">3 column wordpress themes</a><a href="http://www.hosting22.com/tags/video/ ">video</a><a href="http://www.hosting22.com/tags/free+wordpress+theme/ ">free wordpress theme</a><a href="http://www.hosting22.com/tags/photo/ ">photo</a><a href="http://www.hosting22.com/tags/backend+theme+options/ ">backend theme options</a><a href="http://www.hosting22.com/tags/joomla+v1.0/ ">joomla v1.0</a><a href="http://www.hosting22.com/tags/sales/ ">sales</a><a href="http://www.hosting22.com/tags/oscommerce/ ">oscommerce</a><a href="http://www.hosting22.com/tags/templateworld/ ">templateworld</a><a href="http://www.hosting22.com/tags/portfolio/ ">portfolio</a><a href="http://www.hosting22.com/tags/more+styles/ ">more styles</a><a href="http://www.hosting22.com/tags/1+column+wordpress+themes/ ">1 column wordpress themes</a><a href="http://www.hosting22.com/tags/grunge/ ">grunge</a><a href="http://www.hosting22.com/tags/premium+smf+theme/ ">premium smf theme</a><a href="http://www.hosting22.com/tags/slideshow/ ">slideshow</a><a href="http://www.hosting22.com/tags/christmas+style/ ">christmas style</a><a href="http://www.hosting22.com/tags/shop/ ">shop</a><a href="http://www.hosting22.com/tags/non-blogging/ ">non-blogging</a><a href="http://www.hosting22.com/tags/music/ ">music</a><a href="http://www.hosting22.com/tags/windows+style/ ">windows style</a><a href="http://www.hosting22.com/tags/simple+style/ ">simple style</a><a href="http://www.hosting22.com/tags/upload+script/ ">upload script</a><a href="http://www.hosting22.com/tags/user+manage/ ">user manage</a><a href="http://www.hosting22.com/tags/cms/ ">cms</a><a href="http://www.hosting22.com/tags/multimedia/ ">multimedia</a><a href="http://www.hosting22.com/tags/psd/ ">psd</a><a href="http://www.hosting22.com/tags/admin+skin/ ">admin skin</a><a href="http://www.hosting22.com/tags/project+template/ ">project template</a><a href="http://www.hosting22.com/tags/game/ ">game</a><a href="http://www.hosting22.com/tags/new+year+style/ ">new year style</a><a href="http://www.hosting22.com/tags/chat+room/ ">chat room</a><a href="http://www.hosting22.com/tags/msn+style/ ">msn style</a><a href="http://www.hosting22.com/tags/car/ ">car</a>
</p>
</div>
</body>
</html>