Những Hướng Dẫn Cần Thiết Và HTML Cheat Sheet (Danh Mục HTML) Cho Các Content Marketert

25/04/2020 - 07:00 4798     0

Trong nền kinh tế hiện nay, có thể bạn đã nghe rất nhiều về tầm quan trọng của việc phát triển kỹ năng viết code. Tuy nhiên, không phải tất cả các blogger hay những content marketer đều quen thuộc với thuật ngữ  HTML. Ngay cả những người đã biết một ít về code trong chúng ta, vẫn cần phải hiểu và học thêm nhiều điều nữa về code.

Trong công việc của bạn, bạn có thể không cần phải biết làm thế nào để xây dựng toàn bộ một trang web từ đầu đến cuối, ngoài kĩ năng soạn thảo văn bản và trí thông minh của mình. Tuy nhiên, nếu bất kỳ phần nào trong công việc của bạn liên quan đến WordPress hoặc một hệ thống quản lý nội dung khác thì việc biết một ít về code có thể vô cùng hữu ích.

 

Dưới đây là một vài lý do tại sao:

  • Hiểu HTML có thể giúp bạn biết được blog hoặc trang web của bạn được cấu trúc như thế nào.
  • Kể cả biết được một chút về code cũng có thể giúp bạn tự cung cấp được thông tin cho bản thân (và nó có thể giúp bạn tiết kiệm thời gian trong việc hỏi han người khác).
  • Bạn sẽ có thể sửa các vấn đề định dạng WordPress khó chịu một cách dễ dàng hơn và  không còn cảm giác bực bội mỗi khi ngồi trước máy tính nữa.

Trong bài đăng này, chúng tôi sẽ giới thiệu đến các khái niệm cơ bản nhất cho những độc giả tập trung vào blog. Nếu bạn chưa bao giờ làm việc với HTML, thì đây chính là sự khởi đầu hoàn hảo nhất để giúp bạn bắt đầu.

Nếu bạn đã có chút kinh nghiệm về code web, bạn vẫn có thể tìm thấy một hoặc hai mẹo mới hữu hiệu.

Nếu bạn là một marketer hoặc blogger làm việc với WordPress, và bạn đang bị đe dọa bởi khối lượng "những người-biết-cái gì" bạn thấy khi nhấp vào trình soạn thảo văn bản trong CMS của bạn, thì bài đăng này chính là dành cho bạn.

Mặc dù bạn có thể hoàn thành hầu hết các nhiệm vụ được phác thảo trong bài đăng này bằng cách sử dụng chuẩn WYSIWYG (Những gì bạn thấy là những gì bạn lấy được) trình điều chỉnh chỉnh sửa WordPress, biết cách làm những việc theo cách cũ mà vẫn còn có lợi (đặc biệt là khi mọi thứ đi sai hướng và những trình chỉnh sửa điều khiển kia dường như chẳng giúp đỡ được gì).

Chuẩn WordPress cung cấp rất nhiều năng lượng. Tuy nhiên, nó không phải lúc nào cũng hoàn hảo và đôi khi chỉnh sửa dạng nội dung của bạn theo cách thủ công còn nhanh hơn.  Đó là khi một số kiến ​​thức HTML cơ bản có ích.

HTML là gì?

HTML là viết tắt của Hyper Text Markup Language. Nó tạo thành cấu trúc của một trang web và là xương sống của Internet kể từ thời kì sơ khai (hoặc ít nhất là đến thời kì đang trỗi dậy của Internet hiện đại).

HTML được sử dụng kết hợp với CSS (Cascading Style Sheets), để kiểm soát sự xuất hiện của một trang web. Mục đích của bài đăng này, chúng tôi sẽ chỉ tập trung vào HTML và chỉ trên một số ít các tag mà người mới bắt đầu có thể sử dụng.

Video này cung cấp cái nhìn tổng quan nhất về cách các tài liệu HTML được tạo ra (xem nội dung này trước khi bạn tiến hành):

Có vẻ như hôm nay bạn sẽ phải tiếp nhận nhiều thông tin đấy. Chúng ta sẽ lướt quá các thông tin ở đây một chút nhé..

