/ html / resources / js-libraries / highlightJS / highlightJS.html
highlightJS.html
  1  <!DOCTYPE html>
  2  <html lang="de">
  3     <head>
  4        <meta charset="UTF-8" />
  5        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6        <meta http-equiv="onion-location" content="http://bopbopl6lohkl2rts3ltesjnag4hzs4jrx2h6k6etgq5xasbpqekzlqd.onion" />
  7        <title>BOP Resources: highlight.js</title>
  8        <link rel="stylesheet" href="/assets/stylesheet.css" />
  9        <link rel="icon" type="image/x-icon" href="/assets/img/favicon.png">
 10     </head>
 11     <body>
 12         <header>
 13  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 14            <script src="/assets/js/navbar-OpenClose.js"></script>
 15            <script src="/assets/js/lightbox.js"></script>
 16            <script src="/assets/js/copyCodeButton.js"></script>
 17            <link rel="stylesheet" href="/resources/js-libraries/highlightJS/atom-one-dark.min.css">
 18            <script src="/resources/js-libraries/highlightJS/highlight.min.js"></script>
 19            <script src="/resources/js-libraries/highlightJS/highlightjs-line-numbers.min.js"></script>
 20            <script>hljs.highlightAll();</script>
 21            <script>hljs.initLineNumbersOnLoad();</script>
 22  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 23            <div class="branding">
 24               <button class="toggle-btn-navbar" id="navbarOpenButton">☰</button>
 25               <a href="/">
 26               <img class="logo" src="/assets/img/logo.png">
 27               </a>
 28               <div class="typing-animation">BytesOfProgress</div>
 29            </div>
 30         </header>
 31         <div id="navbarContainer" class="navbar-container">
 32            <iframe class="navbar-iframe" src="/assets/navbar/navbar.html" frameBorder= "0"></iframe>
 33         </div>
 34        <main>
 35  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 36  
 37  <article class="site-post">
 38     <header class="post-header">
 39        <h1 class="post-title">highlight.js</h1>
 40        <div class="post-meta">
 41        </div>
 42     </header>
 43  </article>
 44  
 45  <nav class="breadcrumb">
 46    <a href="/">Home</a>
 47    <span class="divider">›</span>
 48    <a href="/resources/">Resources</a>
 49    <span class="divider">›</span>
 50    <a href="/resources/js-libraries/js-libraries.html">JavaScript Libraries</a>
 51    <span class="divider">›</span>
 52    <span class="current">highlight.js</span>
 53  </nav>
 54  
 55  <section class="post-content">
 56  
 57  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 58  
 59  <p>
 60    License: BSD-3-Clause license
 61  </p>
 62  
 63  <p>
 64    BytesOfProgress currently stores "11.9.0" from <a class="text-link" href="https://github.com/highlightjs/highlight.js/releases" target="_blank">GitHub</a>.
 65  </p>
 66  
 67  <p>
 68      All you have to do is load highlight.js from this link:
 69  </p>
 70  
 71  <blockquote>
 72    https://bytesofprogress.net/resources/js-libraries/highlightJS/highlight.min.js
 73  </blockquote>
 74  
 75  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 76  
 77  <p>
 78    If you also want line numbers, also import this library add-on (<a class="text-link" href="https://github.com/wcoder/highlightjs-line-numbers.js" target="_blank">Source</a>), MIT Lincense:
 79  </p>
 80  
 81  <blockquote>
 82    https://bytesofprogress.net/resources/js-libraries/highlightJS/highlightjs-line-numbers.min.js
 83  </blockquote>
 84  
 85  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
 86  
 87  <p>
 88    Basic usage:
 89  </p>
 90  
 91  <div class="code-box">
 92    <pre><code>&lt;link rel=&quot;stylesheet&quot; href=&quot;https://bytesofprogress.net/resources/js-libraries/highlightJS/atom-one-dark.min.css&quot;&gt;
 93  &lt;script src=&quot;https://bytesofprogress.net/resources/js-libraries/highlightJS/highlight.min.js&quot;&gt;&lt;/script&gt;
 94  &lt;script src=&quot;https://bytesofprogress.net/resources/js-libraries/highlightJS/highlightjs-line-numbers.min.js&quot;&gt;&lt;/script&gt;
 95  
 96  &lt;script&gt;hljs.highlightAll();&lt;/script&gt;
 97  &lt;script&gt;hljs.initLineNumbersOnLoad();&lt;/script&gt;</code></pre>
 98  </div>
 99  
100  <br>
101  
102  <!-- --------------------------------------------------------------------------------------------------------------------------------- -->
103  
104     <hr>
105     </section>
106     <footer class="post-footer">
107     <a href="/resources/js-libraries/js-libraries.html" class="cta-button">← Back</a>
108     </footer>
109     </main>
110     </body>
111     </html>