Tôi đang sử dụng trình chỉnh sửa Gutenberg cho các bài đăng của mình. Trang web của tôi đang sử dụng phông chữ Avenir cho nội dung và tiêu đề. Vì vậy, tôi cũng muốn có cùng một phông chữ trên trình soạn thảo Gutenberg. Nhưng trình soạn thảo Gutenberg mặc định đang sử dụng phông chữ Google “Noto Serif” . Tôi đã thay thế nó bằng các thủ thuật sau:
Tôi đã mở tệp functions.php của chủ đề hoạt động và bỏ mã PHP nhỏ này vào đó:
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');
enqueue_block_editor_assets là một móc nối của Gutenberg. Bạn có thể thêm các tập lệnh JS và CSS tùy chỉnh cho trình chỉnh sửa của mình. Tôi đã sử dụng nó và tải tệp editor.css tùy chỉnh của mình .
Tệp editor.css của tôi chứa các mã CSS sau:
.editor-post-title__block .editor-post-title__input,
.edit-post-visual-editor, .edit-post-visual-editor p {
font-family: "Avenir", sans-serif;
}
.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;
}
Đó là công việc như một cái duyên. Chúc bạn viết mã vui vẻ.