تیم پرانتز
تیم پرانتز
خواندن ۵ دقیقه·۲ سال پیش

افزودن کد css به یک سایت وردپرسی (حرفه ای)

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

اضافه کردن کد css کار ساده ای هست که هر طراحی سایتی حداقل یکی دو روش برای انجام اون سراغ داره.

توی این مقاله قصد داریم درباره اکثر روش های اضافه کردن کد های css به یک سایت وردپرسی صحبت کنیم تا ببینیم کدوم روش ها برای کدوم شرایط میتونه مناسب باشه. خب بریم سراغ اصل مطلب


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

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

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

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

نکات مهم این روش:

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

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


افزونه های جانبی برای افزودن کد css

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


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


افزودن کد css از طریق فایل های سایت یا قالب

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

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

اما این نکته را در نظر بگیرید که تمام کد های خود را در یک فایل با حجم بالا قرار ندهید که باعث کند تر شدن سایتتان میشود.

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

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


افزودن کد های css در بخش پیشرفته المنتور

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

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

نکات مهم در این روش:

سعی کنید کد های css را در همان المانی که تحت تاثیر هست قرار دهید. زیرا اگر آن المان حذف شود یا تغییری داشته باشد ممکن است کد های شما حذف شود.

پس اگر کد شما قرار است فقط روی یک المان تاثیر داشته باشد. این روش میتواند مفید باشد.


افزودن کد از طریق کد های سفارشی المنتور

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

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

مثلا میتوانید کدی را قرار دهید که فقط در صفحه جزئیات محصول نمایش داده شود.


نکات مهم این روش:

اگر تعداد کمی فایل در این بخش ایجاد کنید میتواند مناسب باشد. اما اگر تعداد کد های زیادی را در این بخش قرار دهید که اکثرشان دارای شرط های یکسان هستند.(یعنی چندین کد از این بخش در یک صفحه اجرا میشود) میتواند به ضرر سایتتان باشد زیرا تعداد فایل هایی که فراخوانی میشود زیاد میشوند. استفاده درست از این بخش میتواند مفید باشد.

نکته مهم پایانی در تمامی روش ها

علاوه بر بهینه بودن برای سرعت سایت، باید مدیریت آن را نیز در نظر بگیرید. اگر بخواهید تغییری در کدهایتان بدهید، باید بدانید که در کدام قسمت قرار دارد.

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

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

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

نتیجه گیری:

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

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

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




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