17+ tip với WordPress Gutenberg Editor giúp bạn làm việc năng suất hơn

Source: 17+ tip với WordPress Gutenberg Editor giúp bạn làm việc năng suất hơn

Như bạn đã biết, WordPress sắp tung ra một trình soạn thảo hoàn toàn mới để thay thế trình soạn thảo hiện có. Tên của biên tập viên này là Gutenberg.

Hiện tại Gutenberg đang được phát hành dưới dạng một plugin riêng biệt. Nhưng trong WordPress 5.0 nó sẽ được đưa vào lõi và trở thành trình soạn thảo mặc định.

Đối với những bạn đã từng làm việc với trình xây dựng trang WordPress thì cách làm việc của Gutenberg không còn quá xa lạ.

Phương pháp của nó dựa trên khối để giúp bạn tạo nội dung và bố cục phức tạp hơn.

Ví dụ: bây giờ bạn sẽ có thể chèn các nút ngay trong trình chỉnh sửa hoặc tạo bố cục nhiều cột mà không cần cài đặt plugin trình tạo trang.

Nhưng dường như đối với một số bạn, Gutenberg vẫn là một cái gì đó khá xa lạ. Vì vậy, để giúp bạn sử dụng Gutenberg hiệu quả hơn, tôi đã biên soạn danh sách khoảng hơn 17 mẹo để làm việc với trình chỉnh sửa mới này.

Hơn 17 mẹo với WordPress Gutenberg để giúp bạn làm việc hiệu quả hơn

1. Hiểu giao diện làm việc của Gutenberg

Đây không phải là mẹo thực sự. Nhưng trước tiên bạn cần hiểu mọi thứ trong giao diện của Gutenberg.

Đây là ảnh chụp nhanh để bạn làm quen với giao diện của Gutenberg:

1. Các nút này cho phép bạn thêm một khối (khối) mới vào Gutenberg. Chức năng này cho phép bạn xem tất cả các khối có sẵn. Nhưng tôi sẽ chỉ cho bạn một cách nhanh hơn để thêm các khối mới.

2. Đây là phần thân của trình soạn thảo. Ở trên cùng, bạn có tiêu đề của bài đăng / trang. Và bên dưới đó, bạn có nội dung thực.

3. Khu vực này cho phép nhiều hành động giống như thanh bên của trình chỉnh sửa hiện tại. Có một sự khác biệt lớn là nếu bạn chọn một khối, nó sẽ cung cấp nhiều tùy chọn cho phép bạn định cấu hình khối đó.

Trong hình dưới đây, bạn sẽ thấy giao diện khi bạn nhấp vào khối đoạn văn. Khối tab của thanh bên đã chọn cho phép bạn thay đổi kích thước văn bản (text size), màu sắc (color), drop cap, v.v. Để quay lại một cài đặt khác, bạn có thể nhấp ra khỏi khối hoặc chọn tab Tài liệu theo cách thủ công.

2. Tận dụng các khối nội dung mới

Một lợi thế của Gutenberg là bạn có rất nhiều khối nội dung mới trong tay. Với TinyMCE Editor (trình soạn thảo WordPress hiện tại), bạn sẽ không thể chèn các loại nội dung này. Cách duy nhất là cài đặt plugin của bên thứ ba hoặc tự viết mã HTML.

Tôi sẽ không đi vào quá chi tiết ở đây, nhưng tôi khuyến khích bạn xem qua danh sách các khối mà Gutenberg cung cấp.

Một số khối nội dung đẹp mà bạn có thể chèn vào tài liệu của mình:

• Cái nút
• Tải tập tin
• Ảnh bìa
• vân vân

Nếu bạn vẫn chưa hài lòng với các khối mặc định này, bạn có thể thêm các khối mới như tôi đã đề cập trong bài viết này.

3. Sử dụng “/” để nhanh chóng chèn một khối

Như tôi đã đề cập ở trên, bạn có thể sử dụng nút + để duyệt các khối có sẵn và chọn khối bạn muốn.

Nhưng làm điều này hơi mất thời gian.

Vì vậy, nếu bạn biết rõ mình cần khối nào, sẽ có một cách nhanh hơn để chèn. Chỉ cần gõ “/” và bắt đầu nhập tên khối bạn cần.

Khi bạn nhấn Gutenberg sẽ đề xuất các khối phù hợp. Sau đó, bạn chỉ cần gõ “Enter” để chèn khối.

4. Chèn ảnh bằng cách kéo và thả chúng khỏi Màn hình nền

Đây là một tính năng giúp bạn tiết kiệm thời gian.

Thay vì chèn hình ảnh theo cách thủ công bằng cách tạo một khối hình ảnh mới cho mỗi hình ảnh và sau đó tải hình ảnh vào Thư viện phương tiện, bạn có thể chỉ cần kéo hình ảnh ngay từ màn hình nền vào giao diện Gutenberg nơi bạn muốn chúng xuất hiện.

