تغيير التعداد الرقمى فى بلوجر الى شكل احترافى و أنيق جدا

تغيير التعداد الرقمى فى بلوجر

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

السلام عليكم و رحمة الله و بركاته

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

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

معاينة الترقيم

1. هذا الترقيم جميل و أنيق و جميل
2. لا توجد هذه الطريقة الا فى موسوعة بلوجر
3. الطريقة هدية من موسوعة بلوجر الى زوارها الكرام
4. هذه معاينة للطريقة.

تطبيق الترقيم فى مدونتك

قم بالذهاب الى قالب و من ثم تحرير html

قم بالبحث عن الكود التالى

]]></b:skin>

أضف الكود التالى بعده مباشرة

<style>
.widget .post-body ol li {
margin: 5px 0;
padding: 0;
line-height: 1.5;
font-family: GESSTwoMediumRegular,ge_hiliregular;
LINE-HEIGHT: 1.8 !important;
FONT-SIZE: 14PX;
position: relative;
display: block;
padding: .4em 1.75em .4em 2em;
margin: 0.3em 0;
background: rgba(238, 238, 238, 0.55);
color: #444;
text-decoration: none;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: .3em;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.widget .post-body ol li:before{
        content: counter(li);
        counter-increment: li;
        position: absolute;
        right: -1.3em;
        top: 50%;
        margin-top: -1.3em;
        background: #FDD761;
        height: 2.5em;
        width: 2.5em;
        line-height: 2em;
        border: .3em solid #fff;
        text-align: center;
        font-weight: bold;
        -moz-border-radius: 2em;
        -webkit-border-radius: 2em;border-radius: 2em;
        -webkit-transition: all .3s ease-out;
        -moz-transition: all .3s ease-out;
        -ms-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
      }
      .widget .post-body ol li a{
        font-family: ge_hiliregular;
        color: #444;margin-right: 10px;
      }
      .widget .post-body ol li:hover:before{
        -webkit-transform: rotate(720deg);
        -moz-box-shadow: 0 0 10px #0f3,0 0 30px #0f3,0 0 50px #0f3,0 1px 3px #000!important;
        color: #444;
      }
      .widget .post-body ol li:hover{
        background: #eee;
        color: #444;
      }
      .widget .post-body ol{
        counter-reset:li;
        list-style:none outside none;
        font:15px &quot;trebuchet MS&quot;,&quot;lucida sans&quot;;
        padding:0;
        margin-right:20px;
        margin-top:0;
        margin-bottom:0
      }
      .widget .post-body ol{
        list-style:none outside none;
        font:15px &quot;trebuchet MS&quot;,&quot;lucida sans&quot;
      }
    </style>

و بعد ذلك قم بحفظ القالب

الخطوة الأخيرة هى اضافة الترقيم الى التدوينة , كل ما عليك هو كتابة ما تريد أن يظره فى الترقيم ثم تضغط على زر الترقيم فى محرر التدوينات كما فى الصورة التالية

1

2

و ابعد الانتهاء من كتابة التدوينة اضغط على نشر أو Publish و ستجد الترقيم كما فى مدونتى.

.
.
.
.
.
.
.
.
 و فى الختام سلام و قبل السلام اترك تعليق تشجيعا للقائمين على المدونة.