بسم الله الرحمن الرحيم
والصلآة والسلآم على اشرف الانبياء والمرسلين سيدنا محمد عليه وعلى اله افضل الصلآة واتم التسليم
السلآم عليكم ورحمة الله وبركاته
تلوين وتغيير شكل صندوق الاوسمه او ( التسميات ) في بلوجر - Coloring and change the labels in blogger
صندوق
التسميات ضمن أدوات blogger يوفر طريقتين للعرض ’قائمة وسحابة‘ وتعتمد
السحابة في الظهور إلى عدد المرات التى استخدمت فيها نفس التسميه أو ما هو
عدد التدوينات داخل كل تسميه، ومنها تلاحظ في حالة تفعليها أن هناك أحجام
مختلفة لكل تسميه فالتسميات التى تحتوي على أكبر عدد من التدوينات ظهرت بخط
كبير والعكس...
وغالبا
نحن لا نستطيع التحكم في شكل تلك التسميات كتغيير حجمها مثلاً أو تحديد
لون لكل مجموعة تسميات وذلك لعدم وجود خيارات لذلك عند تهئيه الأداه من
عناصر الصفحة، لكن هناك طريقة للتخصيص لو علمت ما هي محددات CSS التى تتحكم
في ذلك الصندوق
 |
مثال |
حسننا لنبدأء :
لتلوين وتغير شكل صندوق الاوسمه او ( التسميات ) في بلوجر اتبع الاتي :
- ادخل الى مدونتك > ثم لوحة التحكم
- ادخل على القالب لكي نضيف له الكود
- انسخ هذا الكود وضعه قبل : ]]></b:skin>
.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; }
.cloud-label-widget-content {
وهو محدد الصندوق الذي يتضمن روابط التسميات، وفيه قمت بالتوسيط ولك حرية إعطائه أي خصائص أخرى كخلفية مثلاً أو غيرها.
.cloud-label-widget-content a {
روابط التسميات وفيها غيرت نوع الخط وجعلته سميك أما الخاصية white-space بالقيمةnowrap وضعتها
لتحكم أفضل في المساحات البيضاء فأنا لا أريد عندما يكون هناك تسميات
طويلة أن تظهر في سطرين بسبب ضيق المساحة وهو الأمر الظاهر في جميع
المدونات التى تعرض السحابة على وضعها الإفتراضي مما يشوه شكل التسميات
وتنسيقها، فهذه الخاصية تجعل كل تسميه مهما كانت طويلة تظهر كاملة في سطر
ولا تنكسر حتى وإن أدى ذلك الى خروجها عن مساحة صندوق التسميات.
.cloud-label-widget-content span {
للفصل بين كل تسميه وأخرى عن طريق الهوامش الداخليه.
.label-size
التسميات
تظهر في 5 أحجام مختلفة فكما قلنا أنه إذا زادت عدد التدوينات داخل نفس
التسميه تظهر بخط كبير، تبدأ من 1 وهو الأصغر ويطبق على التسميات التى
تحتوي على أقل عدد من التدوينات وينتهي بالرقم 5 وهو أكبرهم ويظهر للتسميات
التى تحتوى على أكبر عدد، وقد ميزت كل مجموعة بلون مختلف مع تعديل أحجام
الخطوط.
هذا كل شيء :)
إرسال تعليق
جميع الردود تعبّر عن رأي كاتبيها فقط. حريّة النقد والرد متاحة لجميع الزوار بشرط أن لا يكون الرد خارج نطاق الموضوع وأن يكون خال من الكلمات البذيئة. تذكّر قول الله عز وجل (مَا يَلْفِظُ مِن قَوْلٍ إِلاَّ لَدَيْهِ رَقِيبٌ عَتِيد).
EmoticonClick to see the code!
To insert emoticon you must added at least one space before the code.