تغییر فونت پیشخوان وردپرس بدونه افزونه
آموزش تغییر فونت پیشخوان وردپرس بدونه افزونه
فهرست موضوعات در این آموزش
در صورتی که بخواهیم نقش اینترنت و وب‌سایت‌های اینترنتی را در تجارت جهانی و درصدی که از اقتصاد دارند را بررسی کنیم، می‌توانیم بگوییم که نقش آنها یکی از پررنگ‌ترین نقش‌ها می‌باشد و در هر لحظه هزاران نفر پای سایت خود در حال فروش محصولات می‌باشند. مدیریت یک سایت اینترنتی و اینکه شما این کار را درست انجام دهید از موضوعاتی است که می‌تواند برای هر یک از صاحبان کسب‌وکارهای اینترنتی جذاب باشد. در این میان امکاناتی وجود دارد که با استفاده از آن شما این امکان را خواهید داشت که این کار را بهتر انجام دهید. این امکانات می‌تواند استفاده از برنامه‌ها و افزونه‌های بزرگ سئو و تجارت الکترونیک تا یک تغییر فونت پیشخوان متغیر باشد و همه آنها در دسته کارهایی قرار می‌گیرند که به شما کمک می‌کنند تا سایت خود را بهتر اداره کنید و یا سایت بهتری را به مشتری تحویل دهید.
البته باید گفت که تغییر فونت پیشخوان در این حد هم که ما گفتیم مورد ساده‌ای نیست و شاید بتوان آن را به‌صورت ساده پیاده‌سازی کرد، اما می‌تواند تاثیر بسیار زیادی را روی تجربه کاربری با سایت داشته باشد و شما میتوانید خود را در یک فضای راحت و خوب تصور کنید. به‌خصوص اینکه سیستم مدیریت محتوای وردپرس هم زیادی با زبان فارسی مهربان نبوده و نوع نمایش پیش‌فرضی که برای حروف فارسی در نظر نگرفته است کمی خسته‌کننده و نازیبا می‌باشد.
چرا فونت پیشخوان وردپرس تغییر بدم ؟
وقتی یک وبمستر و مدیر سایت هستید، قطعا زمان زیادی را در پیشخوان وردپرس (پنل ادمین وردپرس) می‌گذرانید. برای نوشتن مطالب و مقالات، بررسی فرم‌ها، آنالیز، بررسی نظرات و… احتمالا هر روز به پنل وردپرس سایت سر می‌زنید.
برای همین برای اینکه طرح زیبایی را ببینید، بهتر است از فونت مناسب هم در پنل مدیریت سایت وردپرس‌تان استفاده شود!
برسی تغییر فونت پیشخوان وردپرس
به‌طورکلی در مورد سیستم مدیریت محتوای وردپرس می‌توانیم بگوییم که روش‌های اعمال تغییرات و ادیت‌هایی که می‌خواهیم روی آن انجام دهیم، محدود به دو بخش کلی می‌باشد. اولین بخش قالب ما خواهد بود و باید آن را تغییر دهیم و دست‌کاری کنیم، و بخش دوم هم استفاده از افزونه‌ها خواهد بود. در اصل باید بگوییم که سیستم وردپرس یک سیستم قالب‌محور و افزونه‌محور است و هر کاری که شما لازم داشته باشید روی سایت وردپرسی خود انجام دهید باید با تغییر این بخش‌ها آن را به انجام برسانید.
تغییراتی که روی افزونه‌ها انجام می‌شود با نصب و به کار گرفتن افزونه خواهد بود. اما عموم تغییراتی که روی قالب انجام می‌شود، می‌تواند تغییرات مربوط به ادیت‌های مختلف باشد که هم با کدنویسی و دست‌کاری قالب انجام می‌شود و هم می‌تواند از بخش تنظیمات قالب که در قالب‌های حرفه‌ای وجود دارند اتفاق بیفتد. اکنون که می‌دانیم برای تغییر فونت پیشخوان چه راه‌هایی را داریم، می‌توانیم این روش را به‌عنوان روش‌های کلیدی برای انجام این کار معرفی کنیم:
استفاده از کد یا همان توابع وردپرس
یکی از روش‌هایی که میتوانید کار تغییر فونت پیشخوان با آنها انجام دهید دست‌کاری تنظیمات قالب و ایجاد تغییرات در آن می‌باشد که به‌صورت تغییر در کدهای سایت انجام می‌شود. در این مورد شما باید به‌سراغ تابع Function.php در قالب خود بروید و با تغییر فونت‌های مربوط به بخش پیشخوان در آن فونت‌های سایت خود را تغییر دهید.
در رابطه با این تغییر باید گفت که در صورتی که شما قالب خود را مستقیما ویرایش کنید و بعد از آن قالب را به‌روزرسانی کنید، این تغییرات از بین خواهد رفت. پس بهترین کار برای اینکه بتوانید به‌صورت امن کار تغییر فونت پیشخوان از طریق دست‌کاری کدهای قالب را انجام دهید این است که قبل از اقدام برای خود یک Child Theme ایجاد کنید. تم‌های چایلد یا همان فرزند، تم‌هایی هستند که با تغییرات و آپدیت‌های قالب دست‌نخورده باقی‌مانده و تغییراتی که در آنها ایجاد می‌شود مجددا برای سایت باقی می‌مانند و می‌توان از اعمال این تغییرات در عملکرد سایت مطمئن بود.
پس کاری که برای تغییر فونت پیشخوان با استفاده از کد باید انجام شود این است که شما فونت‌های خود را روی سایت بارگذاری کرده، یک چایلد تم روی سایت ایجاد کنید و تغییرات مربوط به تغییر فونت پیشخوان را روی آن اعمال کنید و فونت‌های قسمت پیشخوان را تغییر دهید.
قرار دادن کد در پیشخوان
در مرحله‌ی بعدی بازهم در File Maneger هاست خود به مسیر Public_html > wp-content > themes بروید و پوشه قالب فعال سایت‌تان را باز کنید. حالا به فایل function.php بروید و تکه کد زیر را در انتهای آن اضافه کنید و تغییرات را ذخیره کنید.
|
1 2 3 4 |
function replyWp_update_font_admin(){ wp_enqueue_style('admin_panel_font',get_template_directory_uri().'/test.css' ); } add_action('admin_enqueue_scripts','replyWp_update_font_admin'); |
توجه داشته باشید که جای عبارت test.css در کد بالا اگر نام دیگری در مرحله‌ی قبلی برای فایل css انتخاب کردید باید در اینجاهم همان نام را قرار دهید. بریم برای سایت ساخت فایل css
فایل css برای تغییر فونت پیشخوان وردپرس
هر فونتی که ما استفاده می‌کنیم در دنیای وب دارای چند خط کد css هست که باید آن‌را در فایل استایل مورد نظر خود قرار دهیم تا بتوانیم از آن فونت استفاده کنیم. این موارد مربوط به کدنویسی است و نیازی نیست شما دقیق بدانید.
ولی اگر فایل وب فونت خریداری می‌کنید کد css آن به همراه فایل‌های وب فونت به شما داده می‌شود و کافی است آن را کپی کنید و اگر از فونت قالب می‌خواهید استفاده کنید، کد آن در چند خط ابتدایی قالب هست و کافی است شما کدهایی که با @font-face شروع می‌شوند را کپی کنید و در بعد استفاده می‌کنیم.
قرار دادن کدهای css برای تغییر فونت پیشخوان وردپرس
برای تغییر فونت پیشخوان وردپرس حالا یک فایل در آن قالب اضافه کنید با نام test.css و بعد کد css فونت که در مرحله‌ی قبلی کپی کردیم را در آن پیست کنید.
و در شروع (قبل) تمام url هایی که هست در کدهایی که قرار دادید لینکی که در مرحله‌ی آپلود فایل‌های وب فونت دریافت کردیم را کپی کنید از کد های css زیر میتوانید استفاده فرمایید
|
1 2 3 4 5 6 7 8 9 10 |
@font-face { font-family: Vazir; src: url('assets/fonts/Vazir-Medium.eot'); src: url('assets/fonts/Vazir-Medium.eot?#iefix') format('embedded-opentype'), url('assets/fonts/Vazir-Medium.woff2') format('woff2'), url('assets/fonts/Vazir-Medium.woff') format('woff'), url('assets/fonts/Vazir-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; } |
دقت داشته باشید که ما اینجا از فونت وزیر استفاده کردم شما می توانید از فونت مورد علاقه خود استفاده نمایید
برای اینکه بتوانیم بگوییم از این فونت در پیشخوان وردپرس استفاده شود بعد از کدهای css فونت تکه کد زیر را قرار دهید.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
/* start wp admin font code replywp.com*/ ul#adminmenu, .contextual-help-sidebar, .help-tab-content, .active, .add-buttons-title, .updated_base, .selection-error-label, .selection-error-filename, .selection-error-message, .details, .instructions, code, p, a, h1, h2, h3, h4, h5, h6, input, label, button, select, .description, textarea, form, th, .username, .display-name, #published-posts, span.editor-block-inspector__no-blocks.block-editor-block-inspector__no-blocks, .table-of-contents__counts, input, td, .manage-menus, .widget-description, ul, li, .rtl #wpadminbar *,.editor-styles-wrapper > *, .editor-styles-wrapper p, .editor-styles-wrapper ol, .editor-styles-wrapper ul, .editor-styles-wrapper dl, .editor-styles-wrapper dt, .editor-post-title__block .editor-post-title__input, .editor-styles-wrapper .wp-block h1, .editor-styles-wrapper .wp-block h2, .editor-styles-wrapper .wp-block h3, .editor-styles-wrapper .wp-block h4, .editor-styles-wrapper .wp-block h5, .editor-styles-wrapper .wp-block h6, .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter, .editor-styles-wrapper cite, .editor-styles-wrapper figcaption, .editor-styles-wrapper .wp-caption-text,.editor-post-title__block .editor-post-title__input, .editor-styles-wrapper .wp-block h1, .editor-styles-wrapper .wp-block h2, .editor-styles-wrapper .wp-block h3, .editor-styles-wrapper .wp-block h4, .editor-styles-wrapper .wp-block h5, .editor-styles-wrapper .wp-block h6, .editor-styles-wrapper .has-drop-cap:not(:focus)::first-letter, .editor-styles-wrapper cite, .editor-styles-wrapper figcaption, .editor-styles-wrapper .wp-caption-text, .components-form-token-field__input-container, body.rtl, body.rtl .press-this a.wp-switch-editor, .wp-block-nextpage>span { font-family: Vazir !important; } * { outline: none !important; } .dashicons, .dashicons-before:before, #wpadminbar .ab-icon, #wpadminbar .ab-item:before, #wpadminbar>#wp-toolbar>#wp-admin-bar-root-default .ab-icon, .wp-admin-bar-arrow { font-family: dashicons !important; } .tgmpa td.version>p>span { float: left !important; } .tgmpa .tablenav>p>strong>small { display: none !important; } #adminmenu #menu-posts-elementor_library .wp-menu-image:before, #adminmenu #toplevel_page_elementor div.wp-menu-image:before { font-family: eicons !important; } /* end wp admin font code replywp.com*/ |
لازم به ذکر هست که جلوی عبارت Vazir در کدهای بالا اسم فونت خود را وارد کنید به طور مثال فونت IRANYkan. نام فونت را میتوانید از کدهای css فونت که کپی کردیم در جلوی عبارت font-family مشاهده کنید. در نهایت تغییرات را ذخیره کنید.
نتیجه گیری تغییر فونت پیشخوان
امیدوارم این آموزش از سایت پاسخ وردپرس هم برای شما مفید بوده باشد در این آموزش توابع وردپرس، با نحوه‌ی تغییر سریع و ساده‌ی فونت پیشخوان وردپرس به فونت فارسی مناسب آشنا شدیم! و با این روش تغییر با کدنویسی ، این کار را انجام دادیم.
حتما برای آموزش‌های بیشتر، پاسخ وردپرس را ببینید و هر چند وقت یکبار هم به سایت ما سر بزنید تا آموزش های جدید را ببینید. موفق باشید.
سلام ممنونم ز سایت خوبتون
من خیلی دنبال این آموزش گشتم تا اینکه اینجا پیداش کردم
فقط برای تکمیل این آموزش بنده یه موردی رو خدمتتون عرض کنم
کدی که در مرحله ی اول قرار دادید که در فایل فانکشن قرار بگیره ، یعنی این کد:
function replyWp_update_font_admin(){
wp_enqueue_style(‘admin_panel_font’,get_template_directory_uri().’/test.css’ );
}
add_action(‘admin_enqueue_scripts’,’replyWp_update_font_admin’);
فقط در فایل فانکشن قالب اصلی کار میکنه اگر دوستان میخوان که فونتها رو در قالب فرزند یا همون چایلد تم استفاده کنند باید از این کد استفاده کنند :
function replyWp_update_font_admin(){
wp_enqueue_style(‘admin_panel_font’, get_stylesheet_directory_uri() . ‘/admin-font.css’ );
}
add_action(‘admin_enqueue_scripts’, ‘replyWp_update_font_admin’);
علت این خطا هم ممکنه این باشد که تابع get_template_directory_uri() از مسیر قالب اصلی استفاده میکنه و این مسیر در قالب‌های فرعی (چایلد تم) ممکنه تغییر کنه.
به هر حال برای استفاده از مسیر قالب فعلی به جای قالب اصلی، می‌تونید از تابع get_stylesheet_directory_uri() استفاده کنید.
موفق باشید
متشکرم ازشما موفق و سربلند باشید