كود الماسكي لإخفاء رقم الهاتف عند الاتصال بأي شخص

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

طريقة تغيير شكل التسميات في بلوجر:

- قبل التعديل نوصيك بإجراء نسخة احتياطية من نموذجك.

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

- ثانيا اتجه الى المظهر ثم تحرير html و ابحث عن الوسم التالي.

</b:skin>

بعد ايجاده ضع فوقه مباشرة الكود التالي.

.cloud-label-widget-content{text-align:right;}

.cloud-label-widget-content .label-count{background:#2b2b2b;color:#fff!important;margin-right:-3px;

padding-left:3px;white-space:nowrap;border-radius:2px;padding:1px 4px!important;font-size:12px!important;margin-left:5px;}

.cloud-label-widget-content .label-size{background:#ebebeb;display:block;float:right;

font-size:11px;margin:0 5px 5px;}

.cloud-label-widget-content .label-size a,

.cloud-label-widget-content .label-size span{height:18px!important;color:#2b2b2b;

display:inline-block;font-size:12px;font-weight:500!important;padding:6px 8px;}

.cloud-label-widget-content .label-size a{padding:6px 10px;}

.cloud-label-widget-content .label-size a:hover{color:#000!important;}

.cloud-label-widget-content .label-size,

.cloud-label-widget-content .label-count{height:30px!important;line-height:19px!important;

border-radius:2px;}

.cloud-label-widget-content .label-size:hover{background:#2b2b2b;color:#fff!important;}

.cloud-label-widget-content .label-size:hover a{color:#fff!important;}

.cloud-label-widget-content .label-size:hover span{background:#ebebeb;color:#2b2b2b!important;cursor:pointer;}

.cloud-label-widget-content .label-size-1,

.label-size-2,

.label-size-3,

.label-size-4,

.label-size-5{font-size:100%;opacity:10;}

اضغط على حفظ وشاهد النتيجة.

ملاحظة: الشفرة CSS السابقة لا تعمل إلا مع سحابة ولن تعمل مع القائمة.