Hướng dẫn sử dụng trình soạn thảo mới WordPress 5.0 – Gutenberg

WordPress-5.0

Vào những ngày cuối năm 2018, WordPress chính thức nâng cấp lên phiên bản 5.0. Nếu ai đã “lỡ nâng cấp” mà chưa chuẩn bị sẵn sàng. Thì sẻ vô cùng bỡ ngỡ với trình soạn thảo WordPress có quá nhiều thay đổi…

Phiên bản WordPress 5.0 được coi là bước đột phá có nhiều cải tiến như: Trình soạn thảo Gutenberg mới, cập nhật Twenty Nineteen theme, và vá các lỗi bảo mật ở phiên bản cũ.

Ở phiên bản WordPress 5.0 này. Trình soạn thảo Gutenberg không còn là plugin nữa, mà được tích hợp làm trình soạn thảo mặc định của WordPress.

Trong bài viết này, Bảo sẻ hướng dẫn bạn chi tiết sử dụng trình soạn thảo mới của WordPress 5.0. Cách để quay lại trình soạn thảo WordPress cổ điển.

Gutenberg là gì?

Gutenberg WordPress Editor là trình biên tập, soạn thảo mới của WordPress được đặt theo tên của Johannes Gutenberg – nhà phát minh máy in di động. Gutenberg được tích hợp làm trình soạn thảo mặc định trong phiên bản WordPress 5.0. Nghĩa là Gutenberg sẽ thay thế WordPress TinyMCE Editor (trình biên tập chúng ta đang sử dụng trong WordPress hiện tại)

Gutenberg-là-gì
WordPress 5.0 chính thức sử dụng Gutenberg làm trình soạn thảo mặc định

Gutenberg Editor được phát triển dựa trên khái niệm block. Do vậy, mọi thứ trong Gutenberg sẽ xoay quanh block. Các block trong trình soạn thảo Gutenberg cho phép bạn thêm mọi loại nội dung vào bài viết, trang. Và có thể chỉnh sửa chúng một cách độc lập với các block khác.

Bạn có thể di chuyển block lên xuống, chuyển đổi qua lại dạng của block từ tiêu đề sang đoạn, hoặc từ đoạn sang trích dẫn…

Hướng dẫn sử dụng trình soạn thảo mới WordPress 5.0 – Gutenberg

Trước tiên, chúng ta hãy tìm hiểu giao diện trình soạn thảo WordPress có gì mới?

trình-soạn-thảo-mới-WordPress-5.0
WordPress 5.0 thay đổi hoàn toàn giao diện soạn thảo

Giải thích các vị trí:

1-Add block: thêm khối

Có thể khằng định tất cả tinh tuý của trình soạn thảo Gutenberg nằm trong add block!

Bạn có thể thêm tiêu đề, đoạn, hình ảnh, bảng, nút…hoặc có thể nhúng bất cứ thứ gì từ Youtube, Facebook, Twitter…

2-Undo/Redo

3-Content structure: Thống kê bài viết: số lượng từ, thẻ heading, block, đoạn văn của bài viết.

4-Block navigation: Mục lục các block, cho phép bạn di chuyển nhanh tới block mong muốn

5-Save draft: Lưu bản nháp

6-Preview: Xem trước bài viết, trang

7-Publish: Đăng bài viết

8-Setting: Ẩn hiện các cài đặt

9-Yoast SEO: Sử dụng Yoast SEO bên phải

10-More tools & options: Mở thêm các công cụ & tùy chọn

11-Block: Thao tác với block, chỉnh kích thước, màu chữ, màu nền…

12-Document: Thao tác với văn bản:

Status & Visibility: Chế độ hiển thị, ngày giờ đăng…

Permalink: Đường link của bài viết

Categories: Chọn bài viết nằm ở categories nào

Tags: Gắn tags cho bài viết

Featured image: Chọn hình đại diện cho bài viết

Excerpt: Viết tóm tắt cho bài viết

Discussion: Thảo luận, cho phép bình luận hay không

13-Change Permalinks: Thay đổi tên đường link

14-Tiêu đề bài viết, tiêu đề cũng chính là thẻ H1

15-Đoạn văn bản, nội dung của bài viết.

Cách sử dụng thẻ tiêu đề (Heading)

Mặc định thẻ tiêu đề đầu tiên là tiêu đề của bài viết và cũng là thẻ H1. Bạn chỉ được phép gõ nội dung mà không được phép chỉnh sửa bất thứ gì.

trình-soạn-thảo-mới

Từ thẻ tiêu đề thứ 2 trở đi bạn có thể chỉnh sửa: Thay đổi từ H2 đến H6, canh lề, định dạng, chèn link…

Cách sử dụng đoạn (Paragraph)

Trình soạn thảo Gutenberg quy định mỗi block là một đoạn, bạn có thể dùng chức năng add block để thêm mới một đoạn hoặc đơn giản hơn là nhấn Enter.