Lúc này, Gutenberg sẽ tự động tải hình ảnh lên Thư viện phương tiện rồi chèn vào vị trí đó.

Nó khá đơn giản phải không? Bạn chỉ cần đảm bảo rằng bạn nhìn thấy đường màu xanh lam trong khi kéo để đảm bảo mọi thứ hoạt động như bình thường.

5. Tìm hiểu các phím tắt của Gutenberg

Nếu bạn muốn làm việc hiệu quả hơn, bạn cần biết các phím tắt của Guteberg.

Mặc dù hầu hết các phím tắt phổ biến sẽ hoạt động trong Gutenberg, chẳng hạn như Ctrl + XÓA để in đậm, Gutenberg cũng thêm một số phím tắt chuyên dụng sẽ giúp bạn tiết kiệm thời gian.

Để xem danh sách phím tắt, bạn có thể sử dụng phím tắt Shift + Alt + H:

Tôi khuyên bạn nên xem danh sách đầy đủ. Nhưng đây là 3 phím tắt mà tôi thấy hữu ích nhất:

• Ctrl + Alt + Blackspace: xóa khối bạn chọn
• Ctrl + Alt + LÊN: chèn một khối mới trước khối bạn đã chọn.
• Ctrl + Alt + Y: chèn một khối mới sau khối bạn đã chọn

Ngoài các phím tắt trên, bạn có thể sử dụng cú pháp đánh dấu. Đây là một số cú pháp đánh dấu hoạt động trong Gutenberg:

• ## để tạo tiêu đề
• 1. để tạo một danh sách có thứ tự
• * để tạo một danh sách không có thứ tự
• > để tạo một câu trích dẫn

Ví dụ, để tạo tiêu đề H2, bạn gõ “##” rồi nhập phím cách. Khi đó, Gutenberg sẽ tự động kích hoạt khối đề mục.

Xem hình minh họa bên dưới:

6. Biến khối này thành khối khác

Thay vì chèn một khối cho từng loại nội dung khác nhau, bạn có thể tiết kiệm thời gian bằng cách chuyển đổi khối này thành khối khác.

Tính năng này hữu ích với văn bản. Ví dụ: bạn có thể chuyển đổi một khối đoạn văn bình thường thành:

• Phần mở đầu
• Trích dẫn
• Danh sách
• Câu văn được định dạng sẵn

Nhưng bạn cũng có thể thực hiện chuyển đổi này với các loại khối khác: giống như chuyển ảnh bình thường thành ảnh bìa.

Để truy cập chuyển đổi này, bạn sử dụng thanh công cụ:

7. Đã thêm thanh công cụ cố định để định dạng dễ dàng hơn

Nói về thanh công cụ ..

Nhiều người không thích cách thanh công cụ của Gutenberg liên tục hiển thị và ẩn khi chúng di chuyển giữa các khối.

Nếu điều này làm phiền bạn, Gutenberg cho phép bạn chuyển sang thanh công cụ cố định. Điều này có nghĩa là bạn sẽ có một thanh công cụ cố định ở đầu trình chỉnh sửa.

Bạn có thể bật chế độ này bằng cách sử dụng dấu chấm thứ ba ở góc trên bên phải và lựa chọn Thanh công cụ hợp nhất:

8. Sử dụng kéo và thả để sắp xếp các khối

Với trình soạn thảo cũ, bạn phải cắt và dán để sắp xếp nội dung. Mặc dù bạn vẫn có thể làm điều này, nhưng với Gutenberg thì có một cách khác tiện lợi hơn. Đó là sử dụng điều khiển bố cục kéo và thả tích hợp của Gutenberg.

Để bật chế độ kéo và thả, bạn chỉ cần rê chuột vào khối rồi kéo qua nút yes sáu chấm bên trái.

Sau đó, chỉ cần kéo và thả nó vào nơi bạn muốn

9. Sử dụng Shift + Enter để ngắt dòng thay vì tạo một khối mới

Bạn muốn tạo một dòng văn bản mới mà không cần tạo khối đoạn văn mới?

Đơn giản chỉ cần sử dụng Shift + Enter thay vì sử dụng Enter.

10. Tạo cột với cột khối

Ngoài việc tạo các khối nội dung, Gutenberg còn cho phép bạn sáng tạo hơn với cách bố trí nội dung của mình bằng các cột khối.

Ngay sau khi bạn thêm khối Cột, bạn có thể thêm một khối khác bên trong nó để tận dụng bố cục mới. Như dưới đây là bố cục 25% – 25% – 50%:

Gutenberg’s Block Columns cũng chỉ làm những điều cơ bản. Nếu bạn cần các tính năng nâng cao hơn, bạn có thể sử dụng plugin miễn phí Kadence Blocks.

