Hướng dẫn highlight code trong Blogspot

Trong bài viết này chúng ta sẽ sử dụng highlight.js để làm nổi bật các đoạn code lập trình mà ta trình bày trên Blogger . Highlight - làm ...

thủ thuật blog

Xếp hạng bài viết

Tham khảo các bài viết khác.

Trong bài viết này chúng ta sẽ sử dụng highlight.js để làm nổi bật các đoạn code lập trình mà ta trình bày trên Blogger.

Highlight - làm nổi bật các đoạn code

filter_1 Lấy hightlight.js

⛨ Bạn có thể truy cập vào link này để lấy hoặc copy luôn tại đây.

• Link trực tiếp

<link href="http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/styles/default.min.css" rel="stylesheet"></link>
<script src="http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.7/highlight.min.js"></script>

filter_2 Thêm highlight vào template Blogspot

Đầu tiên bạn Đăng nhập Blogger > Chủ để > Tùy chỉnh > Chỉnh sửa HTML.
Sau đó dán đoạn code ở trên vào trước thẻ </head>.
Chèn code xong các bạn nhớ lưu lại.

filter_3 Sử dụng highlight trong bài viết

Để sử dụng highlight.js trong bài viết, bạn chuyển sang > sau đó bạn copy và dán đoạn Script này vào.

<script>
//script initialisation for 'pre' tags
$(document).ready(function() {
  $('pre').each(function(i, block) {
    hljs.highlightBlock(block);
  });
});
</script>

<pre>Hiển thị đoạn code </pre>

Sau đó chuyển bài viết sang và chèn đoạn code mà bạn muốn hiển thị.
Chúc bạn thành công!!!

CHIA SẺ CHO BẠN BÈ