چطور از تابع get_block_editor_theme_styles() در وردپرس استفاده کنیم؟
تابع get_block_editor_theme_styles() در وردپرس به ما کمک می‌کند تا استایل‌های سفارشی را به ویرایشگر بلاک (Block Editor) اضافه کنیم. این تابع به طور مستقیم در تم‌ها استفاده می‌شود تا بتوانیم طراحی صفحه ویرایشگر بلاک را مطابق با تم خودمان Customize کنیم. این قابلیت به ما این امکان را می‌دهد که تجربه کاربری بهتری برای تولیدکنندگان محتوا فراهم کنیم.
به عنوان مثال، فرض کنید که شما تمی برای وردپرس طراحی کرده‌اید و می‌خواهید استایل‌های خاصی برای ویرایشگر بلاک اعمال کنید. با استفاده از این تابع، می‌توانید CSS خود را اضافه کنید و مطمئن شوید که در محیط ویرایشگر بلاک به درستی نمایش داده می‌شود.
نکته مهم این است که باید استایل‌های شما به نوعی با محتوا یا ساختار سایت هماهنگ باشند. به عنوان مثال، اگر وب‌سایت شما تم رنگی خاصی دارد، باید مطمئن شوید که استایل‌ها و رنگ‌ها در ویرایشگر هم مشابه باشند تا یکپارچگی طراحی حفظ شود.
در ادامه با یک مثال ساده از نحوه استفاده از این تابع آشنا می‌شویم. مثلاً فرض کنید که می‌خواهید فونت متن داخل ویرایشگر را تغییر دهید یا برخی از کلاس‌های CSS را به عناصر خاصی اضافه کنید. در این صورت تنها کافی است تا از این تابع در فایل functions.php تم خود استفاده کنید.
مثال کد
function my_custom_block_editor_styles() {
wp_enqueue_style('my-custom-editor-styles', get_template_directory_uri() . '/editor-style.css');
}
add_action('enqueue_block_editor_assets', 'my_custom_block_editor_styles');
توضیحات کد
function my_custom_block_editor_styles()این تابع برای بارگذاری استایل‌های سفارشی ویرایشگر بلاک تعریف شده است.
wp_enqueue_style('my-custom-editor-styles', get_template_directory_uri() . '/editor-style.css');با استفاده از این خط کد، استایل خاصی که در فایل
editor-style.css در دایرکتوری تم قرار دارد، بارگذاری می‌شود.add_action('enqueue_block_editor_assets', 'my_custom_block_editor_styles');این خط تابع ما را به عمل
enqueue_block_editor_assets متصل می‌کند، تا هر وقت ویرایشگر بارگذاری شد، استایل‌های ما نیز بارگذاری شوند.