cách-tạo-block

Vậy muốn xuống dòng trong block thì làm thế nào? Đơn giản là bạn chỉ cần dùng tổ hợp phím Shift + Enter

Xoá block: Chọn vào dấu 3 chấm ở của sổ soạn thảo, rồi chọn Remove Block. Hoặc đơn giản hơn, là để con trỏ chuột vào vị trí đầu tiên của block và ấn phím Backspace trên bàn phím.

cách-xoá-block

Một điểm trừ rất lớn của trình soạn thảo Gutenberg, là bạn chỉ có thể định dạng cho đoạn văn một cách rất sơ sài.

trình-soạn-thảo-mới

Không có chức năng canh đều 2 bên (bài viết của bạn sẻ thật thiếu chuyên nghiệp khi những câu chữ chồi sụt không đều).
Bạn có thể chỉnh màu chữ và màu nền cho cả block, nhưng không thể chỉnh màu cho một vài chữ trong đoạn đó.
Đặc biệt bạn không thể thay đổi Font chữ và nhiều thứ khác nữa.

Tôi không hiểu trình soạn thảo Gutenberg chuyên thiết kế Landing Page. Mà lại thiếu quá nhiều thành phần định dạng như thế?

Tuy nhiên, có một cách để bổ sung các định dạng còn thiếu là bạn có thể tạo một block dạng classic. Khi đó bạn có thể thêm nhiều tuỳ chọn định dạng với thanh Editor menu.

trình-soạn-thảo-cổ-điển

Chèn hình ảnh

Bấm vào add block – Image sau đó chọn nguồn bức ảnh

chèn-hình-trình-soạn-thảo-mới

Bạn có thể thêm trực tiếp ghi chú hoặc Alt Text cho ảnh.

chèn-hình-ảnh-vào-trình-soạn-thảo-mới

Hoặc đơn giản nhất là kéo hình ảnh vô vùng soạn thảo văn bản. Cách này làm tương tự như Microsoft Word

Thêm khối nhúng

Bấm vào add block – Embeds, chọn trang cần nhúng, copy đường link của trang cần nhúng rồi nhấn Embed.

cach-nhúng-WordPress-5.0

Nếu báo lỗi như hình thì không sao, bạn vẫn nhúng thành công

cách-nhúng-WordPress-5.0

Bạn có thể nhúng dể dàng với trình soạn thảo Gutenberg

nhúng-bằng-Gutenberg

Thêm và tạo kiểu khối nút

Đây là một điểm cộng và được nhiều người đánh giá rất cao ở Gutenberg. Vì bạn có thể dể dàng thiết kế nút kêu gọi hành động rất đơn giản và đẹp mắt.

Bấm vào add block – Layout Elements – Button

Nhập tên nút, chọn màu nền và màu chữ

Nhập URL cho nút

tạo-nút-bằng-Gutenberg

Và còn rất nhiều thao tác khác với block…

Cách trở về trình soạn thảo wordpress cổ điển

Nếu bạn không thích trình soạn thảo Gutenberg vì đã quá quen thuộc với trình soạn thảo WordPress cổ điển.

– Bạn chỉ cần cài plugin Classic Editor để quay lại trình soạn thảo củ.

– Hoặc có một cách đơn giản hơn là sử dụng plugin TinyMCE Advanced mà bạn đang dùng:

Settings – TinyMCE Advanced – Advanced Options, đánh dấu tick vào Replace the Block Editor with the Classic Editor sau đó save lại.

chuyển-trình-soạn-thảo

Thế là lại trở về trình soạn thảo WordPress quen thuộc rồi

Kết

Trình soạn thảo WordPress Gutenberg tuy còn nhiều vấn đề cần cải tiến. Nhưng vẫn có khá nhiều ưu điểm giúp bạn thao tác nhanh và dể dàng hơn. Dù muốn dù không, bạn vẫn phải tập làm quen với trình soạn thảo WordPress Gutenberg này. Vì Gutenberg đã trở thành một phần của Wordpress.

Nếu bạn biết thêm thủ thuật hay cách nào hay hơn, khi sử dụng trình soạn thảo WordPress Gutenberg. Hãy comment bên dưới để tôi và các bạn khác có thể học thêm nhé!

Đọc thêm:

Hướng dẫn sử dụng trình soạn thảo mới WordPress 5.0 – Gutenberg
5 (100%) 2 vote[s]

