자유게시판

  • 시롤로지 나스 그누보드 코드 하이라이트와 copy 버튼 만들기

    페이지 정보

    profile_image
    작성자천사 조회 4,435회 작성일 2021-09-25 01:52:05 댓글 0

    본문

    아래 내용은 highlight.php 등 적당한 이름으로 그누보드 extend 폴더에 넣기

     

    HighlightJs Copy Code Badge Component

     

    는 첨부 파일 참고(출처: https://github.com/RickStrahl/highlightjs-badge)

     

    [code]

    <?
      function hh_tail_sub()
      {
        global $wr_id;

        // 게시판에서 view.php 호출할때 적용하도록
        if($_SERVER['SCRIPT_NAME'] != '/bbs/board.php'  || !$wr_id) return;
      ?>

    <!--
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/styles/agate.min.css">
    <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.6/highlight.min.js"></script>
    -->

        <style>
            /* optionally override badge styling */
            .code-badge {
                 background: #555 !important;
                 padding: 8px !important;
            }
            .code-badge-copy-icon {
                font-size: 1.3em !important;
            }
        </style>

        <style>
        pre {
            overflow: auto;
        }
        </style>

    <!-- end customization template -->

    <link rel="stylesheet" href="/highlight/vs2015.css">
    <script src="/highlight/highlight.min.js"></script>

    <!-- then add this badge component -->
    <script src="/highlight/highlightjs-badge.min.js"></script>

    <script>
    function sh(id) {
      var $id = $("#" + id);
      if ($id.length > 0) {
        var html = $id.html();
        html = html.split("[code]").join("<pre><code>");
        html = html.split("[/code]").join("</pre></code>");
        $id.html(html);
        $id.find("pre>code").each(function() {
          var text = $.trim($(this).text());
          $(this).text(text);
        });
      }
    }

    $(function() { 
      sh("bo_v_con"); 

      hljs.initHighlighting();
    });
    </script>

    <script>
        setTimeout(function () {
            var pres = document.querySelectorAll("pre>code");
            for (var i = 0; i < pres.length; i++) {
                hljs.highlightBlock(pres[i]);
            }
            var options = {
                // Delay in ms used for `setTimeout` before badging is applied
                // Use if you need to time highlighting and badge application
                // since the badges need to be applied afterwards.
                // 0 - direct execution (ie. you handle timing
                loadDelay:0,

        // CSS class(es) used to render the copy icon.
        copyIconClass: "fa fa-copy",     
        // optional content for icons class (<i class="fa fa-copy"></i> or <i class="material-icons">file_copy</i>)
        

        // CSS class(es) used to render the done icon.
        checkIconClass: "fa fa-check text-success",

                // hook to allow modifying the text before it's pasted
                onBeforeTextCopied: function(text, codeElement) {
                  return text;   //  you can fix up the text here
                }
            };
            window.highlightJsBadge(options);
        },10);
    </script>

      <?
      }
      add_event('tail_sub', 'hh_tail_sub', G5_HOOK_DEFAULT_PRIORITY);
    ?>

    [/code]

    첨부파일

    댓글목록

    등록된 댓글이 없습니다.

    Copyright © blog.batifa.com All rights reserved.