إزاي أو كيف تضع اكواد مثل: HTML في مدونات بلوجر وتنسيقها بسهولة تعلم الطريقة
مرسلة بواسطة
المدير
إزاي أو كيف تضع اكواد مثل: HTML في مدونات بلوجر و تنسقها بسهولة ويسر
هذه الطريقة تساعد المدون وخصوصا مدونين بلوجر في تنسيق مواضيعهم أو تدويناتهم بشكل جميل
يرضي المدون أولاً ويريح ويسهل علي القارئ ثانيا حيث أن
المشكلة انه لو انك وضعت الكود مباشرة في الموضوع، فسيتم معالجته على انه كود HTML و يتم
ترجمته من طرف المتصفح. و لن يظهر كما تريده. لذلك و لحل هذه المشكلة، اتبعني وهتعرف الطريقة
المشكلة انه لو انك وضعت الكود مباشرة في الموضوع، فسيتم معالجته على انه كود HTML و يتم
ترجمته من طرف المتصفح. و لن يظهر كما تريده. لذلك و لحل هذه المشكلة، اتبعني وهتعرف الطريقة
الصحيحة لحلها
1) كتابة اكواد HTML بداخل مواضيع بلوجر:
اولا اكتب الكود الذي تريد، ثم قم بنسخه
و الصقه في هذا الموقع:
إضغط هنا
1) كتابة اكواد HTML بداخل مواضيع بلوجر:
اولا اكتب الكود الذي تريد، ثم قم بنسخه
و الصقه في هذا الموقع:
إضغط هنا
ستظهر لك صفحة بهذا الشكل .... ضع الكود المراد إضافتة في الموضوع
ثم اضغط على كلمة encode أسفل المربع مثل ما هو مبيّن في الصورة:
بعد ذلك ينتج لك كود جديد (معدّل من السابق).
إنسخه، و ضعه في الموضوع عادي جدا،
و عندما تنشر الموضوع سيظهر الكود بشكل جيد للزوار و بدون اي مشكل.
مثال عن النتيجة:
<hr>
<p>Arab publishers Blog</p>
2) تنسيق الاكواد في مدونة بلوجر:
عندما تضع الاكواد هكذا فقط، فانها قد تبدوا غيرمريحة للبعض، خاصاً لو أن الاكواد التي تريد
بعد ذلك ينتج لك كود جديد (معدّل من السابق).
إنسخه، و ضعه في الموضوع عادي جدا،و عندما تنشر الموضوع سيظهر الكود بشكل جيد للزوار و بدون اي مشكل.
مثال عن النتيجة:
<hr>
<p>Arab publishers Blog</p>
2) تنسيق الاكواد في مدونة بلوجر:
عندما تضع الاكواد هكذا فقط، فانها قد تبدوا غيرمريحة للبعض، خاصاً لو أن الاكواد التي تريد
ان تضعها في الموضوع تحتوي علي عشرات الأسطر .. إذاً ستأخذ مساحة كبيرة جداً في التدوينه
،
فما رأيك ان نقوم بتنسيقها وتحسين مظهرها و نضعها بداخل اطار جميل ونحدد عرضة وأرتفاعه،
إتبع الشرح لتعرف كيف
- والأن ادخل الى تحرير HTLM في لوحة تحكم مدونتك.
- والأن ادخل الى تحرير HTLM في لوحة تحكم مدونتك.
ولكن قبل اي شئ يفضل بحفظ نسخة من القالب تحسباً لأي
خطأ ... وبعد الأنتهاء من حفظ نسخة من القالب
قم بالبحث عن الكود المظلل التالي :]]></b:skin>
و اضف قبله هذا الكود :
#code {
padding:5px;
border:1px dashed;
background-color:#a4ddff;
direction: ltr;
text-align: left;
height:100px;
overflow-y:scroll;
}
* خلفية اطار الكود
* ارتفاع اطار الكود
و قم بالحفظ.
ما قمنا به الان هو وضع ستايل اطار الكود، حتى نستخدمه في كل مرة نريد فيها وضع كود بكل يسر.
و الان اكتب موضوعا جديدا، وضع الكود بالطريقة التي تعلمتها في المرحلة الاولى.
ثم اضغط على HTML في صندوق تحرير الموضوع.
ثم ابحث عن الكود الذي وضعته.
و اضفه بداخل اطار (خلية) مستعملا تنسيق الاطار الذي وضعناه.
مثل ما هو موضح في الصورة:
شرح اكثر لما قمنا به:
ضع الكود التالي قبل الكود الذي تريد وضه وتنسيقة في موضوعك
<div id="code">
<hr>
<p>Arab publishers Blog</p>
<hr>
<p>Arab publishers Blog</p>
ثم ضع هذا </div>
في نهاية الكود الذي تريد تنسيقة
لمشاهدة النتيجة اضغط هنا
الاشتراك في:
تعليقات الرسالة (Atom)
0 التعليقات:
إرسال تعليق