11. Tạo Mẫu khối để bạn sử dụng lại

Các mẫu khối là một tính năng thú vị của Gutenberg giúp bạn tiết kiệm rất nhiều thời gian trong việc tạo nội dung.

Đầu tiên, bạn chỉ cần chọn tất cả các khối của mình (chỉ và kéo giống như cách bạn chọn văn bản trong trình chỉnh sửa hiện tại).

Sau đó bấm vào NSmột dấu chấm. Từ menu thả xuống, bạn chọn Thêm vào các khối có thể tái sử dụng:

Sau đó, bạn nhập tên mẫu:

Từ đây, bạn sẽ chèn mẫu giống như chèn một khối Gutenberg.

Những điểm tuyệt vời ở đây:

Bạn có thể sử dụng tính năng nhập / xuất mẫu dưới dạng tệp JSON để sử dụng trên các trang web khác.

Để truy cập tính năng này, hãy nhấp vào. cái nút Ba chấm ở góc trên bên phải, chọn Quản lý tất cả các khối có thể tái sử dụng.

Bạn sẽ chuyển đến một khu vực mà bạn có thể:

• Nhập mẫu khối từ tệp JSON.
• Xóa mẫu khối
• Xuất mẫu khối sang tệp JSON.

12. Chỉnh sửa Post Slug (URL bài viết)

Trong giao diện Gutenberg, việc chỉnh sửa slug của Post không được trực quan cho lắm.

Nếu bạn muốn chỉnh sửa URL trước tiên bạn cần nhấp vào tiêu đề bài viết. Sau đó, bạn có thẻ chỉnh sửa URL:

13. Tận dụng toàn bộ chiều rộng

Nếu bạn sử dụng chủ đề tương thích với Gutenberg, bạn có thể tạo hình ảnh có chiều rộng đầy đủ trải dài toàn bộ trang.

Tất cả những gì bạn phải làm là chọn Chiều rộng đầy đủ (Bạn chỉ thấy tùy chọn này nếu chủ đề của bạn tương thích với Gutenberg).

14. Sử dụng khối Classic nếu bạn đã quen với trình soạn thảo cũ

Nếu bạn không thích khối đoạn văn mới, Gutenberg vẫn có một khối Cổ điển Nhúng trình soạn thảo TinyMCE làm một khối.

Bạn thậm chí còn nhận được một thanh công cụ TinyMCE, bao gồm các nút mà các plugin khác thêm vào thanh công cụ:

15. Chuyển tất cả các bài đăng cũ thành thiết kế thân thiện với Gutenberg mới

Một trong những lý do tại sao Gutenberg thêm khối Cổ điển là các vấn đề về tính tương thích.

Hãy tưởng tượng có hàng triệu bài báo được tạo bằng trình soạn thảo cũ. Sẽ là một vấn đề lớn nếu Gutenberg tự động chuyển đổi tất cả các bài đăng này thành các khối.

Vì vậy, Gutenberg chỉ tự động đặt tất cả nội dung vào một khối Cổ điển duy nhất.

Ví dụ đây là một bài đăng được tạo bằng trình chỉnh sửa cũ:

Và đây là bài viết sau khi kích hoạt plugin Gutenberg:

Như bạn có thể thấy, tất cả chỉ là một khối Class duy nhất thay vì một khối riêng biệt cho mỗi đoạn văn / hình ảnh.

Nếu bạn muốn sử dụng Gutenberg với nội dung cũ, tất cả những gì bạn cần chỉ là nhấp vào Ba chấm tiếp đó hãy chọn Chuyển đổi thành khối:

Gutenberg sẽ tự động đặt từng phần tử vào khối của nó. Bây giờ bạn có thể thao tác nó giống như một bài đăng bạn đã tạo từ đầu với Gutenberg.

16. Chỉnh sửa mã HTML

Gutenberg vẫn cho phép chỉnh sửa mã HTML. Để thực hiện việc này, bạn sử dụng nút ba chấm ở góc trên bên phải hoặc sử dụng phím tắt Ctrl + Shift + Alt + M:

17. Ẩn thanh bên khi chỉnh sửa toàn màn hình

Để làm điều này, hãy nhấp vào. cái nút Nhìn thấy, sau đó bạn chọn Chế độ toàn màn hình để ẩn thanh bên:

18. Biên tập viên Deactive Gutenberg

Cuối cùng, nếu bạn không thích Gutenberg và bạn muốn hủy kích hoạt nó để sử dụng TinyMCE Editor, chỉ cần cài đặt và kích hoạt plugin Classic Editor.

Nguồn WPLift

Via: sieucoder.com

from sieucoder.com https://ift.tt/3pnf5xc
via Sieucoder.com