كنت ابحث عن طريقة لعرض الشيفرة المصدرية source code بالمدونة و كنت أستخد سابقا إحدا الإضافات التي تدعم ذلك على محرري العزيز Window Live Writer لكنها لم تعد تعمل الأن على النسخة الجديدة :(.
لذا بحثت من جديد و لفت نظري إضافة تستخدمها كثير من المدونات التقنية إسمها SyntaxHighlighter و الجميل فيها أنها إضافة جافاسكريبت أي تستطيع تستخدنها في أي مكان ومثال على ذلك.
لذا قررت أن أستخدمها عند و أنا كما تعلمون أستضيف مدونتي على بلوغرز و هنا سأشرح كيفية إضافتها إلى بلوغر .
- فور دخولك لبلوغر إختر التخطيط –> تحرير HTML .
- خذ نسخة إحتياطية من القالب عن طريق حفظ قالب.
- ثم إبحث عن نهاية وسم Tag </head>d قبل نهايته ضع ما يلي .
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shThemeDefault.css' rel='stylesheet' type='text/css'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<!-- add brushes here -->
<script type='text/javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>
- الأن بعد إضافة هذا الكود في رأس القالب نريد أن نضيف ما تسميها هذ الإضافة ب فرشاة كي تلون الكود حسب اللغة المستخدمة و ضع هذه الكود مكان التعليق
<!-- add brushes here -->
- بالنسبة لي وضعت الفراشي التالية و هي ل HTML , XML , C#, Python , javascript و بإمكانك الإختيار من مجموعة واسعة من الفراشي هنا .
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/>
- بكل بساطة تستطيع أن تضيف الكود الذي تريده لكن إذا أردت أن تضيف كود HTML تأكد أن يكون مشفرا يعني بدل > تضع < و ما إلى ذلك من علامات HTML و هناك خدمة بسيطة تفعل ذلك على هذا الموقع فتضع الكود الذي تريد عرضة هنا و تحولة.
لتكون نتيجة عرض ما الدالة التالية المكتوبة بجافا سكريبت
<pre class="brush:js">
function Sum(var1, var2)
{
var sum = var1 + var2;
//Return value;
return sum;
};
</pre>
كما يلي
function Sum(var1, var2)
{
var sum = var1 + var2;
//Return value;
return sum;
};
و أريد أن أذكر أن لن تستطيع أن ترى النتيجة النهائية إلا بعد نشر التدوينة .