Mẹo hay cho bạn: Bạn có thể xem mã nguồn của trang web trong hầu hết các trình duyệt. Điều này rất hữu ích cho việc xem cách trang web được xây dựng thế nào qua việc quan sát chính bản thân mã code của nó. Dưới đây là cách thực hiện việc này trên một số trình duyệt web phổ biến:

  • Google Chrome: Nhấp chuột phải và chọn View Page Source (Xem Nguồn Trang).
  • Firefox: Nhấp chuột phải và chọn View Page Source.
  • Safari: Mở Preferences, chọn Advanced, và nhấn "Show Develop Menu In Menu Bar" ở phần dưới. Sau đó, đi tới trình “Develop menu" và chọn “Show Page Source".
  • Internet Explorer: Nhấn chuột phải và chọn View Source, hoặc nhấn phím F12 trên bàn phím.
  • Microsoft Edge: Nhấp chuột phải và chọn View Source, hoặc nhấn phím F12 trên bàn phím của bạn.

Dưới đây là ví dụ về trang chủ của Google với tùy chọn Show Page Source trong Safari trên Mac OS X.

Tại sao Blogger và Content Marketer cần biết về HTML?

Nếu bạn đã từng cố gắng chỉnh sửa nội dung trong WordPress, thì bạn biết rằng các chức năng định dạng đôi khi sẽ không làm việc theo đúng cách bạn muốn. Đó là bởi vì các biên tập WYSIWYG không phải lúc nào cũng hoạt động cũng như dự định. Ví dụ, một danh sách với các dấu gạch đầu dòng có thể xuất hiện với khoảng trắng. Văn bản của bạn có thể không sao chép và dán chính xác. Bạn có thể muốn thay đổi màu sắc cho chủ đề blog của bạn, nhưng bạn có thể không biết làm thế nào.

Đây chỉ là một vài vấn đề mà bạn có thể gặp phải. Tuy nhiên, nếu bạn biết một chút về HTML, bạn có thể khắc phục được. Bạn sẽ trở thành một marketer có năng lực và là một nhân viên có nhiều giá trị hơn.

Một số điều tôi có thể làm với HTML là gì?

Nhìn chung, bạn sẽ kiểm soát được nhiều hơn cấu trúc nội dung và hình thức của bạn.

Dưới đây là một số tác vụ cụ thể blogger và marketer có thể giải quyết bằng HTML:

  • Tạo và chỉnh sửa liên kết văn bản.
  • Kiểm soát cấu trúc đoạn.
  • Sửa danh sách bị hỏng.
  • Xây dựng các bảng.
  • Loại bỏ khoảng cách không mong muốn.

Đây chỉ là một vài điều hữu ích bạn sắp được học về cách làm. Nếu bạn chưa bao giờ động vào phần Text view section ( xem văn bản) của các bài đăng WordPress của mình, có thể bạn cũng sẽ cảm thấy tự tin hơn về kỹ năng của bạn.

Lời động viên: Học về HTML không phải là quá khó khăn. Là một blogger hoặc một marketer, bạn không nhất thiết cần phải biết tất cả bước làm để xây dựng toàn bộ trang web từ đầu. Đến khi bạn đọc xong bài đăng này, bạn sẽ học được nhiều  nhất những thứ bạn cần biết.

Tại sao tôi cần một HTML Cheat Sheet?

Nếu bạn chưa có, chúng tôi khuyên bạn nên tải xuống trang HTML cheat sheet kèm theo bài đăng này. Nó hữu ích cho bạn để có trong tay tất cả các thẻ HTML thông thường có thể truy cập được.

Làm Thế Nào Để Viết Html Với Những Tập Tin Văn Bản Và Một Trình Duyệt

Bạn đã sẵn sàng để viết và chỉnh sửa HTML? Bạn có thể bắt đầu ngay bây giờ bằng cách sử dụng trình soạn thảo văn bản trong bất kỳ bài đăng WordPress nào. Tuy nhiên, bạn cũng có thể sử dụng Notepad (Windows), TextEdit (Mac) hoặc Sublime Text (Mac, Windows, Linux) và tuỳ chọn trình duyệt web của bạn.

