آموزش نحوه قرار دادن جعبه کد در نوشته های وردپرس

ی

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

در این آموزش از پایگاه دانش پرگاس انفورماتیک قصد معرفی افزونه ای کاربردی را داریم که با استفاده از آن قادر خواهید بود کدهای برنامه نویسی با هر زبان برنامه نویسی اعم از html, css, php ، جاوا اسکریپت و غیره را به صورت کد شده و مرتب در قالب باکس نمایش دهید و به راحتی از آن ها در نوشته های وردپرس استفاده کنید. اگر در جستجوی روشی هستید که کدهای برنامه نویسی را در مطالب وردپرس نمایش دهید تا انتهای مقاله همراه ما باشید.

آموزش نحوه نوشتن کد در وردپرس با استفاده از افزونه قرار دادن کد در وردپرس

نام افزونه ای که قصد معرفی آن را داریم Crayon Syntax Highlighter می باشد که در مخزن وردپرس ثبت شده است و تاکنون بیش از ۵۰۰۰۰ نصب فعال داشته است و موفق به کسب امتیاز ۴.۷ از بازخوردهای ارسال شده توسط کاربران شده است. از این افزونه کاربردی می توان به عنوان بهترین افزونه قرار دادن کد در وردپرس استفاده کرد. برای استفاده از این افزونه ابتدا روی دکمه زیر کلیک نمایید تا وارد صفحه افزونه در مخزن وردپرس شوید و آن را دانلود نموده و سپس با استفاده از آموزش نحوه نصب و کار کردن با افزونه ها در وردپرس این افزونه را در سایت خود نصب و فعال سازی نمایید.

در ادامه بخوانید:
آموزش رفع خطای forbidden 403

 دانلود افزونه Crayon Syntax Highlighter

پس از نصب و فعال سازی این افزونه کاربردی همانند تصویر زیر به منوی تنظیمات‹ Crayon رفته و همانطور که مشاهده می کنید تنظیمات افزونه را بر اساس سلیقه خود برای نمایش کدهای برنامه نویسی در وردپرس سفارشی سازی کنید.

نوشته های وردپرس

قالب:

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

فونت:

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

معیارها:

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

  • با فعال نمودن گزینه ارتفاع قادر به تعیین اندازه دلخواه برای ارتفاع خواهید بود تا در صورت بیشتر بودن حجم کدها از این مقدار باکس مربوط به نمایش کد اسکرول شده و محتوای طولانی در نوشته ایجاد نشود.
  • با فعال نمودن گزینه عرض قادر به انجام این کار به صورت افقی خواهید بود تا در صورت طولانی بودن خط یکی از کدها محتوای صفحه زیاد اشغال نشود.
  • با فعال نمودن گزینه فاصله از سمت چپ، راست، بالا و پایین قادر به در نظر گرفتن فاصله ای به عنوان حاشیه خواهید بود تا از هر طرف نمایش کد در وردپرس روی باکس نمایش اعمال شود.
  • با استفاده از گزینه تراز افقی قادر به تراز کردن باکس کد به انتخاب خود در مرکز نوشته، سمت چپ یا راست خواهید بود تا ظاهر و جلوه منظم تری برای این باکس ایجاد شود.
در ادامه بخوانید:
تغییر رمز عبور وردپرس برای همه کاربران

نوشته های وردپرس

تولبار:

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

خطوط:

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

دیگر تنظیمات این افزونه کاربردی به توضیحات خاصی نیاز نخواهد داشت و کاملاً گویا می باشند. حال تنظیمات را ذخیره کرده و به بخش ویرایش یکی از مطالب خود مراجعه نمایید. مشاهده خواهید کرد که همانند تصویر زیر در ویرایشگر دکمه ای اضافه شده است که برای اضافه کردن کدها می توانید از آن استفاده نمایید.

نوشته های وردپرس

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

نوشته های وردپرس

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

در ادامه بخوانید:
قرار دادن نقشه گوگل مپ در سایت

نوشته های وردپرس

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

از کارشناسان پرگاس انفورماتیک مشاوره تخصصی بگیرید

نرم افزار باشگاه مشتریان, طراحی سایت اختصاصی، نرم افزار مالی سپیدار

۵۶ ۲۸۴ ۲۸۴ (۰۲۱)