بخش تنظیمات فونت قالب در Redux

سلام دوست من 🖐
امیدوارم حالت خوب و عالی باشی✨

• فونت‌ها: اولش که ، باید فونت‌هایی که می‌خوای برای قالبت استفاده کنی رو تهیه کنی. فونت‌ها رو توی پوشه‌ای مثل fonts در قالبت قرار بده.

• ایجاد صفحه تنظیمات فونت: حالا بیا توی Redux یه صفحه‌ای ایجاد کنی که کاربر بتونه تنظیمات فونت‌ها رو انجام بده. برای هر فونت، یه فیلد انتخاب فونت بسازی که از نوع typography باشه. این فیلد می‌تونه فونت رو به عنوان output برای تمامی متن‌های قالب اعمال کنه.

• استفاده از فونت‌ها در قالب: حالا از اطلاعاتی که کاربر توی تنظیمات انتخاب کرده، برای تغییر فونت‌ها در قالب استفاده می‌کنی. می‌تونی از wp_enqueue_style استفاده کنی تا فایل‌های CSS فونت‌ها رو به قالب اضافه کنی.

نمونه کدش و از جنس php😊

Redux::setSection('theme_options', array(
    'title' => __('تنظیمات فونت', 'your-theme'),
    'id'    => 'font_settings',
    'icon'  => 'el el-font',
));

Redux::setSection('font_settings', array(
    'title' => __('انتخاب فونت', 'your-theme'),
    'id'    => 'font_select',
    'desc'  => __('لطفاً فونت مورد نظر خود را انتخاب کنید.', 'your-theme'),
    'type'  => 'typography',
    'output' => array('body'),
    'units' => 'px',
));

امیدوارم پاسخم بهت کمک کرده باشه ❤️
موفق و پیروز باشی 🤘🌹

سلام دوست من 🖐
امیدوارم حالت خوب و عالی باشی✨

• فونت‌ها: اولش که ، باید فونت‌هایی که می‌خوای برای قالبت استفاده کنی رو تهیه کنی. فونت‌ها رو توی پوشه‌ای مثل fonts در قالبت قرار بده.

ایجاد صفحه تنظیمات فونت: حالا بیا توی Redux یه صفحه‌ای ایجاد کنی که کاربر بتونه تنظیمات فونت‌ها رو انجام بده. برای هر فونت، یه فیلد انتخاب فونت بسازی که از نوع typography باشه. این فیلد می‌تونه فونت رو به عنوان output برای تمامی متن‌های قالب اعمال کنه.

نمونه کدش و از جنس php😊

Redux::setSection('theme_options', array(
    'title' => __('تنظیمات فونت', 'your-theme'),
    'id'    => 'font_settings',
    'icon'  => 'el el-font',
));

Redux::setSection('font_settings', array(
    'title' => __('انتخاب فونت', 'your-theme'),
    'id'    => 'font_select',
    'desc'  => __('لطفاً فونت مورد نظر خود را انتخاب کنید.', 'your-theme'),
    'type'  => 'typography',
    'output' => array('body'),
    'units' => 'px',
));

امیدوارم پاسخم بهت کمک کرده باشه ❤️
موفق و پیروز باشی 🤘🌹

ممنون بابت راهنمایی من تمامی این کار هایی که شما فرمودید رو انجامشون دادم ولی در اصل در کار با تابع wp_enqueue_style گیر کردم

سلام ارادت من از ریداکس خبری ندارم ولی من بودم اینکارو میکردم

ببین داخل php ما ی تابع داریم بنام scandir این تابع میان ی پوشه رو اسکن میکنه و نام هاي فایل هارو برامون برمیگردونه آدرسی که به فونت ها ختم میشه رو به این تابع بده و php
scandir رو اجرا میکنه و ی ارایه از تمامی اسم های فایل ها بهت میده بعد اون اسم ها میشه دقیقا نام هر فایل فونتی که داخل پوشه font هستش دیگه تا الان شما هم اسم فونت رو داری و هم آدرسش
میشه ی اکشن wp_head بزنی و فونت ها و مستقیم بزاری توی هد قالب تا اجرا بشه راه های دیگه اییم هست البته
scandir

این کد هایی هست که تو صفحه تنظیماتم قرار دادم ولی نمیدونم دقیقا چجوری باید فونت ها فراخوان بشن

