Media wiki 사용시에 좌측에 나타나는 sidebar menu 에 자신이 원하는 메뉴를 넣거나 빼고 싶은 경우가 있다.


좌측 sidebar menu cusomize 하는 법을 알아보도록 하자.


  1. 자신의 계정의 page 에 monobook.js 라는 page 를 만든다.
    • 생성된 page의 경로는 다음과 같다.
    • user:username/monobook.js
  2. 생성된 monobook.js page 안에 다음 내용을 삽입한다.
function ModifySidebar(action, section, name, link) {
    try {
        switch (section) {
          case "languages":
            var target = "p-lang";
            break;
          case "toolbox":
            var target = "p-tb";
            break;
          case "navigation":
            var target = "p-navigation";
            break;
          default:
            var target = "p-" + section;
            break;
        }
 
        if (action == "add") {
            var node = document.getElementById(target)
                               .getElementsByTagName('div')[0]
                               .getElementsByTagName('ul')[0];
 
            var aNode = document.createElement('a');
            var liNode = document.createElement('li');
 
            aNode.appendChild(document.createTextNode(name));
            aNode.setAttribute('href', link);
            aNode.setAttribute('style', 'font-size:150%; font-weight:bold');
            liNode.appendChild(aNode);
            liNode.className='plainlinks';
            node.appendChild(liNode);
        }
 
        if (action == "remove") {
            var list = document.getElementById(target)
                               .getElementsByTagName('div')[0]
                               .getElementsByTagName('ul')[0];
 
            var listelements = list.getElementsByTagName('li');
 
            for (var i = 0; i < listelements.length; i++) {
                if (listelements[i].getElementsByTagName('a')[0].innerHTML == name ||
                    listelements[i].getElementsByTagName('a')[0].href == link) {
 
                    list.removeChild(listelements[i]);
                }
            }
        }
 
    } catch(e) {
      // lets just ignore what's happened
      return;
    }
}
 
 
function AddSection(sect) {
    var target = "column-one";
    var column = document.getElementById(target);
    var newsect = document.createElement("div");
    newsect.appendChild(document.createTextNode("test"));
    column.appendChild(newsect);
}
 
function HideColumnOne() {
    // hide columne-one
    var co = document.getElementById("column-one");
    co.setAttribute('visibility','hidden');   
}
 
function CustomizeModificationsOfSidebar() {
    ModifySidebar("add", "navigation", "Core1", "http://172.21.17.12/wiki/index.php/Core1");
    ModifySidebar("add", "navigation", "IDE", "http://172.21.17.12/wiki/index.php/IDE");
    ModifySidebar("add", "navigation", "Web IDE", "http://172.21.17.12/wiki/index.php/WebIDE");
    ModifySidebar("add", "navigation", "주간업무", "http://172.21.17.12/wiki/index.php/weekend");
}
 
addOnloadHook(CustomizeModificationsOfSidebar);


 3. 그후 CustomizeModificationsOfSidebar() 함수에 ModifySidebar 내용을 자신에 맞게 수정한다.

  • ModifySidebar 함수의 첫번째, 두번째 인자는 동일
  • 3번째 인자는 side bar 에 보일 Menu Text 를 넣어준다.
  • 4번째 인자는 Menu Text 로 이동할 실제 페이지의 URL 을 넣어준다.
function CustomizeModificationsOfSidebar() {
    ModifySidebar("add", "navigation", "Core1", "http://172.21.17.12/wiki/index.php/Core1");
    ModifySidebar("add", "navigation", "IDE", "http://172.21.17.12/wiki/index.php/IDE");
    ModifySidebar("add", "navigation", "Web IDE", "http://172.21.17.12/wiki/index.php/WebIDE");
    ModifySidebar("add", "navigation", "주간업무", "http://172.21.17.12/wiki/index.php/weekend");
}


Posted by leechwin