كيفية تنسيق عرض مواضيع المدونة بالصفحة الرئيسية بشكل متناسق وجذاب

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

صورة موضحة قبل التنسيق :

 

صورة موضحة بعد التنسيق

هل رأيتم ما اقصدة من هذه التدوينة ؟

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

شرح الأضافة والتغير :

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

الأن اذهب الى تحرير html واضغط على ctrl + f من لوحة المفاتيح الكيبورد لظهور خاصية البحث والأن ابحث عن هذا الكود :

 .post {
  margin: 0 0 $(post.margin.bottom) 0;
}

ملحوظة : هذا الكود يختلف من قالب الى اخر ولكن لا داعى للقلق ستجد بأولة .post { وبأسفلة margin: 0 0 $(post.margin.bottom) 0; ستجدة مشابهة 

الأن بعد الوصول الى الكود المطلوب سنضع هذا الكود قبل القوس :

text-align:justify;

بمعنى اننا سنضعة بهذا الشكل :

 .post {
  margin: 0 0 $(post.margin.bottom) 0;
text-align:justify;
}

وكما قولت ان هذا الكود يختلف من قالب الى اخر على حسب مصمم هذا القالب ولكنة متشابة لذلك ومن الممكن ان يكون الكود لديك هكذا :

.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}

اذا كان الكود السابق مثل ما الموجود بقالبك سنضع الكود هكذا :

 .post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
text-align:justify;
}

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