بهترین قالب فروشگاهی فروش فایل سین مارکت همین الان بخر !

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

آموزش وردپرس, طراحی سایت 119 ۱۴ تیر ۱۳۹۹ 3

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

همان‌طور که می‌دانید در ادیتور یا همان ویرایشگر وردپرس در زبانه‌ی متن این قابلیت بصورت پیش‌فرض در این سیستم مدیریت محتوی قرار داده شده است که کاربران می‌توانند با زدن دکمه‌ی code دستور و یا کد مورد نظر خود را برای نمایش، درون محتوا قرار دهند اما بزرگترین مشکل استفاده از حالت پیش فرض نمایش کد در وردپرس که ناشی از عدم استایل دهی به خروجی این قابلیت توسط طراحان در بیشتر پوسته‌های وردپرس هست این مسئله است که کدها و دستورات بر خلاف انتظار و خواسته‌ی کاربران بدون هیچ تفاوتی با متن نوشته به نمایش در می‌آیند که برای رفع این مشکل و نمایش صحیح کد در وردپرس تاکنون افزونه‌های بسیار زیادی هم‌چون SyntaxHighlighter در این رابطه توسط توسعه دهندگان وردپرس طراحی گردیده است.

در این نوشته از وبسایت سین مارکت بنابر درخواست تعدادی از کاربران آموزشی را آماده ساخته‌ایم که به کمک آن و بدون نصب هیچ افزونه‌ای می‌توانید کدها و دستورات مورد نظر خود را  با استفاده از ویرایشگر وردپرس بصورت متفاوت و مجزاء از متن‌های نوشته برای کاربران خود به نمایش در بیاورید. پیش از هر چیز پیشنهاد ما به شما این است در صورتی که نیاز شما به این امکان بصورت تخصصی می‌باشد و تمایل دارید مانُور بیشتری بر روی این قابلیت داشته باشید از افزونه‌های قدرتمندی که برای نمایش کد در وردپرس آماده گردیده اند همانند افزونه SyntaxHighlighter استفاده نمایید و در صورتی که تمایل به نصب افزونه و بالابردن حجم خروجی صفحه ندارید در این نوشته از وبسایت سین مارکت همراه ما باشید.

برای نمایش کد در وردپرس ابتدا فایل شیوه‌نامه (style.css) پوسته وردپرس خود را برای ویرایش باز کرده و خط‌های زیر را به آخر این فایل اضافه کنید. در استایل زیر سعی شده است نسبت به نمایش صحیح کدها در بیشتر پوسته‌ها مقادیر بصورت استاندارد تعریف شود و در صورت عدم نمایش صحیح می‌توانید نسبت به ثابت کردن نحوه‌ی نمایش در مقادیر زیر تغییرات ایجاد کنید:

code, pre {
direction:ltr;
width: 90%;
display: block;
color: #333333;
overflow:auto;
background: #fcfcfc url(img/pre_code.png) left top repeat-y;
border: 1px solid #f2f2f2;
padding: 10px 28px;
margin: 10px 0px;
max-height: 200px;
line-height: 120%;
}

توجه: این تصویر باید در پوشه تصاویر پوسته آپلود شود، که در استایل نام پوشه تصاویر img می‌باشد.

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

مدیر سایت

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

امتیاز :
نمایش کد در وردپرس بدون نیاز به نصب افزونه
4.25 از 4 رای

مطالب مشابه

نظرات

قوانین ارسال دیدگاه :

چنانچه دیدگاهی توهین آمیز باشد و متوجه اشخاص مدیر، نویسندگان و سایر کاربران باشد تایید نخواهد شد.

چنانچه دیدگاه شما جنبه ی تبلیغاتی داشته باشد تایید نخواهد شد.

چنانچه از لینک سایر وب سایت ها و یا وب سایت خود در دیدگاه استفاده کرده باشید تایید نخواهد شد

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

چنانچه دیدگاهی بی ارتباط با موضوع آموزش مطرح شود تایید نخواهد شد.

برای ارسال دیدگاه شما باید وارد سایت شوید.