Mẹo nâng cao: Nếu bạn chưa bao giờ nghe đến Sublime Text, thì đó là một trình biên tập văn bản thuần túy hữu ích cung cấp nhiều tính năng hơn Notepad hoặc TextEdit. Nó đặc biệt hữu ích cho việc viết HTML bởi vì nó tự động mã màu cho các phần khác nhau trong code của bạn, làm cho mọi thứ được đọc dễ dàng hơn.

Hãy thực hiện theo các bước sau để tạo được một tệp HTML đơn giản:

1. Tạo tệp tin trống .txt. Viết HTML của bạn. Sau đó lưu tài liệu dưới dạng file HTML.

Dưới đây là ví dụ về file HTML mà chúng tôi tạo ra:

2. Nhấp vào file trong thanh điều hướng trên cùng của bạn. Sau đó, cuộn xuống để mở nó.

3. Chọn File HTMLmở ra. Nó sẽ trông như sau

Mẹo hay cho bạn: Nhớ rằng văn bản .text của bạn cần được lưu dưới dạng tệp .html.

Hướng dẫn HTML cơ bản dành cho người mới bắt đầu

Bây giờ bạn đã hiểu định nghõa và cách hoạt động của của HTML(và bạn đã tải xuống HTML cheat sheet, đúng không?), Hãy bắt đầu một số hướng dẫn HTML cơ bản.

Cách định dạng văn bản bằng HTML

Hãy bắt đầu với một số định dạng văn bản cơ bản.

Cách Tạo tiêu đề

HTML sử dụng sáu mức độ khác nhau của các tiêu đề. Chúng được cấu trúc như sau:

Đây là những gì chúng được tạo ra trên blog CoSchedule:

Một số điều cần lưu ý về thẻ tiêu đề:

  • Cách tốt nhất là bao gồm một thẻ Heading 1 (điều này rất quan trọng đối với SEO). Nói chung, các chủ đề WordPress sử dụng các thẻ Heading 1 cho tiêu đề blog post. Hãy ghi nhớ điều này khi định dạng tiêu đề.
  • Có thể bạn sẽ sử dụng nhiều thẻ H2, H3, etc. cho mỗi bài đăng.
  • Không có vấn đề gì cả nếu bạn sử dụng thẻ tiêu đề "không đúng thứ tự" (ví dụ: H2 của bạn thấp hơn trong transo với H3). Dưới đây là một lời giải thích hữu ích về thẻ tiêu đề từ Matt Cutts:
Cách in đậm văn bản

Nếu bạn muốn làm văn bản đậm, hãy sử dụng thẻ này:

Strong: <strong>Insert Text</strong>

Trước đây, bạn có thể đã thấy văn bản được in đậm bằng cách sử dụng <b>Insert Bolded Text</b> tag. Trong khi thẻ <b></b> vẫn hoạt động, nhưng nó được xem là đã lỗi thời. Đối với bài đăng này, chúng tôi sẽ đưa ra các phương pháp hay nhất và gợi ý thẻ  <strong></strong> thay thế.

Làm thế nào để văn bản được in nghiêng

Tương tự như làm văn bản in đậm, có hai thẻ khác nhau mà bạn có thể sử dụng để tạo chữ nghiêng. Thẻ  emphasis (nhấn mạnh) là thẻ tốt nhất để sử dụng:

Emphasis:  <em>Insert Text</em>

Bạn có thể đã thấy văn bản in nghiêng bằng thẻ <i>Insert Text</i>  nhưng nhắc lại một lần nữa, thẻ này được coi là đã lỗi thời.

Cách tạo đoạn văn bản bất kì

Để tạo một đoạn văn bản, hãy sử dụng<p>Insert Text</p>. Dứới đây là 1 ví dụ

Cách ngắt đoạn

Nếu bạn muốn có một không gian giữa hai dòng nội dung, hãy xem xét để sử dụng ngắt trang. Chỉ cần thêm thẻ <br> giữa các dòng nội dung, như sau:

Chúng tôi không thực sự nghĩ rằng chúng tôi là thiên tài, và tôi chắc chắn không phải Shakespeare. Chúng tôi chỉ muốn đảm bảo rằng bạn vẫn đang chú ý.

Cách Tạo một đoạn trích dẫn