array(
                'id' => 'content_font_size',
                'type' => 'slider',
                'title' => __('سایز فونت را انتخاب نمایید', 'test'),
                'default' => 14,
                'min' => 12,
                'step' => 1,
                'max' => 30,
                'display_value' => 'label'
            ),

            array(
                'id'       => 'font_select',
                'type'     => 'select',
                'title' => __('فونت قالب', 'test'),
                'subtitle' => __('فونت را انتخاب کنید پیشفرض: دنا می باشد', 'test'),
                'options'  => array(
                    'dana' => __('دنا', 'test'),
                    'sans' =>  __('ایران سنس', 'test'),
                    'yekan' =>  __('ایران یکان', 'test'),

                ),
                'default'  => 'dana',

            ),

@mahdi.nazari

مشکلی نیست. با استفاده از تابع wp_enqueue_style راهنماییت میکنم

ابتدا فونتایی که میخای در صفحه تنظیمات قالب تعریف کنی رو در پوشه Fonts قرار بده. این پوشه معمولاً در مسیر wp-content/themes/your-theme-name/Fonts قرار می‌گیره

در فایل تنظیمات تم (به عنوان مثال، functions.php) کد زیر را اضافه کن

function enqueue_custom_fonts() {
    // فایل‌های فونتی که تعریف کرده‌اید را به استایل اضافه می‌کنیم
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/your-font-styles.css');

    // دیگر کدها و تنظیمات مربوط به تم خودتان
}
add_action('wp_enqueue_scripts', 'enqueue_custom_fonts');

در اینجا your-font-styles.css به نام فایل CSS اضافه شده . توی این فایل می‌توانی استایل‌های مرتبط با فونت‌های خود ت رو تعریف کنی

خیلی ممنونم بابت راهنمایی خیلی کامل توضیح دادید
تایعی نیست که بشه کل استایل هارو مورد هدف قرار بده ؟
من یک قالب رو فارسی کردم بخاطر همین خیلی توابع قالب تسلط ندارم
و خود نویسنده قالب هم بخشی رو برای انتخاب فونت قرار نداده
ممنون بابت کمک
@mahdi.nazari

بنظرم این کد جوابگو مشکلت خواهد بود
css

/* استایل‌های مورد نظر شما */
body {
    font-family: 'YourChosenFont', sans-serif;
}
/* سایر استایل‌ها */

php

function enqueue_custom_styles() {
    // فایل استایل کلی
    wp_enqueue_style('custom-styles', get_template_directory_uri() . '/styles.css');

    // دیگر کدها و تنظیمات مربوط به تم خودتان
}
add_action('wp_enqueue_scripts', 'enqueue_custom_styles');

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

ابتدا در صفحه تنظیمات قالب بخش انتخاب فونت را اضافه کردم

Redux::set_section(
    $opt_name,
    array(
        'subsection' => true,
        'title' => esc_html__('فونت قالب', 'test'),
        'fields' => array(
            array(
                'id' => 'show_typography',
                'type' => 'section',
                'title' => esc_html__('انتخاب فونت قالب', 'test'),

            ),

            array(
                'id' => 'content_font_size',
                'type' => 'slider',
                'title' => __('سایز فونت را انتخاب نمایید', 'test'),
                'default' => 14,
                'min' => 12,
                'step' => 1,
                'max' => 30,
                'display_value' => 'label'
            ),

            array(
                'id'       => 'font_select',
                'type'     => 'select',
                'title' => __('فونت قالب', 'test'),
                'subtitle' => __('فونت را انتخاب کنید پیشفرض: دنا می باشد', 'test'),
                'options'  => array(
                    'dana' => __('دنا', 'test'),
                    'sans' =>  __('ایران سنس', 'test'),
                    'yekan' =>  __('ایران یکان', 'test'),
                    'byekan' =>  __('یکان Bold', 'test'),

                ),
                'default'  => 'dana',

            ),

            ),
        )
    );  

فونت های نام برده شده در بخش انتخاب فونت در پوشه fonts قرار گرفتند

کد های زیر به فایل functions.php اضافه شدند
کدها👇

 function enqueue_custom_fonts() {
       wp_enqueue_style('custom-styles', get_template_directory_uri() . '/styles.css');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff2');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/sans/IRANSansWeb.ttf');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/sans/IRANSansWeb.woff');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/sans/IRANSansWeb.woff2');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/yekan/iranyekanwebregular.ttf');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/yekan/iranyekanwebregular.woff');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/yekan/iranyekanwebregularfanum.ttf');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/byekan/byekan.woff');

}
add_action('wp_enqueue_scripts', 'enqueue_custom_fonts');

