Tạo khung chứa code tuyệt đẹp cho Blog và Website

Tạo khung chứa code tuyệt đẹp cho Blog và Website

Xin chào các bạn, lại là mình Nguyễn Phong Blog đây. Khá lâu rồi mình đã không chia sẻ nội dung liên qua đến code cho blogspot, vậy thì hôm nay mình sẽ hướng dẫn các bạn tạo khung chứa code nhé.

Tạo khung chứa code

Hướng dẫn tạo khung chứa code

Bước 1: Truy cập vào Blogger ➤ Chủ đề ➤ Chỉnh sửa HTML. Dán toàn bộ code phía dưới vào trước </head>

<link href='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/styles/atom-one-dark.min.css' rel='stylesheet'/>
<script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.10/highlight.min.js'></script>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
  $('pre').each(function(i, block) {
    hljs.highlightBlock(block);
  });
});
//]]>
</script>

Bước 2: Để sử dụng khung chứa code, các bạn cần đặt code vào giữa<pre>

Để đặt vào giữa thẻ <pre> các bạn cần Mã hóa code

<pre class='xml'>
<!-- nếu code là các thẻ HTML -->
</pre>

<pre class='xml'>
<!-- nếu code là các thẻ Css -->
</pre>

<pre class='xml'>
<!-- nếu code là các thẻ Javascript -->
</pre>

Lời kết

Copyright © Lê Anh Đức