تغيير شكل العناوين و التنسيق العددي و الاقتباس ببلوغر

تغيير شكل العناوين و التنسيق العددي و الاقتباس ببلوغر

هل تريد ان تضفي حلة جديدة لموقعك و تزينه باخر الاضافات ? هل مللت من شكل التنسيق العددي الخاص بموقعك و كذلك شكل الاقتباس و العناوين ? اذا ما عليك الا اتباع الشرح التالب من مدونة المجرة .

تغيير شكل العناوين و التنسيق العددي و الاقتباس ببلوغر

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

شكل العناوين

العناوين المقصود بها هنا Headings اي اوسام h1 و h2 الى h6 و التي تكون موجودة في تحرير الموضوع في العالى بالضبط القائمة المندسلة الكتوب عليها عادي و لتغيير شكلها من ابتدائي الى احترافي اتبع الخطوات التالية :


  1. توجه الى بلوغر .
  2. ثم قالب .
  3. ثم تحرير HTML .
ثم ابحث عن الوسم ]]></b:skin> ثم ضع الكود التالي فوقه او ضعه بين <style></style> فوق </head>


.post h3 {
background-color: #eee;
border-bottom: 4px solid #FC5400;
display: block;
font-weight: normal;
line-height: 38px;
margin: 20px 0;
min-height: 40px;
padding: 0 10px;
}
.post h4::before {
color: #4fba6e;
content: "\f058";
float: right;
font: 22px fontawesome;
margin-left: 5px;
}
.post h4 {
color: #333;
text-align: right !important;
margin:20px 0;
}
لاضافة الكود عليك تحديد الجملة التي تريد منها عنوان ثم اختر هل تريدها كعنوان فرعي او ثانوي .
تغيير شكل التنسيق العددي :

شكل التنسيق العددي

ربما التنيسق العددي لا يحتاج لتعريف لانه هو ترتيب الجل حسب الترتيب العددي اي من 1 الى اخر عدد تريده . لاضافة الكود عليك بالطريقة التالية :


  1. توجه الى بلوغر .
  2. ثم قالب .
  3. ثم تحرير HTML .
ثم ابحث عن الوسم ]]></b:skin> ثم ضع الكود التالي فوقه او ضعه بين <style></style> فوق </head>


.post ol{
counter-reset:li;
list-style: none;
*list-style: decimal;
margin-right:0;
padding-right:0
}
.post ol li:before {
background-color:#446FAA;
color: #fff;
content: counter(li, decimal);
counter-increment: li;
font: bold 14px serif;
margin: 0 0 10px;
padding: 5px 3px !important;
position: absolute;
right: -9px;
text-align: right;
text-indent: 6px;
top: -5px;
width: 20px;
}
.post ol li:after {
border-color: transparent #446FAA transparent transparent;
border-style: solid;
border-width: 5px 5px 0 0;
content: "";
height: 0;
position: absolute;
right: 17px;
top: -5px;
width: 0;
}
.post ol li{
position:relative;
margin:0 15px 20px 0 !important;
padding:4px 10px 4px 5px !important;
list-style:none;
*list-style: decimal;
border-bottom:1px solid #e2e3e2;
background-color:#f2f2f2;
text-indent:14px;
}

شكل الاقتباس :


شكل الاقتباس

الاقتباس هو لتفريق الموضوع عن الاكواد و هو من الاشياء التي يقيم عليها الزائر الموضوع . اذن لتغيير نفس الشئ اتبع الخطوات التالية :


  1. توجه الى بلوغر .
  2. ثم قالب .
  3. ثم تحرير HTML .
ثم ابحث عن الوسم ]]></b:skin> ثم ضع الكود التالي فوقه او ضعه بين <style></style> فوق </head>

/*اقتباس*/blockquote::before,blockquotc::before,blockquoth::before,blockquotb::before,blockquotw::before {color: #fff;font: bold 26px/34px serif;height: 34px;margin: 0 0 0 -10px;position: absolute;top: 0;width: 100%;}blockquotc::after,blockquoth::after,blockquotb::after,blockquotw::after {color: #fff;font: bold 14px/34px "droid arabic kufi",georgia;position: absolute;right: 5px;text-align: right;top: 0;width: 100%;}blockquote,blockquotc,blockquoth,blockquotb,blockquotw {background-color: #333;color: #fff;direction: ltr !important;display: block;font: 14px/1.8em georgia;margin: 20px auto 5px;max-height: 300px;overflow: auto;padding: 40px 10px 10px;position: relative;text-align: left !important;width: 94%;}blockquote {background-color: #eee !important;color: #444444 !important;}blockquote::before {background-color: #446FAA; content: "\00a0 Code";}blockquotc::before {background-color: #FC5400; content: "\00a0 CSS";}blockquotc::after {content:"]]\003e\003c/b:skin\003e يضاف فوق";}blockquoth::before {background-color: #0065FD; content: "\00a0 JS";}blockquoth::after {content:"\003c/head\003e يضاف فوق";}blockquotb::before {background-color: #4FBA6E; content: "\00a0 JS";}blockquotb::after {content:"\003c/body\003e يضاف فوق";}blockquotw::before {background-color: #F00004; content: "\00a0 HTML/JavaScript";}blockquotw::after {content:"يوضع في آداة";}

الى هنا يكون موضوعنا قد انتهى الى موضوع اخر ان شاء الله . 


Hm

أيمن بوكلاس : المملكة المغربية, 16 سنة مدون وومقدم حلقات على اليوتيوب في طريق الاحتراف أنشأت هذه المدونة لأشارككم خبرتي المتواضعة في هذا المجال وأتمنى أن أتوفق في ذلك.

10 التعليقات

اضغط لإضافة التعليقات
Achraf Attal
الكاتب
3 يناير، 2016 9:00 ص ×

شكرا لك اخي لاعطائي فرصة التدوين بموقعك

رد
avatar
ayoub bouzid
الكاتب
3 يناير، 2016 9:01 ص ×

شكرا لكم جميعا

رد
avatar
أنس السعيدي
الكاتب
3 يناير، 2016 9:08 ص ×

لكن عند الرغبة في تحديد كود ووضعه في صندوق الإقتباس كيف نفعل ذلك ؟؟

رد
avatar
3 يناير، 2016 9:13 ص ×

عندما تضع كود الإضافة أو أي كود كما كان تقوم بالضغط على هذه الإضافة وقم بوضع الكود في التدوينة
صورة من الإضافة
http://cdn.top4top.co/p_5601z301.png

رد
avatar
Achraf Attal
الكاتب
3 يناير، 2016 9:14 ص ×

صحيح اخي ايمن

رد
avatar
3 يناير، 2016 9:54 ص ×

إذا لم يعمل معك فأعلم إن قالبك فيه كود إقتباس خاص به

رد
avatar
Emad Eyad
الكاتب
4 يناير، 2016 1:01 ص × أزال أحد مشرفي المدونة هذا التعليق.
avatar
Achraf Attal
الكاتب
4 يناير، 2016 5:04 ص ×

يا اخي انا الذي وضعت التدوينة و قلي هل انت من هئ الكود بالطبع لا الكود مهئ من طرف مدونة كن مدونة و الكود مأخوذ من المدونة و شكرا اذا اخي حاول ان تتأكد من صحة المعلومة

رد
avatar
ويب العربي
الكاتب
7 أغسطس، 2016 1:55 م ×

شكرا لك اخي العزيز

رد
avatar

جميع الحقوق محفوظة لموقع المجرة للمعلوميات © 2016-2017

Designed By :Rida El Abbadi