Gutenberg đã khiến cho rất nhiều anh em Blogger hay những ai đang xài WordPress cảm thấy khó chịu khi chuyển mình qua phiên bản mới này.
Thứ nhất, trình chỉnh sửa khối mới khó sử dụng hay sao?
Ý Tài là, bạn không biết tất cả các công cụ yêu thích của bạn đã đi đâu. Bây giờ, bạn có thể mất nhiều thời gian hơn để tạo một bài viết, phải không?
Có thể việc thêm một liên kết (liên kết hoặc cách khác) cũng gây cho bạn chút khó khăn và có lẽ bạn đã có vấn đề khi thêm một hình ảnh bên cạnh văn bản của bạn.
Có lẽ bạn đã thử thêm nhiều cột và mọi thứ không như mong đợi. Nếu đó không phải là trường hợp, có lẽ bạn không thể dễ dàng thêm các tệp PDF của mình hoặc bạn thấy thông báo Lỗi Cập nhật thất bại nghiêm trọng.
Chà, đừng lo lắng nữa; Tài đã ở vị trí chính xác của bạn cách đây không lâu, nhưng bây giờ Tài thấy Gutenberg là một sự hồi hộp để sử dụng.
Đến cuối bài hôm nay, Tài nghĩ bạn cũng sẽ nghĩ về Gutenberg khác đi.
Trình biên tập Gutenberg là gì
Nếu bạn đang sử dụng WordPress 5.0 trở lên, bạn hẳn đã bắt gặp trình chỉnh sửa WordPress mới và sáng bóng, nổi tiếng là Gutenberg.
Và cũng giống như nhiều người dùng khác, bạn muốn sử dụng trình soạn thảo mang tính cách mạng, nhưng bạn lại do dự vì Gutenberg rất phức tạp .
Hoặc có lẽ khi bạn gặp Gutenberg lần đầu tiên, nhiều thứ không hoạt động. Rốt cuộc, các nhà phát triển đã và vẫn đang làm cho các chủ đề và plugin tương thích với trình chỉnh sửa khối.
Về chức năng, Classic Editor và Gutenberg làm điều tương tự; bạn biết đấy, cả hai công cụ đều giúp bạn tạo nội dung mà không cần mã hóa.
Tuy nhiên, chúng ta đã quá quen với trình soạn thảo cũ đến nỗi chúng ta thấy việc thích nghi với giao diện người dùng Gutenberg mới hơi xa lạ, nếu không muốn nói là hoàn toàn khó hiểu. Ít nhất đó là những gì Tài nghĩ.
Chính xác thì Gutenberg là gì?
Gutenberg là trình soạn thảo mặc định mới của WordPress. Nó không giống như trình soạn thảo hình ảnh / văn bản truyền thống; Gutenberg sử dụng các khối nội dung giống như nhiều người xây dựng trang hiện đại.
Nó vận chuyển với các tính năng trực quan hơn so với Trình chỉnh sửa Cổ điển, nghĩa là bạn có thể tạo nội dung đa phương tiện một cách nhanh chóng. Giờ đây, bạn có thể nhanh chóng sắp xếp các bố cục đặc biệt cho dù bạn đang làm việc với các bài đăng hoặc trang WordPress.
Và với một vài tiện ích bổ sung, Gutenberg có thể cạnh tranh thuận lợi với các nhà xây dựng trang WordPress đã thành lập như Brizy, Elementor và Divi.
Hạn chế duy nhất là người xây dựng trang thường cung cấp nhiều tính năng hơn vì họ chủ yếu là người xây dựng trang! Đồng thời, Gutenberg vẫn còn khá trẻ và bạn chỉ có thể mong đợi trình chỉnh sửa khối sẽ phát triển theo những bước nhảy vọt.
Trong bài viết hôm nay, chúng ta sẽ có một thời gian thú vị khi tạo một bài đăng WordPress với trình soạn thảo Gutenberg. Tài hướng đến việc bao gồm mọi chi tiết nhỏ và tính năng để bạn có thể sử dụng Gutenberg để tạo nội dung như các chuyên gia.
Bạn đã sẵn sàng chưa? Nếu vậy, hãy tạo bài đăng WordPress đó.
Cách tạo một bài đăng WordPress với Gutenberg
Nếu bạn điều hành một trang web WordPress, bạn có thể tạo nhiều bài đăng hơn các trang. Trong phần sau, Tài tạo một bài đăng WordPress trong Gutenberg từ đầu. Tài hy vọng bạn sẽ có nhiều niềm vui như Tài đã làm khi thử nghiệm Gutenberg.
Dù vậy, hãy điều hướng đến Post -> Add New khi Tài tô sáng trong ảnh chụp màn hình bên dưới.
Làm như vậy sẽ dẫn bạn thẳng đến trình soạn thảo Gutenberg được hiển thị bên dưới.
Thêm một tiêu đề
Bạn không thể viết một bài mà không có tiêu đề vững chắc. Điều tốt là Gutenberg làm cho nó dễ dàng để thêm một tiêu đề.
Khối đầu tiên bạn nhìn thấy là Tiêu đề ở đầu tài liệu như Tài trình bày chi tiết trong hình trên. Để tạo tiêu đề cho bài viết của bạn, hãy nhập vào bên trong khối. Đơn giản như A, B, C.
Cần chỉnh sửa permalink? Bạn có thể dễ dàng làm điều đó trong khối Tiêu đề bằng cách nhấp vào nút Edit như hiển thị bên dưới.
Sau khi thêm tiêu đề của bạn, nhấn phím ENTER để bắt đầu một dòng mới. Ồ vâng, Gutenberg duy trì điều hướng riêng mà bạn yêu thích trong trình chỉnh sửa WordPress cổ điển.
Thêm một đoạn mới
Nhấn phím ENTER sẽ tạo một khối Đoạn mới , như được hiển thị ở trên. Trước khi bạn nhập bất kỳ văn bản nào, khối sẽ trình bày cho bạn một vài tùy chọn. Xem hình ảnh được đánh số dưới đây để biết thêm chi tiết.
Ghi chú. Bạn có thể:
- Chuyển đổi khối đoạn mới thành bất kỳ khối nào khác, ví dụ: hình ảnh, tiêu đề, bìa, thư viện, WooCommerce, biểu mẫu, v.v.
- Sử dụng phím tắt để thay đổi khối đoạn văn thành một khối hình ảnh
- Thay đổi khối đoạn văn thành một khối tiêu đề, nghĩa là H2, H3 và H4
- Chuyển đổi khối đoạn văn thành một khối hình ảnh bìa
Đối với mục đích minh họa, Tài sẽ dành đoạn đầu tiên cho phần giới thiệu bài. Khi bạn thêm một số văn bản, một thanh công cụ định dạng xuất hiện như hình dưới đây.
Nhờ thanh công cụ định dạng, bạn có thể:
- Chuyển đoạn văn thành một câu thơ, trích dẫn, tiêu đề, danh sách, mã và văn bản được định dạng trước
- In đậm , in nghiêng ,
gạch ngangvà gạch chân nội dung - Căn chỉnh văn bản trái, phải, giữa và biện minh
- Thêm một liên kết cũng có thể mở trong một tab mới
- Chèn một hình ảnh nội tuyến (vâng, nó tồn tại!)
- Ẩn cài đặt khối
- Nhân đôi khối
- Chèn một khối trước hoặc sau khối hiện tại (trong trường hợp của chúng tôi, đó là đoạn đầu tiên, vì vậy không được thêm bất cứ điều gì trước, chỉ sau.) Bạn có thể thêm một khối ảnh bìa trước đoạn đầu tiên nếu bạn muốn vì nó trông như vậy tốt
- Chỉnh sửa khối dưới dạng HTML
- Thêm khối hiện tại vào các khối có thể sử dụng lại để bạn có thể sử dụng nó trong các bài viết khác
- Loại bỏ hoàn toàn khối
Bạn có thể tùy chỉnh thêm khối đoạn văn với các tùy chọn có sẵn trong tab Chặn được tìm thấy trong menu thanh bên như hiển thị bên dưới.
Một vài lưu ý về hình ảnh trên:
- Chọn tab Chặn ở đây để xem tất cả các tùy chọn và cài đặt khối
- Chọn cỡ chữ và kích hoạt Drop Cap tại đây
- Thêm màu nền cho đoạn văn của bạn. Tài đặt nó thành màu xanh cho mục đích minh họa. Bạn cũng có thể tùy chỉnh màu văn bản. Trong cả hai trường hợp, bạn có thể thêm màu tùy chỉnh không giới hạn
- Bạn có thể thêm một lớp CSS tùy chỉnh tại đây, nghĩa là bạn có thể thêm các kiểu CSS bổ sung vào khối của mình
- Nền màu xanh và Drop Cap đã được áp dụng trong trình chỉnh sửa Gutenberg
Tab Tài liệu trong Thanh bên
Có một tab khác trong menu sidebar; các tài liệu tab như hình dưới đây.
Ở đây, các ghi chú cho hình ảnh trên:
- Nhấn vào đây để chuyển sang tab Document
- Tại đây, bạn có thể lên lịch đăng bài, đặt mức độ hiển thị thành Private hoặc Public , đặt bài đăng thành trạng thái Đang chờ xem xét , chọn định dạng bài đăng và tạo một bài đăng dính
- Phần này cho phép bạn chỉnh sửa permalink của bạn
- Bạn có thể chọn hoặc tạo danh mục mới tại đây
- Thêm thẻ vào bài viết của bạn
- Đặt hình ảnh đặc trưng
- Tạo một đoạn trích thủ công
- Cho phép bình luận, pingback và trackbacks
Như bạn có thể thấy, bạn có rất nhiều tùy chọn để thiết kế một khối đoạn văn (và toàn bộ bài viết) theo bất kỳ cách nào bạn muốn. Nhân tiện, các khối khác nhau đi kèm với các cài đặt khác nhau khi Tài tìm hiểu trong một phút.
Sau đoạn đầu tiên, nhấn phím ENTER lần nữa để tạo một dòng mới (hoặc khối đoạn văn). Bây giờ, chúng ta hãy thêm một hình ảnh bên dưới đoạn đầu tiên.
Thêm hình ảnh trong Gutenberg
Họ nói rằng một bức tranh nói một ngàn từ, và một bài đăng blog không có hình ảnh là tốt, buồn tẻ. Để thêm một hình ảnh trong bài đăng WordPress của bạn bằng Gutenberg, bạn có một vài tùy chọn.
Khi bạn nhấn phím ENTER một vài phút trước, bạn đã kích hoạt một khối đoạn văn mới. Xem như Gutenberg là trực quan, bạn có thể thêm một hình ảnh bằng cách nhấp vào biểu tượng dấu cộng (+), hình ảnh hoặc bìa khi Tài tô sáng trong hình ảnh bên dưới.
Một vài lưu ý:
- Bạn có thể thêm một hình ảnh thông qua các biểu tượng dấu cộng (+)
- Tại đây, bạn có thể thêm một hình ảnh dễ dàng
- Tùy chọn này cho phép bạn thêm ảnh bìa (Những ảnh này thường lớn hơn các ảnh khác. Ngoài ra, bạn có thể thêm văn bản trên ảnh bìa, BTW)
Đi trước và nhấp vào bất kỳ biểu tượng dấu cộng (+) nào. Tiếp theo, nhấp vào tab Hình ảnh , như hiển thị bên dưới.
Nhấp vào tab Hình ảnh sẽ tải khối Hình ảnh được hiển thị trong ảnh chụp màn hình bên dưới.
Các cài đặt phương tiện thông thường
… và hình ảnh thiết lập khối.
Hôm nay bạn có học được gì không? Tài cũng mong là như vậy. Tiếp tục nào.
Sau khi thêm hình ảnh của bạn, Gutenberg thêm một khối đoạn mới ngay bên dưới nó. Bạn có thể thêm bất cứ điều gì bạn muốn, nhưng với mục đích minh họa, Tài đã thêm một số văn bản và sau đó là một nút bên dưới đó.
Cách thêm tệp có thể tải xuống, ví dụ: PDF, hình ảnh, video, v.v.
Gutenberg giúp dễ dàng thêm các tệp có thể tải xuống vào bài đăng hoặc trang WordPress của bạn.
Trong khối Đoạn văn mới , nhấp vào biểu tượng dấu cộng (+), điều hướng đến Khối chung và nhấn vào tab Tệp khi Tài tô sáng bên dưới.
Làm như vậy sẽ khởi chạy khối sau:
Từ khối Tệp , bạn có thể tải lên một tệp mới hoặc thêm một tệp từ thư viện phương tiện của mình. Sau khi thêm tệp của bạn, Gutenberg sẽ tự động thêm nút Tải xuống dễ thương như trong hình bên dưới.
Bạn có thể chơi xung quanh với các tùy chọn. Chẳng hạn, bạn có thể chỉnh sửa / xóa tiêu đề Danh sách kiểm tra PDF miễn phí Gutenberg PDF cũng như nút Tải xuống . Bạn có thể thêm một lớp CSS vào khối và định kiểu nó theo bất kỳ cách nào bạn muốn.
Thêm một trích dẫn trong Gutenberg
Tiếp theo, hãy thêm một trích dẫn bởi vì chúng quyến rũ, lôi cuốn và giúp bạn lái xe về nhà. Trong một dòng mới, nhấp vào dấu cộng (+), điều hướng đến Khối chung và nhấn vào tab Trích dẫn như bên dưới.
Làm như vậy sẽ thêm khối Trích dẫn trong bài đăng của bạn khi Tài nhấn mạnh trong đoạn ghi hình bên dưới.
Lưu ý các cài đặt khối trích dẫn trong thanh bên phải ở trên?
Để thêm trích dẫn của bạn, nhập bên trong khối. Đây là kết quả của tôi.
Thêm phương tiện truyền thông nhúng trong Gutenberg
Gutenberg đi kèm với một số khối để nhúng video và phương tiện khác từ hơn 30 trang web như YouTube, Vimeo, Facebook, SoundCloud, WordPress, Sl slideshoware, v.v.
Để nhúng nội dung, nhấp vào biểu tượng dấu cộng (+), điều hướng đến Nhúng và chọn trang web. Chẳng hạn, Tài muốn YouTube, như hình bên dưới.
Tiếp theo, sao chép-dán URL video YouTube và nhấp vào nút Nhúng như trong hình bên dưới.
Ngay khi bạn nhấn nút Nhúng , Gutenberg sẽ tự động che liên kết thành video khi Tài nhấn mạnh bên dưới.
Cách thêm nút trong Gutenberg
Bạn không nên có một thời gian khó khăn để thêm các khối tại thời điểm này. Chỉ cần nhấp vào dấu cộng (+) và chọn khối của bạn. Nó không thể dễ dàng hơn thế.
Vì vậy, làm thế nào để chúng ta thêm một nút?
Trong một dòng mới (hoặc khối), nhấp vào biểu tượng dấu cộng (+), điều hướng đến Thành phần bố cục và nhấp vào tab Nút như hiển thị bên dưới.
Làm như vậy sẽ dẫn bạn đến khối Nút như Tài chi tiết bên dưới.
Như bạn có thể thấy từ hình ảnh trên, bạn có thể chỉnh sửa văn bản nút và thêm một liên kết. Ngoài ra, bạn có thể tùy chỉnh nút thông qua menu thanh bên bên phải màn hình.
Nhân tiện, nếu bạn sử dụng các kết hợp màu khó đọc trên các nút của mình, Gutenberg sẽ nhanh chóng cho bạn biết . Làm thế nào tốt đẹp?
Cách thêm cột trong Gutenberg
Với một nút đẹp, hãy thêm một số cột. Tài sẽ thêm hai cột, vì vậy hãy theo dõi cẩn thận.
Đây là những gì để làm. Nhấp vào biểu tượng dấu cộng (+), điều hướng đến Bố cục bố cục và nhấp vào tab Cột như trong hình bên dưới.
Gutenberg thêm hai cột theo mặc định. Xem hình ảnh bên dưới, và hãy nhớ rằng, Tài đã thêm nội dung vào các cột rồi.
Không tệ trong vài giây làm việc. Nhưng có lẽ bạn không muốn tạo cột. Có lẽ bạn muốn hiển thị một hình ảnh bên cạnh một số văn bản.
Có một khối cho điều đó? Có, có!
Cách thêm hình ảnh bên cạnh văn bản trong Gutenberg
Bạn đang tìm cách để thêm một hình ảnh bên cạnh một số văn bản? Nếu vậy, bạn sẽ thích phần sau.
Như thường lệ, nhấp vào biểu tượng dấu cộng (+), điều hướng đến Bố cục bố cục và nhấp vào Phương tiện & Văn bản như được hiển thị bên dưới.
Bạn sẽ thấy khối Media & Text , như hiển thị bên dưới.
Tiếp theo, tải lên hình ảnh / video / phương tiện của bạn hoặc thêm một từ thư viện phương tiện. Sau đó, thêm văn bản của bạn bên cạnh phương tiện truyền thông, như thể hiện trong hình ảnh dưới đây.
Tài đã chơi xung quanh với khối Truyền thông & Văn bản , và Tài đã đưa ra những điều sau đây. Tâm trí bạn; Tài cũng cố gắng bóp một nút trong đó
Trông rất chuyên nghiệp đúng không? Bạn chắc chắn có thể tưởng tượng bạn có thể đạt được bao nhiêu với trình soạn thảo Gutenberg.
Khối Gutenberg của bên thứ ba
Các nhà phát triển WordPress rất quan tâm đến việc làm cho các chủ đề và plugin tương thích với trình soạn thảo Gutenberg. Một vài ví dụ bao gồm WooC Commerce, Jetpack và Yoast SEO.
Chẳng hạn, bạn có thể thêm các khối WooC Commerce vào bài đăng WordPress của mình. Đầu tiên, bạn phải cài đặt và kích hoạt WooC Commerce.
Tiếp theo, trong một dòng mới, nhấp vào biểu tượng dấu cộng (+), điều hướng đến WooC Commerce và chọn bất kỳ khối nào bạn muốn như hiển thị bên dưới.
Bạn có biết nó có nghĩa là gì không? Nó có nghĩa là bạn có thể tạo đa phương tiện và các bài đăng và trang tuyệt vời trong vài phút.
Các khối đáng chú ý khác
Tài đã có hơn 2.000 từ và nếu Tài tiếp tục, Tài sẽ viết toàn bộ Sách điện tử. Lời cầu nguyện của Tài là bây giờ bạn có thể sử dụng Gutenberg mà không có bất kỳ trục trặc nào.
Đây là một danh sách các khối có sẵn khác.
- Widgets – Bạn có thể thêm nội dung từ widget vào bài đăng trên blog
- Shortcodes – Bạn vẫn có thể sử dụng shortcodes WordPress gốc
- Cổ điển – Một khối tuyệt vời chứa nội dung cũ của bạn
- Thêm – Khối trước đây được gọi là thẻ Đọc thêm
- Trang Break, Dấu phân cách, Miếng đệm
- HTML tùy chỉnh, Pullquote, Bảng
- Thư viện và âm thanh / video HTML5
- Và nhiều hơn nữa tùy thuộc vào chủ đề và plugin bạn sử dụng
Ngoài ra : Tạo một trang WordPress tương tự như tạo một bài đăng tiết kiệm cho một vài phút khác biệt, vì vậy Tài sẽ không đi sâu vào vấn đề đó ngày hôm nay.
Phím tắt Gutenberg & Phím tắt nhanh
Gutenberg đi kèm với một vài hack và phím tắt giúp dễ dàng hơn. Chẳng hạn, nếu bạn gõ Cấm / Hồi trong một khối đoạn văn, nó sẽ hiển thị một danh sách các khối.
Thậm chí, bạn có thể chọn một khối cụ thể bằng cách nhập tiêu đề của khối sau dấu gạch chéo ngược (/), ví dụ: gõ vào bộ ảnh / hình ảnh sẽ hiển thị khối hình ảnh trong số các khối liên quan đến hình ảnh khác. Xem hình ảnh dưới đây để biết thêm chi tiết.
Phím tắt trên bàn phím: Để xem tất cả các phím tắt khả dụng, nhấn SHIFT + ALT + H trong Windows và OPT + CTRL + H trong Mac.
Ở đầu tài liệu, bạn có thể thấy cấu trúc tài liệu bằng cách nhấp vào biểu tượng (i), như hiển thị bên dưới.
Đẹp. Cực kỳ trơn tru.
Ồ, và nhân tiện, lỗi Cập nhật không thành công của Cập nhật thường xảy ra do kết nối internet bị rớt
Giữa bạn và tôi, Gutenberg là một biên tập viên nội dung tuyệt vời. Miễn là bạn sẵn sàng học điều này; bạn có thể gặt hái được nhiều thứ từ trình soạn thảo WordPress trong tương lai.
Gutenberg vẫn còn tương đối trẻ, và bạn có thể hy vọng nó sẽ phát triển về khả năng sử dụng và chức năng. Nó sẽ là một lực lượng nghiêm trọng để tính toán trong những ngày tới. Những người xây dựng trang tốt hơn nên coi chừng, nếu không họ sẽ hết việc
Tài hy vọng hướng dẫn từng bước của Tài để biên tập viên Gutenberg đã giúp bạn đưa mọi thứ vào quan điểm. Tài tin rằng bây giờ bạn có thể sử dụng trình chỉnh sửa khối để tạo nội dung như một chuyên gia.
Hãy chia sẻ mối quan tâm, suy nghĩ và câu hỏi của bạn trong phần bình luận bên dưới nếu bạn cũng đang gặp khó khăn về trình chỉnh sửa Gutenberg nhé
titanic.vn .
