تغير شكل التسميات الى شكل احترافي

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

طريقة تغير شكل التسميات الى الشكل الجديد

1- من لوحة التحكم >> قالب >> تحرير HTML

2- خذ نسخة احتياطية لقالب المدونة قبل اجراء اي تغير

3- قم بالبحث عن الكود التالي بالاستعانة بلوحة التحكم (CTRL+F)

4- قم بالبحث عن الكود ]]></b:skin> واضف فوقه مباشراً الكود التالي

 

   .cloud-label-widget-content {
 text-align: right;
 }
 .label-size {
 background: #5498C9;
 display: block;
 float: right;
 margin:0 0 3px 3px;
 color: #fff;
 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-left: 3px;
 margin-right: -3px;
 background: #333;
 color: #fff ;
 }
 .label-size:hover .label-count, .label-size:focus+.label-count {
 background-color: #ff6bb5;
 }
  

عنوان التدوينة: تغير شكل التسميات الى شكل احترافي
تقييم : 10 من 10 مرتكز على 24 تقييم.
المدير |زياد الزعبي

عدد المشاهدات :

Zied Zaabi

زياد الزعبي : من تونس, اهتمامي وحبي للتدوين هو ما جعلني أستمر ليس فقط لتقديم المواضيع بل أيضا لمساعدة الأشخاص المبتدئين ، كما كنت سابقا إلا أني لم أجد من يساعدني ! مع ذلك كافحت وواضبت على ما أحبه من عمل لأصل إلى ما أريده ، ليس كمستقبل لكن كهدف حققته ,زياد ويب

• غرد
• مشاركة
• إضافة
مزيد

بضغطة زر تشارك الفائدة وتدعم المدونة

صندوق التدوينة

رابط مباشر :

كود للمنتديات :

HTML كود :