Mengatur pewarna code pada blogger menggunakan highlight.js

Arwan Prianto Mangidi
1 minute read
0

Menambahkan link css berikut di bagian head tema tampilan blog. kita juga bisa melakukan sedikit tambahan kode style untuk memperbaiki tampilan kode preview pada content blog kita

<!--Syntax highlighter-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/monokai-sublime.min.css" rel="stylesheet"></link>
<!--End Syntax highlighter-->
<style>
    /* Atur border rounded untuk pre element */
    pre {
      border-radius: 15px; /* Nilai border radius yang diinginkan */
      overflow: hidden; /* Pastikan border rounded tidak mempengaruhi elemen anak (code) */
      margin-bottom: 10px;
    }

    /* Atur padding untuk code element agar border rounded terlihat lebih baik */
    code {
      display: block;
      padding: 15px;
    }
</style>

Link js di bagian akhir body tema tampilan blog


  <!-- Syntax highlighter -->
  <script src='https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js'/>
  <script>hljs.highlightAll();</script>
  <!-- End Syntax highlighter -->
Tags

Posting Komentar

0 Komentar
Posting Komentar (0)