آموزش و خبری, وردپرس

نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر

نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر
5/5 - (3 امتیاز)

نمایش کد برنامه نویسی در المنتور بدون فرمت کد

المنتور یک افزونه محبوب برای وردپرس است که به شما امکان می‌دهد صفحات وب را به صورت بصری و بدون نیاز به کدنویسی طراحی کنید. با این حال، ممکن است مواقعی پیش بیاید که نیاز به نمایش کد برنامه نویسی در صفحات خود داشته باشید.

در اینجا چند روش برای نمایش کد برنامه نویسی در وردپرس و صفحه ساز المنتور بدون فرمت کد وجود دارد:

روش اول: استفاده از ویجت “HTML”

  1. ویجت “HTML” را از پنل سمت چپ المنتور به صفحه خود اضافه کنید.
  2. کد برنامه نویسی خود را در کادر ویرایشگر HTML قرار دهید.
  3. برای نمایش کد بدون فرمت، از تگ <pre> استفاده کنید.

به عنوان مثال:

HTML

<pre>
function myFunction() {
  // کد برنامه نویسی خود را اینجا قرار دهید
}
</pre>

نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر
نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر

با دقت و احتیاط از کد استفاده کنید.content_copy

روش دوم: استفاده از افزونه “Code Syntax Highlighter”

  1. افزونه “Code Syntax Highlighter” را از مخزن وردپرس نصب و فعال کنید.
  2. ویجت “Code” را از پنل سمت چپ المنتور به صفحه خود اضافه کنید.
  3. زبان برنامه نویسی خود را از منوی کشویی “زبان” انتخاب کنید.
  4. کد برنامه نویسی خود را در کادر ویرایشگر قرار دهید.

روش سوم: استفاده از افزونه “Highlight.js”

  1. افزونه “Highlight.js” را از مخزن وردپرس نصب و فعال کنید.
  2. کد زیر را به فایل functions.php تم خود اضافه کنید:

PHP

add_action('wp_enqueue_scripts', 'enqueue_highlightjs');

function enqueue_highlightjs() {
  wp_enqueue_style('highlightjs', 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css');
  wp_enqueue_script('highlightjs', 'https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js');
}

با دقت و احتیاط از کد استفاده کنید.content_copy

  1. کد برنامه نویسی خود را در یک بلوک کد قرار دهید و کلاس hljs را به آن اضافه کنید.

به عنوان مثال:

HTML

<pre class="hljs">
function myFunction() {
  // کد برنامه نویسی خود را اینجا قرار دهید
}
</pre>
نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر
نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر

با دقت و احتیاط از کد استفاده کنید.content_copy

نکات:

  • برای نمایش کد با خطوط شماره‌گذاری شده، می‌توانید از تگ <pre> و ویژگی line-numbers استفاده کنید.

به عنوان مثال:

HTML

<pre line-numbers>
function myFunction() {
  // کد برنامه نویسی خود را اینجا قرار دهید
}
</pre>
نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر
نمایش کد برنامه نویسی در المنتور و وردپرس بدون فرمت کد و نمایش کدهای برای کاربر

با دقت و احتیاط  از کد استفاده کنید.content_copy

  • می‌توانید از افزونه‌های دیگر مانند “Pretty Code” یا “Crayon Syntax Highlighter” برای نمایش کد با فرمت‌های مختلف استفاده کنید.

با استفاده از روش‌های بالا می‌توانید کد برنامه نویسی خود را به طور صحیح و بدون فرمت کد در صفحات المنتور خود نمایش دهید.

به جذابیت و اهمیت این مطلب هم دقت کنید
طراحی فروشگاه با وردپرس مشابه دیجی کالا

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

3 × 3 =