Nếu bạn có một câu trích dẫn mất vài dòng (hoặc nhiều hơn), nó phải được định dạng trong thẻ trích dẫn (block quote). Bạn có thể làm điều này trong WordPress bằng cách nhấp vào đây:

Hoặc, bạn có thể tóm tắt văn bản bằng cách sử dụng thẻ này: <blockquote> Chèn văn bản </ blockquote>.

Dưới đây là cách thẻ trích dẫn xuất hiện trên blog của chúng tôi:

Cách tạo và chỉnh sửa các liên kết sử dụng HTML

Bạn có thể nghĩ, "WordPress làm cho nó dễ dàng để tạo liên kết hơn, phải không?"

Tuy nhiên, vẫn có giá trị trong việc biết cách làm thế nào để tự tạo liên kết. Thêm vào đó, có một số điều mà WordPress không thể làm khi liên kết, cần phải được thực hiện theo cách thủ công.

Chúng ta hãy xem qua cách các liên kết được xây dựng như thế nào trong HTML, làm thế nào để liên kết giữa các phần khác nhau của một bài viết riêng lẻ (đây là cách tiện dụng để xây dựng một bảng nội dung) và làm thế nào để thêm các thuộc tính no-follow ( chúng có tiềm năng mạnh mẽ cho SEO) .

Văn bản được liên kết đi đến đây

Làm thế nào để Xây dựng một “Href”

Để tạo liên kết văn bản, bạn cần sử dụng thẻ "href". Hãy xem hình ảnh dứới đây:



Đặt URL mà bạn muốn tại đây (đây sẽ là trang bạn liên kết đến) và anchor text (văn bản được liên kết mà người đọc sẽ nhấp) ở nơi đã được lưu ý.

Mẹo nâng cao: Internal links (Liên kết nội bộ) (các liên kết trực tiếp tới các trang khác hoặc các bài đăng trên trang web của bạn) và external links (liên kết ngoài) (các liên kết trực tiếp tới các trang web khác) được tạo theo cùng một cách.

Đây là một ví dụ:

Dưới đây là kết quả cuối cùng:

Làm thế nào để tự chỉnh sửa liên kết Anchor Text

Giả sử chúng ta muốn thay đổi đoạn anchor text được ví dụ ở trên. Trong trường hợp này, chỉ cần mở tùy chọn Text view option  (Xem văn bản) trong WordPress. Sau đó, xóa văn bản anchor text hiện có và viết lại nó.

Khá là dễ dàng phải không?

Đó là tất cả những gì bạn cần làm.

Mẹo nâng cao: bạn đã nghe chúng tôi đề cập đến anchor text vài lần. Nếu bạn không biết về chúng, thì hãy hiểu nó chỉ đơn giản chỉ là văn bản có thể nhấp vào, được sử dụng để tạo liên kết.

Làm thế nào để thêm thuộc tính no-follow trong liên kết

Nếu bạn biết một chút về SEO (tối ưu hóa công cụ tìm kiếm), thì bạn có thể biết về các link follow và  no-follow.

Tóm lại, các công cụ tìm kiếm sử dụng liên kết để xác định tầm quan trọng của các trang web. Khi một trang web liên kết đến một trang web khác, họ coi đây là một phiếu bầu hoặc một sự xác nhận rằng "Nội dung này hữu ích và có liên quan đến trang web liên kết đến nó."

Tuy nhiên, có thể có những lần bạn không liên kết đến đúng những trang có thẩm quyền khác. Đây là vài ví dụ:

  • Bạn đang liên kết đến một trang không có uy tín (nhưng có thể liên quan đến bài đăng blog của bạn).
  • Bạn đang viết một bài đăng được tài trợ (mua hoặc bán liên kết là SPAM và các công cụ tìm kiếm có thể xem xét các liên kết nội dung được tài trợ này).
  • Bạn đang viết một bài đăng trên guest blog (blog của khách) hoặc lưu trữ một bài đăng của khách trên blog của riêng bạn. Điều quan trọng là liên kết trong thông tin của tác giả trong bài đăng khách được gắn nhãn no-follow, những điều này thường bị lạm dụng vì có lợi SEO.

Các liên kết trang web mà bạn có có chất lượng càng cao, bạn càng có nhiều khả năng xếp hạng tốt trong công cụ tìm kiếm. Tuy nhiên, cũng vì lý do này, có nhiều người cố gắng để spam các công cụ tìm kiếm bằng việc tạo các liên kết quá nhiều (bao gồm cả việc mua liên kết và viết các bài viết trên blog rác chỉ để có được backlinks mà không quan tâm đến chất lượng nội dung).

Để biết thêm thông tin trực tiếp từ Google về lý do tại sao bạn nên sử dụng các liên kết no-follow trên những bài đăng guest blog, hãy xem video này từ Matt Cutts, cựu trưởng nhóm spam web của Google:

Để thêm thuộc tính no-follow vào liên kết văn bản, hãy thêm mã rel = "nofollow" vào HTML href:

Đơn giản như vậy thôi.

Làm thế nào để liên kết sâu đến một bài Blog cụ thể

Bây giờ bạn đã biết cách làm thế nào để thêm liên kết đến một trang khác hoặc trang web khác. Tuy nhiên, làm thế nào để bạn liên kết đến phần khác trong cùng một bài đăng blog?

Thực hiện theo các bước sau:

  1. Chuyển sang tab Text view (Chế độ xem văn bản) trong WordPress và thêm thẻ này: <a name="NAME"> </a>.
  2. Xóa văn bản giữ chỗ của NAME và viết Anchor Text theo mong muốn của bạn.
  3. Thêm <a href="#NAME"> </a> vào vị trí bạn muốn liên kết.

Đây là hình ảnh của đoạn code này trong WordPress (chúng tôi đã sử dụng Lorem Ipsum filler text, chỉ cho các mục đích minh họa):

Dưới đây là kết quả cuối cùng:

Bây giờ, chúng ta có thể điều hướng từ đầu trang sang phần tiếp theo chỉ bằng một cú nhấp chuột. Tuy nhiên, có một vấn đề: chúng ta không thể quay trở lại phía đầu trang một cách dễ dàng.

May mắn thay, có một giải pháp cực kì dễ dàng.

Chúng ta sẽ thêm liên kết "Back to Top" bên dưới phần "Here’s Something About Lorem Ipsum". chúng tôi cũng sẽ thêm một điểm đến đích ở đầu trang mà không có anchor text (làm cách này, liên kết sẽ trực tiếp dẫn lên đầu trang và sẽ không có văn bản không mong muốn nào xuất hiện cho người đọc).



Dưới đây là cách liên kết Back to the top xuất hiện

Vì chúng tôi đã không dùng anchor text cho đích đến liên kết này nên không có gì hiển thị cho người đọc. Tuy nhiên, việc nhấp vào "Back To The Top" vẫn hướng đến đầu bài viết trên blog.

Cách xây dựng danh sách trong HTML

Có hai loại danh sách khác nhau mà bạn có thể tạo khi sử dụng HTML. Đó là các danh sách có dấu đầu dòng (hoặc không có thứ tự) và danh sách được đánh số (hoặc có thứ tự). Dưới đây là cách để tạo ra chúng (biết cách xây dựng thủ công có thể giúp bạn chỉnh sửa chúng một cách dễ dàng bằng tay trong trường hợp WordPress làm rối loạn định dạng của chúng).

Làm thế nào để Tạo một định dạng có dấu đầu dòng (bulleted list)

Thật dễ dàng để tạo danh sách có dấu đầu dòng (hoặc "danh sách không có thứ tự") bằng cách sử dụng nút thích hợp trong thanh công cụ WordPress của bạn:

Bạn cũng có thể làm thủ công:

Kết quả sẽ ra như sau

Tại sao bạn lại nói với tôi điều này?

Bạn đã bao giờ thử tạo một danh sách có dấu đầu dòng, chỉ trong WordPress và  bằng cách nào đó nó gây rối cho định dạng của bạn? Đôi khi, các vấn đề định dạng nhỏ dễ dàng sửa chữa bằng cách sử dụng thanh chỉnh sửa WYSIWYG. Tuy nhiên, đôi khi nó sẽ như thế này:

Trong trường hợp WordPress không hoạt động, chỉnh sửa danh sách HTML bằng tay sẽ nhanh hơn bao giờ hết.

Cách tạo một danh sách có đánh số

Để tạo danh sách được đánh số (hoặc "danh sách có thứ tự"), hãy làm theo các hướng như đã trình bày ở trên, nhưng thay thẻ <ul> và </ ul> thành <ol> và </ ol>.

Kiểm tra lại danh sách sau:

Cách xây dựng một bảng nội dung trong HTML

Kỹ thuật liên kết sâu được mô tả ở trên có thể được dùng để xây dựng một bảng mục lục.

Hãy xem xét cách thực hiện việc này, sử dụng một bài đăng gần đây trên blog của chúng tôi làm ví dụ:

  1. Tạo một danh sách mà bạn thường sẽ thêm văn bản của bạn.
  2. Làm cho mỗi mục trong danh sách một liên kết.
  3. Thêm liên kết giữa mỗi phần trong bài đăng của bạn trở lại vị trí bảng nội dung tương ứng.

Khi hoàn thành, đoạn code của bạn sẽ trông như sau:

Nó sẽ nhìn thế này trong trang blog của chúng tôi.

LƯU Ý QUAN TRỌNG: Trong ảnh chụp màn hình ở đầu phần này, bạn có thể nhìn thấy dòng code có chữ div class hay "callout". Đây là một phần của CSS mà tạo ra một hộp nền màu đỏ (như trong mẹo này và trong bảng của các nội dung chúng tôi vừa tạo ra). Nếu bạn đang tạo một bảng nội dung của riêng mình, bạn có thể bỏ qua dòng mã này và TOC sẽ vẫn hoạt động (chỉ là nó sẽ không có màu nền).

Sau đó, đoạn cuối của phần này có một liên kết trở lại bảng mục lục.

Quá trình này được lặp lại trong suốt bài viết để xây dựng một bảng mục lục hoạt động tốt.

Làm thế nào để xây dựng các bảng trong HTML

Bảng rất hữu ích cho nhiều mục đích khác nhau, chẳng hạn như xây dựng các phần trưng bày hình ảnh đơn giản hoặc tạo các biểu đồ so sánh. Mặc dù WordPress không cung cấp phương tiện tích hợp sẵn nào để nhanh chóng tạo ra các bảng, nhưng chúng có thể dễ dàng xây dựng theo cách của riêng bạn.

Hình ảnh này minh họa cách các bảng được xây dựng bằng cách sử dụng HTML:

Kết quả cuối cùng sẽ trông như thế này:

Nếu bạn muốn điều chỉnh liên kết hoặc diện mạo của bảng, tốt nhất bạn nên sử dụng CSS. Vì chúng tôi tập trung với HTML trong bài đăng này, chúng tôi sẽ phải đề cập đến chủ đề này vào một lúc khác.

Mẹo nâng cao: Mặc dù WordPress không có chức năng xây dựng bảng, bạn cũng có thể sử dụng plugin để tạo bảng. Điều này có thể nhanh hơn và thuận tiện hơn so với việc xây dựng chúng. Mặc dù vẫn cần phải hiểu cách thức chúng được xây dựng.

Làm thế nào để Thêm Hình ảnh Trong HTML

Bây giờ bạn đã biết cách định dạng văn bản và xây dựng bảng trong HTML. Nếu bạn muốn thêm một hình ảnh, sử dụng hình ảnh HTML và các thuộc tính Alt Tag:

<img src = "Insert Image URL" alt = "Insert Alt Text">

Hãy thử thêm một hình ảnh vào bảng của chúng tôi. Thực hiện theo các bước sau:

1. Thêm một hình ảnh vào WordPress và  tìm URL ảnh:

2.) Dán thẻ HTML hình ảnh vào bảng của bạn trong WordPress. Sau đó, dán URL của bạn và viết thẻ alt của bạn vào các vị trí thích hợp cho đến khi thao tác giống như hình sau đây

3. Dưới đây là kết quả cuối cùng:



Trang bị kiến ​​thức này, chúng tôi nghĩ bạn có thể tạo ra một vài thứ thú vị hơn logo cứ lặp đi lặp lại như thế này. Đây chỉ là một bài kiểm tra nhanh để hướng dẫn bạn qua quá trình này.

Làm sao để không còn các vấn đề sao chép và dán thường gặp trong WordPress

