آیا نیاز به نمایش انواع تکه کدهای css، php، html و… در بین مطالب وردپرس دارید؟
اگر کدها را مانند متن معمولی در مطالب خود قراردهید قطعا به درستی نمایش داده نخواهند شد. وردپرس در زمان ذخیره یک مطلب متن های شما را فیلتر و پاکسازی می کند. اینکار برای ایجاد امنیت بیشتر رخ میدهد تا از هک کردن سایت شما جلوگیری شود.
در این مقاله روش های درج انواع تکه کدهای مختلف در مطالب سایت را بررسی می کنیم. ۳ روش برای نمایش کد در مطالب وردپرس را به شما در این مقاله معرفی خواهیم کرد.
موارد استفاده نمایش کد در مطالب وردپرس
اگر نیاز به نوشتن مطالب وبلاگ در موضوعات فنی یا ایجاد اسناد برای محصولات و خدمات خود هستید، نشان داده قطعه کدها واقعا برای شما کاربری خواهد بود. کاربران شما امکان کپی کردن کد و استفاده از آن را نیز دارند.
با این حال، نمایش کد در وردپرس چندان ساده نیست.
وردپرس قطعه کدها را به عنوان کد اجرایی شناسایی می کند و سعی میکند آن را به جای متن در وب سایت شما نشان دهد. همچنین کد را به طور کامل و دقیق نمایش نمی دهد تا وب سایت شما منجر به خطا شود.
علاوه بر این، وردپرس از چندین فیلتر به عنوان اقدامات امنیتی استفاده می کند . محتوا را فیلتر می کند تا از قراردادن کد مخرب توسط هکرها به ویرایشگر محتوا و هک وب سایت شما جلوگیری کند.
با این حال، روش های مختلفی برای نمایش کد در وردپرس وجود دارد.
روش ۱) نمایش کد با استفاده از ویرایشگر گوتنبرگ
این روش برای مبتدیان و کاربرانی که نیازی به نمایش کدهای مکرر ندارند توصیه می شود.
به سادگی پست وبلاگ یا صفحه ای را که می خواهید کد را در آن نمایش دهید ویرایش کنید. در صفحه ویرایش پست، یک بلوک کد جدید به پست خود اضافه کنید.
این روش برای مبتدیان و کاربرانی که نیازی به نمایش کدهای مکرر ندارند توصیه می شود.
در این روش می توانید به سادگی از بلوک کد در ویرایشگر گوتنبرگ داخل صفحه یا مطلبی که میخواهید کد خود را نمایش دهید استفاده کنید.
از بخش افزودن بلوک کلمه “کد” را جستجو کرده و ابزارک کد را به صفحه خود اضافه کنید.
حالا مانند تصویر بالا می توانید کد خود را در بخش مربوطه قرار دهید و از بخش تنظیمات ابزارک موارد دلخواه خود را تنظیم کنید. نوع نمایش جعبه کد بسته به قالب وردپرس شما امکان دارد متفاوت باشد.
روش ۲) نمایش کد با استفاده از افزونه
در این روش با استفاده از یک افزونه وردپرسی عملیات نمایش کد در وردپرس را انجام می دهیم. این روش برای افرادی که به صورت مکرر در مقالات خود از قطعه کدها استفاده می کنند توصیه می شود.
توجه : اگر برای نصب و فعال کردن افزونه در سایت وردپرسی خود با مشکل مواجه هستید، اصلا نگران نباشید؛ ما در مقاله آموزش نصب افزونه در وردپرس، سه روش نصب افزونه را به شما آموزش داده ایم. با استفاده از این مقاله راحت میتوانید افزونه خود را نصب و فعال کنید.
مزیت های استفاده از افزونه جهت نمایش قطعه کد در وردپرس:
- به شما این امکان را می دهد که به راحتی هر کدی را در هر زبان برنامه نویسی نمایش دهید.
- کدها را به صورت کاملا استاندارد و خط بندی شده نمایش دهید.
- کاربران شما می توانند به راحتی کد را مطالعه کرده و آن را کپی کنند.
ابتدا باید افزونه SyntaxHighlighter Evolved را نصب و فعال کنید.
مانند تصویر زیر میتوانید از بخش افزودن بلوک در صفحات و مطالب ابزارک مربوط به افزونه نصب شده را به صفحه خود اضافه کنید.
حالا بر روی ابزارک اضافه شده در صفحه کلیک کنید و کد مورد نظر خود را قرار دهید.
از سمت چپ صفحه که با کادر نارنجی رنگ مشخص شده است میتوانید نوع کد خود را مشخص نمائید. شما نیز میتوانید تنظیمات دیگری را از این بخش سفارش سازی نمائید. در نهایت تصویر خروجی را به شکل زیر مشاهده می کنید.
برای رفتن به تنظیمات اصلی این افزونه به مسیر تنظیمات >> syntaxhighlighter در داشبورد وردپرس خود مراجعه کنید.
از صفحه تنظیمات، می توانید یک تم رنگی را انتخاب کنید و تنظیمات SyntaxHighlighter را تغییر دهید.
میتوانید تنظیمات خود را ذخیره کنید تا پیشنمایش بلوک کد را در پایین صفحه ببینید.
همچنین برای نمایش کدها در مطالب وردپرس، این افزونه شورتکدهای مختلفی را به شما ارائه داده که در انتهای صفحه تنظیمات افزونه قابل مشاهده است. تنها کافی است شورتکد مورد نظر را کپی و از آن در مطالب خود استفاده نمائید.
روش ۳) نمایش کد به صورت دستی بدون استفاده از افزونه
استفاده از این روش کمی دشوارتر از روش های قبلی است و نیاز به کار بیشتری دارد. برای کاربرانی که هنوز از ویرایشگر کلاسیک قدیمی استفاده می کنند و می خواهند کد را بدون استفاده از افزونه نمایش دهند مناسب است.
ابتدا باید کد خود را با ابزارهای رمزگذاری آنلاین به موجودیت html تغییر دهید تا بتوانید فیلترهای وردپرس برای پاکسازی کدها را دور بزنید.
حالا کد خود را به شکلی که در تصویر زیر مشاهده میکنید داخل ویرایشگر کلاسیک قرار دهید.
اکنون می توانید پست خود را ذخیره کنید و نمونه کد خود را به شکل زیر در صفحه مربوطه مشاهده نمائید.
امیدواریم این مقاله وب سایت دایوپلاس به شما کمک کند تا یاد بگیرید چگونه به راحتی قعطه کدها را در سایت وردپرس خود نمایش دهید.
اگر این مقاله برای شما کارایی داشت نظر خود را ثبت نمائید و چنانچه برای استفاده از این امکان در وردپرس همچنان با مشکل مواجه هستید، مشکل خود را از بخش کامنت ها برای ما ارسال نمائید تا در رفع آن به شما کمک کنیم.