كيفية إنشاء مربع ملاحظة أنيق رائع css في بلوجر مع تأثيرات متحركة

يبحث البعض من المدونين عن طريقة لاضافات مميزة يتم استخدامها اثناء كتابة المقال وتكون اضافات خفيفة لاتؤثر علي سرعة المدونة وتقدم شكل جميل للمقال وجذاب للمستخدم ولا تسبب اي شعور بالملل من قبل الزائر ,كما تعطي بعض الاحترافية وتمييز للمقال من جانب المستخدمين,اليوم سوف نوضح طريقة اضافة Css Notebox في بلوجر.

إنشاء مربع ملاحظة css في بلوجر

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

الشكل الاول

 كما يوجد في الصور 6 ملاحظات مضافة باكواد Css يتم اضافتها في القالب كالتالي

1- انتقل الي لوحة تحكم بلوجر 

2-المظهر⇽ تعديل Html

3- ابحث عن ]]></b:skin>

4-اضافة كود css فوق ]]></b:skin>

5- حفظ والانتقال الي المشاركات

6- اضافة الاكواد الخاصة بكل شكل من اشكال الملاحظات التالية في المشاركة في وضع Html

<div class="notes notes1">اكتب هنا اي جمله </div>

<div class="notes notes2">اكتب هنا اي جمله </div>

<div class="notes notes3">اكتب هنا اي جمله </div>

<div class="notes notes4">اكتب هنا اي جمله </div>

<div class="notes notes5">اكتب هنا اي جمله </div>

<div class="notes notes6">اكتب هنا اي جمله </div>

الشكل الثاني

 

كما يوجد في الصور العديد من اشكال الملاحظات مضافة باكواد Css يتم اضافتها في القالب كالتالي

1- انتقل الي لوحة تحكم بلوجر 

2-المظهر⇽ تعديل Html

3- ابحث عن ]]></b:skin>

4-اضافة كود css فوق ]]></b:skin>

5- حفظ والانتقال الي المشاركات

6- اضافة الاكواد الخاصة بكل شكل من اشكال الملاحظات التالية في المشاركة في وضع Html

<div class="note blue">اكتب هنا اي جمله</div>

<div class="note yellow">اكتب هنا اي جمله</div>

<div class="note">اكتب هنا اي جمله</div>

<div class="note red">اكتب هنا اي جمله</div>

<div class="colorbox purple">
اكتب هنا اي جمله</div>

<div class="colorbox blue">
اكتب هنا اي جمله</div>

<div class="colorbox green">
اكتب هنا اي جمله</div>

<div class="colorbox red">
اكتب هنا اي جمله</div>

<div class="colorbox orange">
اكتب هنا اي جمله</div>

— انتهي موضوع اليوم..انتظرو كل جديد

Gom3app1

يمكن لمتابعينا الاعزاء متابعتنا والتواصل معنا .

Facebook

whatsapp

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

موضوعات قد تهمك