Page tree

이 문서는 Confluence 상단에 ScriptRunner for Confluence를 통해 메뉴를 만드는 방법을 가이드하기 위해 작성되었다. 



예상 화면

Confluence 상단 메뉴에 바로가기 메뉴 추가 및 클릭 시, 펼쳐진 메뉴 제공



Top 메뉴 추가하기

상단 Top 메뉴를 추가하기 위해 다음 절차를 진행한다. 


  1. 상단 톱니바퀴 관리자 메뉴에서 General configuration 선택
  2. Scriptrunner > Fragments 선택
  3. Create Fragment 버튼 클릭
  4. Custom web item 선택
    아래 그림과 같이 값들을 입력한다. 
    1. Name
      1. curvc-top-menu
    2. What section should used only for your reference
      1. system.header/left
    3. Key 
      1. curvc-top-menu
    4. Menu text (원하는 이름으로 변경 가능)
      1. 바로가기 메뉴
    5. Weight (메뉴의 위치로 원하는 값으로 위치 조정 가능)
      1. 1000
  5. 모든 값이 업데이트 되면 Update를 클릭한다. 
  6. Confluence 상단 Top 메뉴에 "바로가기 메뉴"가 추가된 것을 확인한다. 



Top 메뉴 하위 메뉴 추가하기 

상단 Top 메뉴 하위에 메뉴를 추가하기 위해 다음 절차를 진행한다. 


  1. 상단 톱니바퀴 관리자 메뉴에서 General configuration 선택
  2. Scriptrunner > Fragments 선택
  3. Create Fragment 버튼 클릭
  4. Custom web panel 선택
    1. Name 
      1. curvc-top-menu-pannel
    2. Location
      1. system.header/right/pannels
    3. Key
      1. curvc-top-menu-pannel
    4. Provider class/script
      아래와 같이 입력 <nav></nav> 사이에 원하는 만큼 메뉴를 추가
      writer.write("""
      <nav id="child-menu-link-content" class="aui-dropdown2 aui-style-default" aria-hidden="true">
          <div class="aui-dropdown2-section">
              <ul class="menu-hidden">
                  <li><a href="https://google.com">Google 바로가기</a></li>
              </ul>
              <ul class="menu-hidden">
                  <li><a href="https://naver.com">Naver 바로가기</a></li>
              </ul>
              <ul class="menu-hidden">
                  <li><a href="https://bing.com">Bing 바로가기</a></li>
              </ul>
          </div>
      </nav>
      
      <script lang="text/javascript">
          function addDropdownAttributes(link, name){
              link.attr("aria-haspopup", "true");
              link.attr("aria-owns", name + "-menu-link-content")
              link.addClass("aui-nav-link");
              link.addClass("aui-dropdown2-trigger");
          }
      
          var srDropDown = AJS.\$('a#curvc-top-menu');
          addDropdownAttributes(srDropDown, "child");
      </script>
      """)


  5. 아래 그림을 참고하여 모든 값이 업데이트 되면 Update를 클릭한다.





  • No labels