الثلاثاء، 24 يونيو، 2014

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

سحابة التسميات تختلف من قالب الى اخر وبعض القوالب لاتوجد في تصميمات لعرض سحابة التسميات حيث يتم وضعها في صورة عبارات عادية تؤدي الى را... thumbnail 1 summary


سحابة التسميات تختلف من قالب الى اخر وبعض القوالب لاتوجد في تصميمات لعرض سحابة التسميات حيث يتم وضعها في صورة عبارات عادية تؤدي الى رابط معين لكن اليوم مدونة الحسام ويب تقدم لكم تصميمات واشكال متعددة لسحابة التسميات فقط اختار مايناسبك ...

شرح تغيير سحابة التسميات :
* نقوم بالتوجه الى لوحة التحكم > القالب > تحرير القالب ثن نضغط على ctrl+f ونبحث عن الوسم  ]]></b:skin> ونلصق فوقه احد الاكواد التالية بحسب اختيارك :

* الشكل الاول :
 .Label a{float:left;padding:5px 8px;margin:2px 2px 0px 0;background-color:#1295C9;color:white;font-size:14px;text-decoration:none;text-shadow: 0 -1px -1px rgba(0, 0, 0, 0.2);-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;} .Label a:hover{background-color:#303030;}

* الشكل الثاني :
Custom Labels Cloud widget by http://al-7sam-web.blogspot.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; }

* الشكل الثالث :
/*--- MBL Custom Label Cloud With CSS3 --- */ .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; }
* ثم نقوم بحفظ القالب ومبرووووك عليك 

كلمة شكر تكفي لرد الجميل

ليست هناك تعليقات

إرسال تعليق