SyntaxHighlighter بدون افزونه

SyntaxHighlighter یک افزونه رایگان است برای نمایش کد در سایت با امکاناتی از قبیل تولبار کپی برداری و نمایش کد در صفحه مجزا و با قابلیت هوشمند شناسایی کدها و استایل دادن به کد برای برجسته شدن دستورات و توابع
این ابزار افزونه های رایگان برای وردپرس دارد مانند http://wordpress.org…taxhighlighter/
و آموزش زیر برای دوستانیست که علاقه دارند بدون افزونه امکان را به قالب اضافه کنند
نکته : در صورت استفاده از افزونه نیز موارد 3 و 4 این آموزش را جهت ست کردن افزونه با rtl  پیگیری کنید  
1. از نشانی زیر فایل زیپ شده SyntaxHighlighter را دانلود کنید
http://alexgorbatche….php?sh_2.0.278
2. فایل را آن زیپ کنید و از پوشه css فایل shCore.css را باز کنید
3. بعد از خط 21 یک اتینتر بزنید و وارد کنید

.syntaxhighlighter {direction:ltr;}

4. خط 164 تا 174 کد را بیابید یعنی

.syntaxhighlighter .toolbar a.item,
.syntaxhighlighter .toolbar .item
{
display: block;
float: left;
margin-left: 8px;
background-repeat: no-repeat;
overflow: hidden;
text-indent: -5000px;
}

علامت منفی را از قبل از 5000حط بر دارید یعنی

.syntaxhighlighter .toolbar a.item,
.syntaxhighlighter .toolbar .item
{
display: block;
float: left;
margin-left: 8px;
background-repeat: no-repeat;
overflow: hidden;
text-indent: 5000px;
}

5- فایل را ذخیره کنید و کل پوشه ها را به پوشه اصلی قالب خود منتقل کنید
6. فایل header.php  را باز کنید و کدهای زیر را واردش کنید

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shCore.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushBash.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushCpp.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushCSharp.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushCss.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushDelphi.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushDiff.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushGroovy.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushJava.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushJScript.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushPlain.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushPython.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushRuby.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushScala.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushSql.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushVb.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/scripts/shBrushXml.js"></script>
<link type="text/css" rel="stylesheet" href="<?php bloginfo('template_url'); ?>/styles/shCore.css"/>
<link type="text/css" rel="stylesheet" href="<?php bloginfo('template_url'); ?>/styles/shThemeDefault.css"/>
<script type="text/javascript">
SyntaxHighlighter.config.clipboardSwf = "<?php bloginfo('template_url'); ?>/scripts/clipboard.swf";
SyntaxHighlighter.all();
</script>

7. شما باید کدهایی که می خواهید در سایت نمایش دهید را از طریق ویرایشگر html و داخل تگ pre  با کلاس های brush: و نوع اسکریپت قرار دهید.
به عنوان مثال در زیر محل قرار گیری کدهای
جاوا اسکریپت
css
html
php
را به ترتیب مشاهده می کنید

<pre class="brush: javascript;">
محل قرار گیری کدهای جاوا اسکریپت
</pre>
<pre class="brush: css;">
محل قرار گیری کدهای css
</pre>
<pre class="brush: html;">
محل قرار گیری کدهای htm
</pre>
<pre class="brush: php;">
محل قرار گیری کدهای php
</pre>

نکته بجز قالب دیفالت (shThemeDefault.css) این مجموعه  قالبهای

• shThemeDjango.css
• shThemeEmacs.css
• shThemeFadeToGrey.css
• shThemeMidnight.css
• shThemeRDark.css

را هم دارد که برا استفاده از آنها کافیست در کدهای بالا بجای shThemeDefault.css هر یک از نامهایی که ذکر شد را قرار دهید
یعنی در

<link type="text/css" rel="stylesheet" href="<?php bloginfo('template_url'); ?>/styles/shThemeDefault.css"/>