السلام عليكم ورحمه الله وبركاته
درس النهرضة هو تنسيق كود html فى المدونة بشكل جميل بعد ان تعبت جداا فى عمل هذا المجال وسوف ان ابحث عن هذا الاضافة فى بعض المنتديات والمدونات ولا اوجد حل تم بحمد لله تطوير فى القالب وجد هذا المشاكة ان بعض القالوب لا يوجد فيه كود تنسيق فى الموضوع بعد وتم اكتشاف هذا الكود الزى لا يضع فى مدونتى بعد ان وضعت الكود وعدلت على الكود الحمد لله اشتغل تمام انا حبيت اعمل موضوع علشان بعض الاخوة اضحاب المدونات لا تعرف ان تنسيق الكود فى المدونة بشكل جميل ورئع للعمل فى بعض الزوار
هذا بعد التنسيق شكل الكود دخل المدونة
وتم تنسيق الكود بشكل جميل بعد التعديل بشكل المناسب الى مدونتى وسوف اشرح لكم طريقه الاضافة لتستفادو من هذا الاضافة
قبل بداء العمل ارجو منكم التقضير فى العمل بعد ان تجد الكود مناسب اليك
اضف تعليق حدة لو بكلمة شكر
طريقة التركيب :
بلنسبة للواجهة الجديدة : - بالنسبة للواجهة القديمة :
لاتنسى اخد نسخة احتياطية للقالب لاتنسى اخد نسخة احتياطية للقالب
1.لوحة التحكم 1 -.لوحة التحكم
2.القالب 2 - .تخطيط أوتصميم
3. ثم تحريرhtml;. ثم 3 - تحريرhtml.
4.متابعة 4-.توسيع القالب
5.توسيع القالب
ثم ابحث عن الكود التالي :بالضغط على alt+f
بعد المتابعه على هذا الصورة
ابحث عن الكود التالى دخل مدونتك
post blockquote
أذا لم تجده أبحث عن هذا
.post-body blockquote
واذا تم اعثور على اى كود منهم
سوف يكون بهذا الشكل
.post blockquote p{margin:.5em 0}
المهم انك سوف تجد الكود و بعده قوسين بينهم لغة css الصق مكانه الكود الذى سوف تختاره4-انسخ الكود الذى الذى تريده من الاشكال الـ5 الموجودة فى الاسفل والصقه مكان الكود الذى وجدته
- الشكل رقم 1
الكود الخاص به
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
الشكل رقم 2
الكود الخاص به
blockquote { margin: 1em 3em; color: #999; border-left: 2px solid #999; padding-left: 1em; }
الشكل رقم 3
الكود الخاص به
blockquote { background-color: #666; color:#fff; padding: 15px; margin: 1em 40px; -moz-border-radius-topleft: 15px; -webkit-border-top-left-radius: 15px; -moz-border-radius-topright: 15px; -webkit-border-top-right-radius: 8px; -moz-border-radius-bottomleft: 15px; -webkit-border-bottom-left-radius: 15px; }
الشكل رقم 4
الكود الخاص به
.post blockquote { margin : 0 20px; padding: 10px 20px 25px 20px; background : #9FCFFF ; font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia; color : #484848; border: 5px dashed #fff; } .post blockquote p { margin: 0; padding-top:10px; }
الشكل رقم 5
الكود الخاص به
.post blockquote{ margin : 0 20px; padding: 50px 30px 50px 30px; background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmpOgbieLyOp2pvcBPcJGj2lEQ5-6RPNGBI2oLzVeL0u_Tfjc6Oatru-iBzkOfnZAW-HcSlnPu-lsUNIAUoTOLVRvtUVy0fL_fHeDo-CHWHQzM0wIgQ9F2HrBR5nGusEzbDpoiUj2J7k0/s1600/BLOCK1-TOP.gif) no-repeat top; font: bold italic 1em Helvetica, verdana; color : #000; } .post blockquote div{ background : #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjFZQIJc7T7d0P6trU-nY1Q8FqdM5Qc7U7NdDdhFtnbK_nPrfMxF9vPjUjTtfjef_Hkw9fNVt8YI9ou3ridOXcO1R9gNF3f7gT-1gH1OWl5esGVkOr_Pz8HqsCBmX6IE9P_9POVxAg0rA/s1600/BLOCK1-BOTTOM.gif) no-repeat bottom; padding-bottom: 50px; } .post blockquote p { margin: 0; padding-top:10px; }
5- بعد لصق الكود مكان الكود الذى وجدته اذهب الى نشر وضع كود html فى رسالة جديدة ثم حدد بالماوس على الكود واضغط على علامة اداة الاقتباس كما موضح فى الصور وقم بالمعاينة .
 |
| اداة الاقتبا |
ملاحوظة هام : بعض القالوب لا يوجد فيه هذا الكود الاعله الا وهو
.post-body blockquote
اذا لا يوجد اى كود ابحث عن الكود التالى
]]>
وضع الكود التالى فوقه مباشر
.post blockquote {
border: 1px solid #CCC;
padding: 10px;
height: 100px;
overflow-y: scroll;
background: #F2F2F2;
border-radius: 5px;
box-shadow: inset 0 1px 10px #CCC;
}
اذا حبيت تغيير شكل خفيه الكود ابحث عن الكود الا بالون الاحمر #F2F2F2
ثم غير بالون المناسب الى مدونتك
ثم حفظ القالب وان شاء الله سوف يتم تنسيق الكود دخل الموضوع
لا تنسو تعليقاتكم
اولا احب ان اشكر الاستاذ عبد الغفور صاحب مدونة كنبيوتر
واشكر الاستاذ عثمان صاحب معهد خبراء بلوجر
للمساعدة على عمل التنسيق
وبفضل الله تعاله تم عمل الموضوع
بشكل جميع
مبروك الاضافة.
و اى مشكلة يرجى ابلاغى بها عن طريق التعليق على الموضوع.
ليست هناك تعليقات:
إرسال تعليق