جاري تحميل ... مدونة ابو جبه

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

إعلان في أعلي التدوينة

بلوجر

إنشاء التسميات و عرضها بتنسيقي السحابة و القائمة

الكثير من المدونات تحتاج إلى إنشاء أقسام لإدراج الموضوعات المختلفة تحتها حتى يسهل على الزائر الكريم الوصول إلى ما يبحث عنه و خصوصاً في المدونات ذات المواضيع الكثيرة متشعبة التصنيف. و للقيام بهذه المهمة على أتم وجه أضافت بلوجر إضافة " التسميات " أو " Labels " لإدراج موضوعات مدونتك تحت أقسام أو تسميات عدة تقوم أنت باختيار عناوينها حسبما يروق لك.

كنا قد تحدثنا في وقت سابق عن كيفية إنشاء تسمية جديدة أو اختيار تسمية تم إنشاؤها في وقت سابق لإدراج موضوع معين تحتها٬ ستجد هذا الموضوع مذكوراً باختصار في تدوينة سابقة بعنوان " داخل صندوق كتابة الرسائل في بلوجر " يمكنك الاطلاع عليها.

بالنسبة للتسميات يتم عرضها في بلوجر بطريقتين : السحابة و القائمة و لكن قد لا تعجبك الإضافة الأساسية لبلوجر٬ لذلك سنعرض بإذن الله في تدوينتنا اليوم تنسيقين لطريقتي العرض اللتين ذكرناهما اختر منهما ما تحب و ما يناسب مدونتك.

هيا بنا إلى الجانب العملي :


نستعين بالله أولاً قبل كل شئ.


1-      أولاً لابد و أن تكون موضوعات مدونتك مدرجة فعلياً تحت تسميات. إن لم يكن٬ قم بتسمية أقسام مدونتك و أدرج موضوعاتك تحتها كما ذكرنا بالأعلى و ذلك بالاستعانة بالله أولاً ثم بالتدوينة بعنوان : داخل صندوق كتابة الرسائل في بلوجر.

2-      بعد ذلك قم باختيار طريقة عرض التسميات إما القائمة و إما السحابة كما ذكرنا و ذلك بإضافة أداة " التسميات " من داخل " التخطيط " من داخل لوحة تحكم بلوجر الخاصة بمدونتك - كما بالصورة رقم " 1 ".
محمود جبه



3-      قم بالدخول إلى لوحة تحكم بلوجر الخاصة بمدونتك.

4-      قم بالبحث عن الوسم التالي :





5-      قم بإضافة أحد الكودين التاليين فوق الوسم السابق حيث أن الكود الأول يخص عرض " السحابة " و الثاني يخص عرض " القائمة ".



أولاً : كود العرض بطريقة " السحابة " :






مع مراعاة الآتي :


  • " #F3F7FF " : عبارة عن كود لون خلفية أزرار التسميات. قم بتغييره بما يناسبك.
  • " #5A7997 " : عبارة عن كود لون إطار أزرار التسميات . قم بتغييره بما يناسبك.
  • " 13px " : عبارة عن حجم خط التسميات. قم بتغييره بما يناسبك.
  • " 20px " : عبارة عن درجة استدارة زر التسميات وستجده مكرراً ثلاث مرات. قم بتغييره بما يناسبك.
  • " center " : تعني أن الكتابة في مركز الزر. قم باستبداله بـ " right " أو " left " إذا أردت الكتابة على اليمين أو اليسار على الترتيب.
  • " color: #000 " : عبارة عن كود لون خط التسميات. قم بتغييره بما يناسبك.
  • " color: #fff " : عبارة عن كود لون خط التسميات عند المرور على الزر بالماوس. قم بتغييره بما يناسبك.
  • " background: #000 " : عبارة عن كود لون خلفية الزر عند المرور عليه بالماوس. قم بتغييره بما يناسبك.


و يكون شكل التسميات كما بالصورة :


محمود جبه


ثانياً : كود العرض بطريقة " القائمة " :



مع مراعاة الآتي :


  • " #F3F7FF " : عبارة عن كود لون خلفية أزرار التسميات. قم بتغييره بما يناسبك.
  • " 13px " : عبارة عن حجم خط التسميات. قم بتغييره بما يناسبك.
  • " center " : تعني أن الكتابة في مركز الزر. قم باستبداله بـ " right " أو " left " إذا أردت الكتابة على اليمين أو اليسار على الترتيب.
  • " 132px " : عبارة عن عرض زر التسميات. قم بتغييره بما يناسبك.
  • " #5A7997 " : عبارة عن كود لون إطار أزرار التسميات . قم بتغييره بما يناسبك.
  • " 5px " : عبارة عن درجة استدارة زر التسميات وستجده مكرراً ثلاث مرات. قم بتغييره بما يناسبك.
  • " color: #000 " : عبارة عن كود لون خط التسميات. قم بتغييره بما يناسبك.
  • " background: #fff " : عبارة عن كود لون خلفية الزر عند المرور عليه بالماوس. قم بتغييره بما يناسبك.
  • " color: #1455c0 " : عبارة عن كود لون خط التسميات عند المرور على الزر بالماوس. قم بتغييره بما يناسبك..


و يكون شكل التسميات كما بالصورة :


محمود جبه

الوسوم:

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

إرسال تعليق

إعلان في أسفل التدوينة

إتصل بنا

نموذج الاتصال

الاسم

بريد إلكتروني *

رسالة *