تا اینجا پیش رفتم و کد های زیر را در style.css قرار دادم

body {
    font-family: '؟؟؟؟؟؟؟', sans-serif;
}

1. در اون جایی که عامت سوال گذاشتم دقیقا نمیدونم باید چی قرار بدم
2. اصلا نمیدونم body کل متن های قالب رو مورد هدف قرار میده یا نه
3. چجوری قرار هست بعد از اینکه کاربر فونت رو از تنظیمات انتخاب کرد اون فونت فرا خوانی بشه ؟
   با توجه به گفته های خود شما مراحل بالا رو رفتم
   ممنون میشم کمک کنید

@mahdi.nazari

سلام مجدد ، حتما 🖐️

ابتدا، مشکل در اضافه کردن فونت‌ها به وب‌سایت رو حل میکنیم

function enqueue_custom_fonts() {
    wp_enqueue_style('custom-styles', get_template_directory_uri() . '/styles.css');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff');
    wp_enqueue_style('custom-fonts', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff2');
    // و سایر wp_enqueue_style ها...
}
add_action('wp_enqueue_scripts', 'enqueue_custom_fonts');

باید از wp_enqueue_style برای هر فونت جداگانه استفاده کنی و نه همه فونت‌ها را در یک wp_enqueue_style. به این صورت:

function enqueue_custom_fonts() {
    wp_enqueue_style('custom-styles', get_template_directory_uri() . '/styles.css');
    wp_enqueue_style('custom-font-dana', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff');
    wp_enqueue_style('custom-font-dana2', get_template_directory_uri() . '/Fonts/dana/dana-fanum-regular.woff2');
    // و سایر wp_enqueue_style ها...
}
add_action('wp_enqueue_scripts', 'enqueue_custom_fonts');

در فایل style.css، به جای ؟؟؟؟؟؟؟ نام فونت را قرار بده که می‌خواهی استفاده کنی . به عنوان مثال، اگر فونت‌ها را با نام custom-font-dana و custom-font-sans و غیره فراخوانی کردی، باید نام فونت‌ها را در font-family مشخص کنید. به این شکل:

body {
    font-family: 'custom-font-dana', sans-serif;
}

توجه داشته باش که نام فونت رو باید بر اساس نامی که برای wp_enqueue_style استفاده کرده‌اید تعیین کنی و تمام

امیدوارم پاسخم بهت کمک کرده باشه ❤️
موفق و پیروز باشی 🤘🌹

من تمامی مراحل رو رفتم ولی نمیدونم چرا فونت ها خوانده نمیشن
برای اینکه از استایل مطمعن بشم سایز فونت دادم کار کرد ولی فونت ها خولنده نمیشن
و اینکه اون بخش تنظیمات که قرار دادم چجوری وصل میشه به فونت ها و یا در بخش myfont کد زیر چی باید بزارم تا وصل بشه به redux ؟

*
‌{
font-family : myfont !important;
} 

@mahdi.nazari

@ossvahid

سلام ارادت متاسفانه از ریداکس خبری نداره چطوری کار میکنه نمیدونم چرا از همون هوک customze register وردپرس استفاده نمیکنی خیلی بهتر از ریداکس هستش

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

توی فایل css شما نمیتونی بیایی کد php یا جاوااسکریپت بنویسی باید اون قسمت
که فونت هارو به تمام تگ های سایت وارد میکنه رو از طریق هوک wp_head بنویسی داخل head قالب تا اجرا بشه
ی چنین چیزی میشه

add_action('wp_head',function(){
?>
<style>
*
‌{
font-family : ****  !important;
} 
</style>
<?php
});

توی کد بالا داخل فونت فامیلی ی چندتا ستاره زدم باید تنظیماتی که داخل ریداکس ست کردی رو بگیری و اونجا echo کنی من نمیدونم کد ریداکس چیه که میاد تنظیماتی رو که ست کردی دریافت کنه

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

بهتره بری داخل فایل style css و تمام font-style هارو هم پاک کنی تا صد در صد همین font-family که داخل هد قالب زدی کار کنه