شرح تلوين شكل صندوق الاسمية والتسميات في بلوجر [ اضافة مميزة ]

بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
كل عام وانتم بألف خير وعيد سعيد على جميع الامة العربية والاسلمية بأجمعها




:::::::::::::
نبدأ بأذن الله تلوين الكلمات في صدوق التسميات
بألوان زاهية وبراقة تعطي طابع مميز على المدونة
صندوق التسميات ضمن أدوات blogger يوفر طريقتين للعرض ’قائمة وسحابة‘ وتعتمد السحابة في الظهور إلى عدد المرات التى استخدمت فيها نفس التسميه أو ما هو عدد التدوينات داخل كل تسميه، ومنها تلاحظ في حالة تفعليها أن هناك أحجام مختلفة لكل تسميه فالتسميات التى تحتوي على أكبر عدد من التدوينات ظهرت بخط كبير والعكس...

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




ادخل الى مدونتك > ثم لوحة التحكم
ادخل على القالب لكي نضيف له الكود
انسخ هذا الكود وضعه قبل : ]]>

رمز Code:
.cloud-label-widget-content {
text-align: center;
}
.cloud-label-widget-content a {
font-family: Arial, sans-serif;
font-weight: bold;
white-space: nowrap;
}
.cloud-label-widget-content span {
padding: 0 5px 0 5px;
}
.label-size-1 a { font-size:14px; color:#2F2F2F; }
.label-size-2 a { font-size:16px; color:#11AA23; }
.label-size-3 a { font-size:18px; color:#588EFF; }
.label-size-4 a { font-size:22px; color:#DA484B; }
.label-size-5 a { font-size:26px; color:#3B5998; }

لتغير الوان التسميات داخل الصندوق
رمز Code:
.label-size-1 a { font-size:14px; color:#2F2F2F; }
.label-size-2 a { font-size:16px; color:#11AA23; }
.label-size-3 a { font-size:18px; color:#588EFF; }
.label-size-4 a { font-size:22px; color:#DA484B; }
.label-size-5 a { font-size:26px; color:#3B5998; }


.cloud-label-widget-content {



وهو محدد الصندوق الذي يتضمن روابط التسميات، وفيه قمت بالتوسيط ولك حرية إعطائه أي خصائص أخرى كخلفية مثلاً أو غيرها.
cloud-label-widget-content a {
روابط التسميات وفيها غيرت نوع الخط وجعلته سميك أما الخاصية white-space بالقيمةnowrap وضعتها لتحكم أفضل في المساحات البيضاء فأنا لا أريد عندما يكون هناك تسميات طويلة أن تظهر في سطرين بسبب ضيق المساحة وهو الأمر الظاهر في جميع المدونات التى تعرض السحابة على وضعها الإفتراضي مما يشوه شكل التسميات وتنسيقها، فهذه الخاصية تجعل كل تسميه مهما كانت طويلة تظهر كاملة في سطر ولا تنكسر حتى وإن أدى ذلك الى خروجها عن مساحة صندوق التسميات.
.label-size
التسميات تظهر في 5 أحجام مختلفة فكما قلنا أنه إذا زادت عدد التدوينات داخل نفس التسميه تظهر بخط كبير، تبدأ من 1 وهو الأصغر ويطبق على التسميات التى تحتوي على أقل عدد من التدوينات وينتهي بالرقم 5 وهو أكبرهم ويظهر للتسميات التى تحتوى على أكبر عدد، وقد ميزت كل مجموعة بلون مختلف مع تعديل أحجام الخطوط.
.cloud-label-widget-content span {
للفصل بين كل تسميه وأخرى عن طريق الهوامش الداخليه.

الموضوع الاصلي

:strongly::strongly:
شرح تلوين شكل صندوق الاسمية والتسميات في بلوجر [ اضافة مميزة ]

:strongly::strongly:







أكثر...