25 Comments on “Hướng dẫn sử dụng trình soạn thảo mới WordPress 5.0 – Gutenberg

  1. wakesheriff.org says:

    Amazing guide in addition to right to the point. I not really know if this reason is actually the best situation to pose yet will you humans have whatever exactly what
    it restaurants to implement quite a few ghost writers?
    Thank you ??

  2. Hotty desire says:

    Image lack of temporarly, but this time Walking out to as to why That i used
    to absolutely love this web page. Many thanks , I may be
    sure to look with ease. How frequent you if you wish to page?

  3. Shania Forbes says:

    I really like this particular website substantially, The an important
    really nice billet to understand and find details .
    “The marketplace cracks every body, together with soon, the majority is strong with
    the destroyed websites.” simply by Ernest Hemingway.

  4. Ricky says:

    Howdy my friend! Let me mention that this informative article rocks !, pleasant composed accessible together with most
    necessary infos. I wish to specialist extra items like that.

  5. homewakaba.com says:

    I have been simply looking just for this info long. Immediately following 6 hours in steady Googleing, last but not least I got
    the item on your own online business. I wonder what’s the deficiency of Bing process of which don’t
    rank well this informative websites when it comes to
    surface of the checklist. These very best internet websites can be
    rich in garbage.

  6. http://www.meplayers.cambridge-experts.co.uk/ says:

    Hello, I’m quite delighted I’ve discovered this
    data. In the present day people present no more gossips and internet which is essentially annoying.
    A superb blogging site using useful article content, that’s some tips i need
    to have. Appreciate having this amazing site,
    I’ll possibly be touring the software. Is the next step updates?
    Are not able to believe that it is.

  7. Sheridan Eland says:

    I am going to thnkx for those endeavors you possess put in writing this blog.
    I’m expecting the very same high-grade blog put up on your
    part through the long term at the same time.
    In truth your imaginative way with words-at all carries motivated others to have my own ring web-site presently.
    The writing will be dispersion it’s wings speedily.
    The blog post is an effective style of this.

  8. www.revistascientificas.udg.mx says:

    I’d like to thnkx for the initiatives you’ve got make a note of this website.

    I’m with the hope identical high-grade web site blog post from your website inside next furthermore.
    In truth any creative writing ability has urged people to get our
    web pages currently. The writing a blog might be thinning out her chicken wings fast.
    The document a great type of it again.

  9. Shirl Chichester says:

    Image missing for some time, nevertheless Going the key reason why That i used to cherish this
    web page. Thanks , For certain i will make sure to look more regularly.
    Are you going to everyone have more webpage?

  10. ats-ottagono.it says:

    I did previously beI was basically recommendedsuggested the blogwebsiteweb internet
    site throughviaby method ofby means ofby my very
    own nephew. I actually amI’m nowadays notnotno
    lengthier surepositivecertain whetherwhether or not this valuable postsubmitpublishput
    way up is presented throughviaby strategy ofby methods ofby your
    man simply because virtually no onenobody else realizerecognizeunderstandrecogniseknow these sort of specificparticularcertainpreciseuniquedistinctexactspecialspecifiedtargeteddetaileddesignateddistinctive approximatelyabout
    my problemdifficultytrouble. Anyone areYou’re amazingwonderfulincredible!

    Say thank you to youThanks!

  11. HottyDesire says:

    We are several volunteers together with cracking open a new scheme
    within our neighborhood. Your internet site provided
    us with helpful data to get results on. You’ve achieved an extraordinary project as well as your totally
    community shall be thankful to you.

  12. hotty Desire says:

    Awesome web site. Enough useful information these. I am posting the
    idea to a few family and friends ans additionally revealing during
    great tasting. And indeed, thanks a ton within your sebaceous!

  13. Hotty Desire says:

    It is excellent as your other blog threads : N, regards for creating.
    “So, and not seem imprudent afterward, That i renounce appearing to be ingenious these days.” with Invoice for Baskerville.

  14. Kiersten says:

    Hello would you mind stating which blog platform you’re using?
    I’m going to start my own blog in the near future but I’m having a hard time deciding between BlogEngine/Wordpress/B2evolution and Drupal.
    The reason I ask is because your design seems different then most blogs and I’m looking for something completely unique.
    P.S Apologies for getting off-topic but I had to ask! I have been browsing online more than 4 hours today, yet I never found any interesting
    article like yours. It is pretty worth enough for me. In my
    view, if all web owners and bloggers made good content as
    you did, the internet will be a lot more useful than ever before.
    Wow, this paragraph is fastidious, my sister is
    analyzing these kinds of things, therefore I am going to inform her.

    http://starbucks.com

  15. Shayna Catledge says:

    Superb blog page listed here! Too your web blog a lot
    ” up ” rapid! Which hold are you working with? Am i allowed to obtain a internet affiliate connect with the multitude?
    I wish my website crammed as swiftly when your own property haha

  16. www.axiamedica.it says:

    Hi t? famkily user! I really ?ould like to imply th?longer th??
    blog post ?lenses wonderful, gre?l wr?tten and h?us through app?oximately ?lmost
    all significant infos. ? ?ould li?electronic to peer added posts ?ike this kind of .

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *