Hướng dẫn định dạng đoạn mã code trong bài viết trên Blogger
Trong bài viết này, chúng ta sẽ tìm hiểu cách định dạng các đoạn mã trong bài viết trên Blogger bằng cách sử dụng các công cụ và kỹ thuật khác nhau.
Sử Dụng Thẻ <pre> và <code>
Để định dạng đoạn mã trong Blogger, bạn có thể sử dụng thẻ HTML <pre> và <code> để đảm bảo mã của bạn được hiển thị đúng cách.
<pre><code>
function helloWorld() {
console.log("Hello, world!");
}
</code></pre>Thêm đoạn mã trên vào bài viết của bạn sẽ hiển thị mã JavaScript theo định dạng được bảo toàn.
Sử Dụng Syntax Highlighter
Bạn cũng có thể sử dụng các thư viện JavaScript như Highlight.js hoặc Prism.js để tạo các đoạn mã có tô màu cú pháp.
Ví dụ với Highlight.js
- Thêm các liên kết tới tệp CSS và JavaScript của Highlight.js vào thẻ
<head>của bạn. - Bọc đoạn mã của bạn trong thẻ
<pre>và<code>, kèm theo lớp ngôn ngữ cụ thể.
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script><pre><code class="language-js">
function helloWorld() {
console.log("Hello, world!");
}
</code></pre>Sau khi thêm đoạn mã trên, Highlight.js sẽ tự động tô màu cú pháp cho mã của bạn.
Kết Luận
Việc định dạng mã trong bài viết trên Blogger có thể được thực hiện dễ dàng bằng cách sử dụng thẻ HTML cơ bản hoặc tích hợp các thư viện JavaScript chuyên dụng. Điều này giúp mã của bạn trở nên dễ đọc và chuyên nghiệp hơn.
Post a Comment