چگونه می توان به راحتی کد را در سایت وردپرس خود نمایش داد

آیا می خواهید کد را در پست های وبلاگ وردپرس خود نمایش دهید؟ اگر سعی کرده اید کدی مانند متن معمولی اضافه کنید ، وردپرس آن را به درستی نمایش نمی دهد.

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

در این مقاله ، ما روش های مناسب برای نمایش آسان کد در سایت وردپرس خود را به شما نشان خواهیم داد. ما روش های مختلفی را به شما نشان خواهیم داد ، و شما می توانید روشی را انتخاب کنید که متناسب با نیاز شما باشد.

How to easily display code in WordPress posts

روش 1. نمایش کد با استفاده از ویرایشگر پیش فرض در وردپرس h4>

این روش برای مبتدیان و کاربرانی که نیازی به نمایش اغلب کد ندارند توصیه می شود.

به سادگی پست وبلاگ یا صفحه ای را که می خواهید کد در آن نمایش داده شود ویرایش کنید. در صفحه ویرایش پست ، یک بلوک کد جدید به پست خود اضافه کنید.

Add code block to your WordPress posts

اکنون می توانید قطعه کد را در قسمت متن بلوک وارد کنید.

Add code to your blog post

پس از آن ، می توانید پست وبلاگ خود را ذخیره کرده و پیش نمایش آن را ببینید تا بلاک کد را مشاهده کنید.

PHP code displayed in WordPress

بسته به طرح زمینه وردپرس شما ، بلوک کد ممکن است در وب سایت شما متفاوت به نظر برسد.

روش 2. نمایش کد در وردپرس با استفاده از یک افزونه h4>

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

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

  • به شما امکان می دهد هر کدی را به راحتی در هر زبان برنامه نویسی نمایش دهید
  • کد را با برجسته سازی نحو و شماره خط نمایش می دهد
  • کاربران شما می توانند به راحتی کد را مطالعه کرده و از آن کپی کنند

ابتدا باید پلاگین SyntaxHighlighter Evolution . برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .

پس از فعال شدن ، می توانید پست وبلاگی را که می خواهید کد را در آن نمایش دهید ویرایش کنید. در صفحه ویرایش پست ، بلوک “SyntaxHighlighter Code” را به پست خود اضافه کنید.

SyntaxHighlighter code block

اکنون یک کد کد جدید در ویرایشگر پست مشاهده خواهید کرد که می توانید کد خود را در آن وارد کنید. پس از افزودن کد ، باید تنظیمات بلوک را از ستون سمت راست انتخاب کنید.

SyntaxHighlighter code block settings

ابتدا باید زبان را برای کد خود انتخاب کنید. پس از آن ، می توانید شماره های خط را خاموش کنید ، شماره خط اول را ارائه دهید ، هر خطی را که می خواهید برجسته کنید و ویژگی را خاموش کنید تا لینک ها قابل کلیک شوند.

پس از پایان کار ، پست خود را ذخیره کرده و بر روی دکمه پیش نمایش کلیک کنید تا در عمل مشاهده شود.

Code displayed with syntax highlighting

این افزونه دارای تعدادی طرح و طرح زمینه رنگی است. برای تغییر طرح زمینه رنگ ، باید به صفحه تنظیمات »SyntaxHighlighter بروید.

SyntaxHighlighter settings

از صفحه تنظیمات ، می توانید یک تم رنگی انتخاب کرده و تنظیمات SyntaxHighlighter را تغییر دهید. برای دیدن پیش نمایش بلوک کد در پایین صفحه ، می توانید تنظیمات خود را ذخیره کنید.

Code block preview

استفاده از SyntaxHighlighter با ویرایشگر کلاسیک

اگر هنوز از عنوان ویرایشگر قدیمی وردپرس کلاسیک ، سپس در اینجا نحوه استفاده از افزونه SyntaxHighlighter برای افزودن کد به پست های وبلاگ وردپرس خود آورده شده است.

به سادگی کد خود را در داخل پرانتز با نام زبان قرار دهید. به عنوان مثال ، اگر می خواهید کد PHP را اضافه کنید ، آن را به این صورت اضافه خواهید کرد:

[php]
private function get_time_tags () {
$ time = get_the_time ('d M، Y')؛
بازگشت $ time ؛
}
؟>
[/ php]

به همین ترتیب ، اگر می خواهید یک کد HTML اضافه کنید ، سپس آن را به دور کد کوتاه HTML می پیچید:

[html]
نمونه پیوند
[/ html]

روش 3. نمایش کد در وردپرس به صورت دستی (بدون افزونه یا مسدود کردن) h4>

این روش برای کاربران پیشرفته است زیرا به کار بیشتری احتیاج دارد و همیشه آنطور که در نظر گرفته شده کار نمی کند.

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

ابتدا باید کد خود را از طریق یک رمزگذار نهادهای HTML ابزار. این نشانه گذاری کد شما را به موجودیت های HTML تغییر می دهد ، که به شما امکان می دهد کد را اضافه کنید و فیلترهای پاکسازی وردپرس را دور بزنید.

اکنون کد خود را در ویرایشگر متن کپی و جایگذاری کنید و آن را در اطراف برچسب های

 

و قرار دهید.

Adding code manually in classic editor

کد شما به این شکل است:

  
& lt؛ p & gt؛ & lt؛ a href = & quot؛ /home.html"؛ & gt؛ این یک پیوند نمونه است & lt؛ / a & gt؛ & lt؛ / p & gt؛

اکنون می توانید پست خود را ذخیره کرده و پیش نمایش کد را در عمل مشاهده کنید. مرورگر شما نهادهای HTML را تبدیل می کند و کاربران می توانند کد صحیح را مشاهده و کپی کنند.

Manually displaying code in WordPress

امیدواریم این مقاله به شما کمک کند یاد بگیرید چگونه می توانید به راحتی کدها را در سایت وردپرس خود نمایش دهید. همچنین ممکن است بخواهید لیست نهایی نکات ، ترفندها و هک های وردپرس مورد جستجو .

اگر این مقاله را دوست داشتید ، لطفاً در کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .

منبع:
https://www.wpbeginner.com/wp-tutorials/how-to-display-raw-codes-in-your-wordpress-blog-posts/.

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