گاهی اوقات لازم است تا ما استایل و کد های CSS سفارشی را به پیشخوان وردپرس سایت خود اضافه بکنیم مثلا ما یک شرکت طراحی وب سایت هستیم و مشتری ما تاکید بسیار زیادی بر این دارد که ظاهر پیشخوان و محیط مدیریت وردپرس سایت متفاوت باشد مثلا فونتی اختصاصی داشته باشد و اندازه فونت های ان بیشتر باشد و دارای افکت ها انیمیشن های متنوع باشد، در این وضعیت ما 2 راه داریم :1- استفاده از افزونه های تغییر ظاهر پیشخوان وردپرس 2- نوشتن و اعمال کردن کد های CSS سفارشی
ما براحتی میتوانیم در چند دقیقه همه کد های CSS سفارشی خود را برای پیشخوان وردپرس بنویسیم بدون استفاده از هیچ افزونه، همچنین این امر هیچ ارتباطی با اینکه کدام قالب وردپرس در حال حاظر در سایت شما فعال میباشد ندارد و حتی با تغییر دادن قالب و انتقال کد های شما بازم هم تغییرات شما در سایت باقی می ماند.
این کدنویسی معمولا برای تغییر ظاهر سایت و گاهی دادن و نظم و ترتیب به پیشخوان سایت انجام میشود شما میتوانید چیدمان ها، سطر و ستون ها،فونت ها و عکس ها بکگراند و فرم ها و… را کاملا سفارشی سازی بکنید. برای اعمال این کد های سفارشی شما نیاز به داشتن دانش کدنویسی CSS دارید
هیچ فرقی نمیکند که در سایت شما الان در حال حاظر شما از کدام قالب وردپرس استفاده میکنید اما کد هایی که ما مینویسیم در سورس قالب قرار میدهیم. ولی هر زمان که ما قالب خودمون رو تغییر دادیم میتوانیم با انتقال دادن همون کد ها از قالب قبلی به قالب وردپرس جدید باز هم این تغییرات را اعمال بکنیم.
نحوه اعمال کد های سفارشی به پیشخوان وردپرس
نحوه اعمال استایل CSS سفارشی به پیشخوان وردپرس:
با استفاده از File Manger هاستتون به مسیر زیر بروید:
wp-content/themes/*themename*/
در مسیر بالا به جای عبارت*themename* اسم قالبی که الان در سایت شما فعال میباشد قرار میگیرد در این پوشه ای که الان هستند یک فایل هست به نام Functions.php و این فایل را برای ویرایش کردن باز بکنید و در آخر این فایل کد زیر را اضافه بکنید:
[codesyntax lang=”php”]
function webmaster_custom_css() {
echo '<style>
کد سی اس اس خود را اینجا قرار دهید
</style>';
}
add_action('admin_head', 'webmaster_custom_css');[/codesyntax]
به این صورت شما هر کدی که بنویسید در پیشخوان وردپرس شما اعمال میشود.
روش اعمال کد های CSS برای پیشخوان وردپرس با افزونه Add Admin CSS :
:
افزونه های زیادی برای اینکار وجود دارند افزونه ای که در زیر قرار داده ایم نسبت به سایر افزونه ها بسیار بهینه تر بوده . شما میتوانید بعد از نصب کردن افزونه زیر و اضافه کردن کد های CSS سفارشی خودتان در پیشخوان وردپرس شروع به سفارشی سازی کردن این بخش بکنید. از مزیت های افزونه ایک ه در زیر معرفی شده است این میباشد که شما میتوانید آدرس یک فایل CSS را به این افزونه بدهید و در این صورت نیازی به نوشتن کد ها در تنظیمات این افزونه نیست . مزیت دوم این افزونه نسبت به روش بالا این میباشد که شما میتوانید با یک بار نوشتن و اعمال کردن کد های خود در این فایل برای همیشه از آن استفاده بکنید و حتی بعد از خرید قالب وردپرس جدید باز هم کد های شما در سایت اعمال شود اما در روشی که در بالا با استفاده از فایل Functions.php گفته شد بعد از هر بار تغییر قالب سایت شما باید مجددا دوباره این عملیات را انجام دهید.
برای دانلود این افزونه از لینک های زیر میتوانید اقدام بکنید:
[button color=’blue’ bgcolor=’#4184bf’ hoverbg=’#dd890b’ textcolor=’#ffffff’ texthcolor=’#ffffff’ align=’left’ link=’https://downloads.wordpress.org/plugin/add-admin-css.1.4.zip’ rel=’nofollow’ radius=’4′ icon_color=’#ffffff’] [icon size=’16’ hover_animation=’border_increase’ type=’vector’ icon_color=’#ffffff’ icon_color_hover=’#ffffff’ icon=’fa-wordpress’ ] دانلود افزونه از مخزن وردپرس [/button][button color=’blue’ bgcolor=’#4184bf’ hoverbg=’#dd890b’ textcolor=’#ffffff’ texthcolor=’#ffffff’ align=’right’ link=’https://wordpress.org/plugins/add-admin-css/’ rel=’nofollow’ radius=’4′ icon_color=’#ffffff’] [icon size=’16’ hover_animation=’border_increase’ type=’vector’ icon_color=’#ffffff’ icon_color_hover=’#ffffff’ icon=’fa-wordpress’ ] مشاهده صفحه افزونه [/button]
با تشکر از همراهی شما دوستان در این مقاله از آموزش وردپرس . در صورتی که مشکل یا سوالی دارید در بخش نظرات این مطلب اعلام بکنید تا راهنمایی شوید.
