تغيير شكل القوائم المرقمة داخل المشاركات

بسم الله الرحمن الرحيم

تغيير شكل القوائم المرقمة داخل المشاركات

اليوم طلب مني قائمه الخطواط الخاصه بالمدونه فأحببت ان افيدكم بها بأختصار القائمه تقوم ترتيب الاسطر تلقائيا تستطيع زياده الاسطر 

 الاضافة من تصميم حسام تفاحي

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

1. ادا وضعت هده الاضافة من قبل قم بحدفها اولا
2. ادهب الى لوحة التحكم ثم تحرير "HTML"
3. بحث عن كلمة واضف فوقه مباشراً الكود التالي:

/* CSS PostStyle by Arabtiknia*/ .post ul{list-style:inherit}.post ol{counter-reset:li; list-style: none;*list-style: decimal;margin-top:6px;padding-left:0} .post ol li{position:relative;margin:0 0 8px 15px !important;padding:4px 30px 8px 5px !important;list-style:none; *list-style: decimal;background: rgba(245, 245, 245, 1); /* background color of each element */ border:1px solid #EBEBEB;text-indent:14px;} .post ol li:before{content: counter(li); counter-increment: li; position: absolute; right: 5px; width: 20px; margin: 0 0 10px 0; padding: 4px !important; color: #fff; background: #446FAA; 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.1),inset 0 0 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(0,0,0,.1); border-radius: 2px;} .post ol li:after{content: ''; border: 10px solid transparent; border-left-color: #446FAA; float: left; margin-top: 3px;} .post ol li:hover:after {margin-left: 5px;border-left-color: #446FAA;transition: all 0.3s ease-out;}

المصدر عرب التقنية

ملحوظة مهمة

1.  لتغير الون عليك بتغير هذا الكود #446FAA
2.  استخدم صفحة اكود الوان من هنا