طريقة تغيير سحابة التسميات لمدونات بلوجر

السلام عليكم متابعى مدونة ابداعاتى الكرام اليوم وفى موضوع جديد لى فى  مدونة ابداعاتى أقدم لكم شرح بسيط لتنسيق سحابة التسميات فى بلوجر بما يناسب جميع الأذواق و ذلك لأن أداة التسميات فى معظم مدونات بلوجر التى تصفحتها كانت تقليدية وغير منسقة بالمرة فلذلك عندما وجدت هذا الموضوع فى مدونة عربية فقمت بتنسيق الأكواد و عرضها لكم فى موضوعى هذا متمنيًا أن ينال اعجاب حضراتكم

شرح تنسيق سحابة التسميات

 نقوم بالبحث عن الوسم ]]></b:skin> وذلك بالضغط على CTRL + F 

 ونلصق فوقه احد الاكواد التالية بحسب التصميم المراد

 التصميم الاول

التصميم الثاني 

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

التصميم الثالث 

.Label a{
padding-left:20px;
background:#000;
padding:0 20px;
color:#fff!important;
border-radius:100px;
-moz-border-radius:100px;
height:32px;
line-height:32px;
text-transform:uppercase;
text-decoration:none;
border:none !important;
-webkit-transition:all .3s ease-in-out !important;t: 30pxt: 30px;
float:left;
margin-left:5px;
margin-top:5px;
font-size:14px; }
.Label a:hover{
color:#000 !important;
background:#ff0; }

المصدر >> رياض بلوجر

♦ مع تحيات / حسام احمد ♦

مجرد كلمة شكر تكفى على المجهود المبذول