Bạn đã bao giờ thử dán văn bản từ một tài liệu Word vào WordPress, chỉ  mong định dạng của bạn không bị rối loạn lên? Đó là bởi vì sao chép và dán từ Word (hoặc trình xử lý văn bản tương tự khác) sẽ thường bao gồm rất nhiều định dạng ẩn.

Có ba cách để sao lưu và dán các vấn đề trong WordPress:

  1. Dán nội dung của bạn vào một tài liệu văn bản thuần túy trong TextEdit (Mac) hoặc Notepad (Windows) trước khi dán nó vào WordPress. Điều này sẽ loại bỏ định dạng ẩn mà nếu không sẽ trở thành HTML khó sửa.
  2. Dán văn bản của bạn thẳng từ Word vào WordPress và sửa chữa các định dạng theo cách thủ công.
  3. Viết bài viết của bạn trực tiếp vào WordPress.

Chúng tôi khuyên bạn nên thực hiện theo cách dễ dàng (tùy chọn 1 hoặc tùy chọn 3), nhưng chúng tôi cũng sẽ chỉ cho bạn cách thực hiện theo cách khó (tùy chọn 2) để giải thích rõ nhất điều gì sẽ xảy ra khi bạn dán văn bản từ Word vào WordPress.

Bao giờ bạn đang tự hỏi tại sao việc sao chép và dán từ Word không bao giờ có vẻ đúng trong # WordPress?  Hãy đọc tiếp đi.

Hiểu về khoảng cách không thể phá vỡ (Non-Breaking Space)

Sao chép và dán văn bản từ WordPress vào Visual Editor trong WordPress sẽ thêm các khoảng cách không thể phá vỡ vào văn bản của bạn. Đây có thể là một trong những việc gây khó khăn  nhất cho blogger khi dán văn bản từ Word.

Chúng ta hãy tìm hiểu những gì đang có và những gì để làm về chúng.

Làm thế nào để xóa bỏ khoảng cách không thể bị phá vỡ Trong HTML

Dưới đây là một số văn bản mẫu chúng tôi sẽ thử dán trực tiếp vào khung Visual view (chế độ xem trực quan) trong WordPress:

Bây giờ, chúng tôi sẽ sao chép và dán trực tiếp vào khung Visual view trong WordPress:

Hmm. Có điều gì đó không đúng ở đây. bạn đã từng gặp vấn đề như thế này tại một số điểm. Hãy chuyển sang Text view (Chế độ xem văn bản) để xem điều gì đang xảy ra ở đây:

Xem có gì lạ không &nbsp;? Đây được gọi là không gian không bị phá hủy (Khi viết HTML thì nhiều khoảng trắng – dấu cách sẽ chỉ được tính là một. Chính vì vậy khi cần nhiều hơn một thì phải dùng đến &nbsp;, mỗi &nbsp; tương ứng với một dấu cách). &nbsp; bắt buộc một khoảng không xuất hiện và ngăn cản việc hình thành một dòng văn bản khác ở vị trí của nó.

Vấn đề sao chép và dán từ Word là nguyên nhân có không gian không bị phá hủy. Đôi khi bạn có thể xóa các không gian này trong trình soạn thảo trực quan, nhưng nếu thất bại, bạn có thể xóa chúng bằng tay trong trình soạn thảo văn bản.

Bây giờ nếu bạn nhận thấy những khoảng không lạ  thường và dường như không thể di chuyển được trong văn bản WordPress của mình, bạn sẽ biết phải làm gì rồi đấy.

Mẹo: Nếu bạn không muốn viết các bài viết trực tiếp trong WordPress và thích viết các bài đăng trong Evernote hoặc Google Docs, CoSchedule giúp bạn dễ dàng chuyển đổi các tệp Evernote và Google Docs vào các bài viết WordPress. Bạn vẫn cần phải định dạng tiêu đề và định dạng của mình, nhưng đó là một cách dễ dàng để tiết kiệm thời gian viết trong công cụ xử lý văn bản ưa thích của bạn.

Bạn đã đọc qua bài đăng này. Bạn đã tải xuống HTML cheatsheet của mình. Bạn đã bắt đầu thử nghiệm với việc khắc phục sự cố định dạng WordPress phổ biến.

Nguồn : THEO SAGA.VN