درج و رنگی کردن کد در مطالب بلاگ بیان :: دنیا آی تی
Donya IT

دنیا آی تی - donyait

دنیایی متفاوت از آی‌تی را با دنیا آی‌تی تجربه کنید

درج و رنگی کردن کد در مطالب بلاگ بیان

۹۶/۰۴/۰۹
۳

 

یکی از امکاناتی که در انتشار مطالب قابل استفاده است، درج کد (عموما برنامه نویسی) در مطالب است، مانند این:

#include <iostream>
using namespace std;
int main () {
  cout << "Hello World!";
  return 0;
}

 

روش درج کد

برای درج یک کد عمومی باید در ویرایش‌گر پیش فرض از لیست انتخاب شونده formats (حالت) گزینه preformatted (تکه‌کد) را انتخاب کنید.

دقت کنید کنید که متن شما در حال ویرایش رنگی نمی‌شود ولی در هنگام نمایش به صورت خودکار رنگی می‌شود.

در بقیه ویرایشگرها هم دکمه‌هایی شبیه به ویرایش‌گر پیش فرض برای انتخاب گزینه preformatted وجود دارد، این گزینه به سادتی متن را بین <pre> و </pre> قرار می‌دهد.

 

تنظیمات مربوط به رنگی کردن

همانطور که گفته شود زبان مربوط به رنگی کردن با حالت نیمه خودکار تغیین می‌شود، اما در صورت لزوم با تغییر class تگ <pre> می‌توانید، رفتار آنرا تغییر دهید.

  • class="noprettify" باعث می‌شود که متن رنگی نشود (البته هنوز در قاب مخصوص کد باقی ماند)
  • زبان‌های عمومی مثل c، cpp، csharp، java، php‌ و xml، html و ... به صورت اتوماتیک تشخیص داده می‌شوند. اما اگر قصد دارید از زبان‌های دیگر استفاده کنید و حالت اتوماتیک، زبان را به درستی تشخیص نمی‌دهد، برای مشخص کردن دقیق زبان می‌توانید از class="lang-js" استفاده کنید. زبان‌های مجاز فعلی عبارتند از: apollo، clj، css، go، hs، lisp، lua، ml، n، proto، scala، sql، tex، vb، vhdl، wiki، xq و yaml
  • در صورتیکه می‌خواهید کد css درج کنید، برای رنگی کردن درست کد، حتما class="lang-css" را اضافه کنید.
  • در صورتیکه می‌خواهید کنار هر خط، شماره خط نیز درج کنید، کلاس linenums را نیز اضافه کنید. در صورتیکه قسمتی از یک فایل را درج کرده‌اید و می‌خواهید شماره خطوطی از عددی غیر از ۱ (مثلا ۳۵) شروع شوند، کافیست به شکل linenums:35 از این امکان استفاده کنید.

درج کد کوتاه در بین متن

نمونه کد کوتاه در بین متن:  اینتکه کد  style="clear:both;"  یک نمونه است.

برای درج کدهای کوتاه در بین متن کافی است، آن را در بین <code> و </code> قرار دهید.

متاسفانه فعلا در ویرایشگر پیش‌فرض دکمه خاصی برای این کار وجود ندارد، به این ترتیب می‌توانید از طریق «ویرایش کد»، این تگ را به صورتی دستی وارد کنید، یا از دیگر ویرایشگرها استفاده کنید. در ویرایشگر CKEditor از قسمت «سبک» گزینه «Computer Code» را انتخاب کنید. 

 

درج و رنگی کردن کد در مطالب بلاگ بیان

نظرات (۳)

سامورایی بیدمشک خور
سلام، میتونین آموزش استفاده از فونت Awesome رو در بلاگ بیان بگین؟
ممنون.
۲۳ تیر ۹۵، ۱۷:۵۱
پاسخ توسط: محمد (مدیر)
این مطلب در نظرسنجی قرار دارد.
سلام
خسته نباشین
ممنون از مطالب خوبتون
یه سوالی دارم ؟
فرم قسمت درخواست نویسندگی رو چجوری ساختین؟
می تونید یه آموزش هم راجب اون بدین
باتشکر
۱۹ تیر ۹۵، ۱۳:۴۱
پاسخ توسط: محمد (مدیر)
سلام، چشم قرار میدم.
علی (نویسنده)
این مطلب عالی بود،
میشه آموزش استایل دادن به متن رو هم بذارید؟!
۱۴ تیر ۹۵، ۱۹:۰۴
پاسخ توسط: محمد (مدیر)
قرار میدم بزودی
ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">