- النجم الذهبي

آخر الأخبار

الأربعاء، 4 يوليو 2018

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


طريقة تركيب الإضافة سهلة جدا و بسيطة كل ما عليك هو متابعة الشرح بالأسفل .

هذا تأطير للعناوين :

و هذا للترقيم :
  1. نص تجريبي لتأطير الترقيم
  2. نص تجريبي لتأطير الترقيم
  3. نص تجريبي لتأطير الترقيم
  4. نص تجريبي لتأطير الترقيم

طريقة التركيب :

أولا تقوم بالدخول الى لوحة التحكم بلوجر, ثم القالب, ثم تحرير Html بعد ذلك تضغط من الكيبورد على زر Ctrl + F ليظهر لك مربع البحث تم سنقوم بالبحث عن هذه الكلمة : ]]></b:skin> و تقوم بوضع الكود التالي فوقها مباشرة .
.post ul{list-style:inherit}
.post ol{font-family:droid arabic naskh, sans-serif;counter-reset:li;list-style:none;*list-style:decimal;margin-top:6px;padding-left:0}
.post ol li{    font-family: droid arabic naskh, sans-serif;position:relative;margin:0 0 8px 15px!important;padding:6px 30px 8px 7px!important;list-style:none;background:rgba(245,245,245,0.58);text-indent:14px;box-shadow:15px 9px 7px -12px rgba(0,0,0,0.16),0 3px 6px 0 rgba(0,0,0,0.12)}
.post ol li:before{font-family: droid arabic naskh;font-weight: 600;content:counter(li);counter-increment:li;position:absolute;right:5px;width:28px;padding:1.5px;margin:0 0 10px 0;padding 4px!important;color:#fff;background:linear-gradient(to bottom right,#0045a6,#0658cb)!important;text-indent:6px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 1px 1px rgba(0,0,0,.0.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1);box-shadow:0 1px 1px rgba(0,0,0,0.07),inset 0 0 10px rgba(0,0,0,0.08),inset 0 0 0 1px rgba(0,0,0,0.19);border-radius:15px}
.post ol li:after{content:'';border:10px solid transparent;border-left-color:#000;float:left;margin-top:3px}
.post ol li:hover:after{margin-left:5px;border-left-color:#0045a6;transition:all 0.3s ease-out}
/*================
/* PostStyle Title
================== */
.post h3{border-bottom:5px solid #0045a6;padding:6px 15px;background:#eee;margin:9px 0;border-radius:3px;font-size:19px;font-family: droid arabic naskh ;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}
.post h4{border-right:7px solid #0045a6;border-left:7px solid #0045a6;font-family:droid arabic naskh;padding:10px 15px;background:#f7f7f7;margin:10px 0;border-radius:5px;box-shadow:0 3px 6px rgba(0,0,0,0.16),0 3px 6px rgba(0,0,0,0.23)}
.rtl .post-body ul li{margin-right:40px;list-style:circle;padding-right:10px}
.ltr .post-body ul li{margin-left:40px;list-style:circle;padding-left:10px}
.post-body ul li:hover{list-style:disc}
blockquote{margin:5px 17px;padding:7px;color:#fff;background:rgba(47, 70, 107, 1)} ul,ol,dl{list-style-position:inside;font-weight:normal;list-style:none}

طريقة التعديل :

في حال كنت تريد التعديل على الألوان أو الخط فقم بتغيير ما يلي :

  1. اللون الأخضر هو كود اللون غيره باللون الذي يناسبك . الألون : هنا
  2. اللون الأحمر هو إسم الخط  و يمكنك تغييره.

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

إرسال تعليق

Post Top Ad


ضع اعلانك هنا