استفاده از رنگ کننده های کد در MVC و CkEditor

2/2/2016 MVC
3405

یکی  از رایج ترین نرم افزار هایی که برای رنگ کردن کد ها استفاده میشود SyntaxHighlighter  است .این پلاگین مستقیما بر روی کدهایی اثر میکند که در تگ <pre /> قرار گرفته باشند .

اما اگر برای ادیتور متن های خود CKEditor را به کار میبرید به سادگی نمیتواننید از این رنگ کننده کد -SyntaxHighlighter- استفاده کنید.

ادیتور متن CkEditor  برای ایجاد بلاک کد از تگ </pre > به همراه تگ </code > استفاده میکند که این امر استفاده از SyntaxHighlighter را برای نمایش بهینه از کد دچار مشکل میکند ، CkEditor عموما از دو تکنیک سمت سرور و سمت کلاینت برای این امر استفاده میکند اما به طریقه سمت کلایت  از ورژن 4.0 به بعد فراهم شده است .

این ادیتور برای سمت کلاینت از highlightjs استفاده میکند .

کافی است یا در زمان دانلود Ckeditor  اختصاصی این پلاگین را به آن اضافه کنید و یا به صورت دستی پس از دانلود به CkEditor  خود اضافه نمایید . توضیحات تکمیلی در این زمینه در این لینک میتوانید ببینید

، اما برای نمایش صحیح در صفحه ای که قصد ارائه کد به کاربران و یا بازدید کنندگان از سایت را دارید لازم  است از این کد  ها استفاده نمایید.

<head>
    ...
    <link href="ckeditor/plugins/codesnippet/lib/highlight/styles/default.css" rel="stylesheet">
    <script src="ckeditor/plugins/codesnippet/lib/highlight/highlight.pack.js"></script>
</head>

البته میتوانید فایل highlightjs.pack.js  را مستقیما از سایت آن دانلود کنید پس از اضافه کرده به پروژه در head لینک کنید  و یا از CDN  آن استفاده نمایید