تغییر فونت ویرایشگر گوتنبرگ

[miraziz 26]

سلام. دوستان این یک تاپیک آموزشی است.

فرض کنید شما در قالبتان برای عنوان و محتوای پست‌ها از فونت یکان استفاده می‌کنید. و حالا می‌خواهید همین فونت را در ویرایشگر گوتنبرگ نیز داشته باشید. برای اینکار کد‌های زیر را به توابع قالب فعالتان (فایل function.php) اضافه کنید.

function paul_guten_block_editor_assets() {
	wp_enqueue_style(
		'paul-editor-style',
		get_stylesheet_directory_uri() . "/editor.css",
		array(),
		'1.0'
	);
}
add_action('enqueue_block_editor_assets', 'paul_guten_block_editor_assets');

حالا باید در پوشه‌ی قالبتان یک فایل با نام editor.css ایجاد کنید و کدهای زیر را درون آن بریزید.

@font-face {
	font-family: 'yekan';
	src: url('font/yekan/yekan.eot?#') format('eot'),
	url('font/yekan/yekan.woff') format('woff'), 
	url('font/yekan/yekan.ttf') format('truetype');
}


.editor-post-title__block .editor-post-title__input,
.edit-post-visual-editor, .edit-post-visual-editor p {
	font-family: yekan;
}

.editor-post-title__block .editor-post-title__input {
	font-size: 42px;
	font-weight: 400;
	line-height: 50px;
	text-align: center;
}

.edit-post-visual-editor, .edit-post-visual-editor p,
.editor-rich-text__tinymce.mce-content-body {
	font-size: 20px;
	line-height: 30px;
}

با لذت از فونت دلخواهتان استفاده کنید. البته نمی دونم که این روش برای ویرایشگر کلاسیک وردپرس (همان wysiwyg editor) جواب می‌دهد یا نه. اگر از دوستان کسی امتحانش کرد تو تاپیک اطلاع بده. ممنون
این مطلب برداشته شده از یک وبلاگ انگلیسی است که به احترام نویسنده‌ی آن لینک منبع را قرار دادم.
How do you change the Gutenberg editor’s default font

ویرایش شده بهمن 97 توسط miraziz

[miraziz 26]

البته دوستان نیازی به  text-align: center نیست. متاسفانه امکان ویرایش را نداشتم

ویرایش شده بهمن 97 توسط miraziz