هاك عرض كود على مدونات بلوجر Blogger


بسم الله


طريقة وضع هاك الكود على المدونات.
مثال:

هنا يدرج كود css أو سكريبت و غيره من الأكواد المعروفة،
حتى تمتاز عن باقي محتوى الرسالة.
و هذا مثال لعرض كود css

font-size : 13px;
line-height : 24px;
font-family : “Courier New”, “MS Sans Serif”, sans-serif, serif;
2

»»» قبل تحرير القالب يجب حفظ نسخة احتياطية منه لاستعادتها عند الضرورة.
»»» بعض الأكواد عرضتها كصورة لأنها تختفي في مدونة بلوغر لذا وجب كتابتها و هذا أفضل!
كما جرت العادة ندخل إلى لوحة تحكم مدونتنا ثم نضغط " تخطيط " بعده " تحرير Html " و نبحث (Ctrl+F لفتح نافدة البحث في المتصفح) على الكود :

و قبله أي فوقه مباشرة نضيف كود css الآتي :
i
.codeview {
margin : 15px 35px 15px 15px;
padding : 10px;
clear : both;
list-style-type : none;
background : #ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmBWW4UHFvgIQ1923Fw-NI5x1KfE1lGPNAokvOUOn3aMIfyQO3rBrw_qjoGRV67-19UF8qdXGKWQFzT7e5Lzg37Hl1R4IApEVkEKo9yj69oufMnvJmqzOPFnAB2aE4BxgEEGrWsiXfIqw/) no-repeat right bottom;
border-top : 1px solid #eeeeee;
border-right : 1px solid #cccccc;
border-bottom : 1px solid #cccccc;
border-left : 1px solid #eeeeee;
}
.codeview li {
font-size : 13px;
line-height : 24px;
font-family : “Courier New”, “MS Sans Serif”, sans-serif, serif;
color : #333333;
font-weight : normal;
margin : 0;
padding : 0;
}

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

» ثانيا : عند كتابة رسالة جديدة ، ندخل الكود المراد عرضه بين وسمي div كما يلي ...


وعند نشر الرسالة يظهر الكود في إطار كما في المثال المدرج في بداية الصفحة.

0 التعليقات:

إرسال تعليق

Twitter Delicious Facebook Digg Stumbleupon Favorites More