|
|
| (같은 사용자의 중간 판 5개는 보이지 않습니다) |
| 1번째 줄: |
1번째 줄: |
| == Syntax Highlight Extention == | | == Highlight == |
| * 기존에 SyntaxHighlight_GeSHi로 알려짐(구문 강조로 GeSHi를 사용) , 이젠 Pygments를 사용
| |
| *<syntaxhighlight> 태그를 사용하여 다양한 소스 코드 형식 제공
| |
| * Pygments 라이브러리에 의해 구동되며 수백 가지의 서로 다른 프로그래밍 언어와 파일 형식을 지원
| |
| * <pre> 및 poem 태그와 마찬가지로 텍스트는 정확하게 입력된 대로 렌더링되며 공백 유지
| |
|
| |
| == 설치 ==
| |
| * 현재는 미디어위키에 기본으로 설치됨
| |
|
| |
|
| == LocalSettings.php 에 추가 == | | == Highlightjs Integration == |
| * LocalSettings.php 파일에 다음을 추가
| | # 설치 |
| <source lang=python>
| | #: https://github.com/Nicolas01/Highlightjs_Integration/archive/master.zip |
| wfLoadExtension( 'SyntaxHighlight_GeSHi' );
| | # extensions/ folder. |
| </source>
| | Add the following code at the bottom of your LocalSettings.php file: |
| * Linux에서는, pygmentize 바이너리에 대한 실행 권한을 설정
| |
| *:<source lang=python>
| |
| sudo chmod a+x /var/www/html/w/extensions/SyntaxHighlight_GeSHi/pygments/pygmentize
| |
| </source>
| |
| * 일반적으로 배포될 때, 실행 권한이 있도록 제공됨
| |
| * Special:Version에 접근해서 확장이 정상적으로 설치가 되었는지 확인
| |
|
| |
|
| === linux 환경 ===
| | wfLoadExtension( 'Highlightjs_Integration' ); |
| <source lang=python>
| |
| pygments update
| |
| cd /var/www/html/w/extensions/SyntaxHighlight_GeSHi/pygments
| |
| sudo ./create_pygmentize_bundle
| |
| sudo /var/www/html/w/maintenance/run ./maintenance/updateCSS.php --wiki=devcafe
| |
| </source>
| |
| * $wgPygmentizePath (선택 사항): Pygments 패키지의 pygmentize에 대한 절대 경로.
| |
| ** 이 확장은 Pygments 패키지를 번들하고 $wgPygmentizePath 포인트를 번들된 버전에 묶어 주지만, 만약 원하는 경우에는 다른 버전을 가리킬 수 있습니다.
| |
| ** 예를 들어: $wgPygmentizePath = "/usr/local/bin/pygmentize";
| |
| * $wgSyntaxHighlightModels: 일부 위키 페이지의 기본 lexer를 설정합니다. 기본적으로 이것은 자바-스크립트 및 css 페이지를 강조 표시합니다. 추가적인 컨텐츠 모델은 확장 기능 (예를 들어, Lua, JSON, ..)으로 구성할 수 있습니다.
| |
| === 윈도우 환경 ===
| |
| * 윈도우 컴퓨터에서 미디어위키를 호스팅하는 경우에는, Pygramize.exe에 대한 경로를 $wgPygmentizePath = "c:\Python27\Scripts\pygmentize.exe";로 설정
| |
| * 만약 pygmentize.exe가 없으면 파일을 생성하기 위해서 Scripts 폴더 내에서 명령 줄에 easy_install Pygments를 실행
| |
| * 만약 번들된 pygmentize 바이너리 (extensions/SyntaxHighlight_GeSHi/pygments/pygmentize)를 사용하는 경우에는, 웹 서버에서 실행하도록 허용되었는지 확인
| |
| * 만약 호스트가 웹 디렉토리에 실행 파일을 추가할 수 없으면, python-pygments를 설치하고 $wgPygmentizePath = pygmentize를 LocalSettings.php에 추가
| |
|
| |
|
| == 주의사항 ==
| | [[category:미디어위키]] |
| * LocalSettings.php에서 $wgPygmentizePath를 외부 pygmentize 바이너리로 향하게 하십시오.
| |
| | |
| * 이 플러그인은 Extension:VisualEditor와 함께 직접 편집할 수 있도록 활성화합니다.
| |
| | |
| * 사용자가 source 또는 syntaxhighlight 섹션을 편집하려고 할 때 팝업이 열립니다.
| |
| | |
| * 이 기능을 사용하기 위해서는, VisualEditor는, Parsoid와 동일한, 최신 버전의 git 버전을 설치하고 구성해야 합니다.
| |
| | |
| * 이 기능은 구형 Parsoid 버전에서는 무작위로 작동하지 않습니다.
| |
| | |
| | |
| == 사용법 ==
| |
| wiki 페이지에서 "syntaxhighlight" 나 “source” 태그를 사용.
| |
| <source lang=python>
| |
| def quickSort(arr):
| |
| less = []
| |
| pivotList = []
| |
| more = []
| |
| if len(arr) <= 1:
| |
| return arr
| |
| else:
| |
| pass
| |
| </source>
| |
| | |
| <source lang=python>
| |
| | |
| <syntaxhighlight lang="python" line='line'>
| |
| def quickSort(arr):
| |
| less = []
| |
| pivotList = []
| |
| more = []
| |
| if len(arr) <= 1:
| |
| return arr
| |
| else:
| |
| pass
| |
| </syntaxhighlight>
| |
| </source>
| |
| | |
| * <nowiki><source></nowiki> 태그(예를 들어, XML)가 포함되어 있으면 <syntaxhighlight>가 충돌을 피할 수 있음.
| |
| | |
| === Styling ===
| |
| * 만약 표시된 코드가 너무 크면, 위키에 있는 MediaWiki:Common.css 페이지에 추가 (존재하지 않는 경우에는 생성).
| |
| <source lang=python>
| |
| /* CSS placed here will be applied to all skins */
| |
| .mw-highlight pre {
| |
| font-size: 90%;
| |
| }
| |
| </source>
| |
| * 테두리에 코드 블록을 넣는 작업은 테두리와 위의 섹션에서처럼 border: 1px dashed blue; 같은 선을 삽입하여 수행할 수 있습니다.
| |
| * font family에 대한 제어는 위의 섹션에서처럼 font-family: "Courier New", monospace; 같은 줄을 삽입하여 수행할 수도 있습니다.
| |
| | |
| === Parameters ===
| |
| | |
| ==== lang="Name" ===
| |
| * pygments 구문 분석기는 대소-문자를 구분하며 모든 언어는 적어도 하나의 대문자가 있습니다(소문자는 gtags 용으로 예약되어 있습니다).
| |
| <source lang=python>
| |
| | |
| def quickSort(arr):
| |
| less = []
| |
| <syntaxhighlight lang="python">
| |
| ..
| |
| </syntaxhighlight>
| |
| | |
| </source>
| |
| | |
| ==== line ====
| |
| * line 속성은 행 번호를 사용 가능하게 합니다.
| |
| <source lang=python>
| |
| | |
| int x = 0;
| |
| Console.WriteLine("结果是："+ x);
| |
| <syntaxhighlight lang="python" line>
| |
| ..
| |
| </syntaxhighlight>
| |
| | |
| </source>
| |
| | |
| ==== start ====
| |
| * start 속성(line과 함께)은 코드 블록의 첫 번째 행 번호를 정의합니다.
| |
| 예를 들어, line start="55"는 줄 번호 매김을 55에서 시작합니다.
| |
| <source lang=python>
| |
| | |
| def quickSort(arr):
| |
| less = []
| |
| <syntaxhighlight lang="python" line start="55">
| |
| ..
| |
| </syntaxhighlight>
| |
| | |
| </source>
| |
| | |
| ==== highlight====
| |
| * highlight 속성은 표시해야 할 하나 이상의 줄을 지정합니다(배경색이 다른 라인을 강조하기 위해서).
| |
| * 쉼표로 구분된 여러 줄 번호(예를 들어, highlight="1,4,8") 또는 두 개의 줄 번호와 하이픈(예를 들어, highlight="5-7")을 사용하여 범위를 지정할 수 있습니다.
| |
| * 주목할 것은 줄 번호 지정은 start 특성으로 표시된 줄 번호의 번호 매기기를 무시한다는 점입니다.
| |
| | |
| <source lang=python>
| |
| | |
| def quickSort(arr):
| |
| less = []
| |
| pivotList = []
| |
| more = []
| |
| if len(arr) <= 1:
| |
| return arr
| |
| | |
| </source>
| |
| | |
| 다음의 결과입니다.
| |
| <syntaxhighlight lang="python" highlight="1,5-7" start='3' line>
| |
| ..
| |
| </syntaxhighlight>
| |
| inline
| |
| | |
| * 주목할 것은 소스 코드가 class="nowrap"(지원하는 위키에서, 아래를 참조하십시오) 또는 style=white-space:nowrap을 사용하여 소스 코드가 non-breakable으로 표시되지 않는 한 줄 바꿈이 발생할 수 있다는 점입니다.
| |
| | |
| 예를 들어:
| |
| <source lang=python>
| |
| | |
| lambda x: x * 2 is a lambda expression in Python.
| |
| 다음의 결과입니다:
| |
| <syntaxhighlight lang="python" inline>lambda x: x * 2</syntaxhighlight> is a [[wikipedia:Lambda (programming)|lambda expression]] in Python.
| |
| | |
| | |
| ==== class ====
| |
| * inline을 사용할 때, class="nowrap"(지원하는 위키에서, MediaWiki 자체에서는 제외)는 코드 블록 내의 공백에서 줄 바꿈이 일어나지 않아야 함을 지정합니다.
| |
| | |
| 예를 들어:
| |
| class="nowrap" 없는 경우:
| |
| xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxlambda x: x * 2xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
| |
| style="white-space:nowrap" 있는 경우:
| |
| xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxlambda x: x * 2xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
| |
| style
| |
| | |
| style 속성을 사용하면 CSS 속성을 직접 포함할 수 있습니다.
| |
| 이것은 블록을 <div> (<span>이 아님) 태그로 묶는 것과 같습니다.
| |
| tab‑size 속성은 이 방법으로 지정할 수 없습니다. 아래에 설명된 대로 Advanced <span> 태그가 있어야 합니다.
| |
| 예를 들어:
| |
| def quickSort(arr):
| |
| less = []
| |
| pivotList = []
| |
| more = []
| |
| if len(arr) <= 1:
| |
| return arr
| |
| else:
| |
| pass
| |
| 다음의 결과입니다:
| |
| <syntaxhighlight lang="Python" style="border:3px dashed blue">
| |
| def quickSort(arr):
| |
| less = []
| |
| pivotList = []
| |
| more = []
| |
| if len(arr) <= 1:
| |
| return arr
| |
| else:
| |
| pass
| |
| </syntaxhighlight>
| |
| Installation
| |
| | |
| 미디어위키 확장 내려받기 지면에서 해당 판을 내려받아서 정해진 위치로 이동시킵니다.
| |
| 확장을 git에서 설치했을 때, Composer를 실행해서 PHP을 설치하십시오. 확장 디렉토리로 이동하셔서 composer install --no-dev를 실행하십시오.
| |
| 미디어위키 설정 LocalSettings.php 파일에 다음을 추가합니다:
| |
| wfLoadExtension( 'SyntaxHighlight_GeSHi' );
| |
| 리눅스에서, pygmentize 바이너리에 대한 실행 권한을 설정합니다. FTP 클라이언트 또는 다음 셸 명령을 사용하여 이를 수행할 수 있습니다.
| |
| chmod a+x /path/to/extensions/SyntaxHighlight_GeSHi/pygments/pygmentize
| |
| Special:Version에 접근해서 확장이 정상적으로 설치가 되었는지 확인을 합니다.
| |
| Advanced
| |
| | |
| <pre> 및 <code> 태그와 달리게, 와 같은 HTML 문자 엔터디에는 & 문자가 &로 이스케이프될 필요가 없습니다.
| |
| <pre> 태그와 비슷하지만 <code> 태그와는 달리게, 범위 내의 태그(자체 종료 태그 제외)는 < 기호로 <를 이스케이프 처리할 필요가 없으며, wikitext를 <nowiki> 태그로 이스케이프해야 할 필요도 없습니다.
| |
| 게다가, <pre>는 탭이 8문자마다 멈추고 렌더링된 텍스트가 복사될 때 실제 공간을 사용하여 탭을 렌더링한다고 가정하지만 <syntaxhighlight>는 (Internet Explorer는 제외, IE는 8을 사용합니다) 4-공백 탭을 사용하고 렌더링된 텍스트; 후자는 <span style="-moz-tab-size:''nn''; -o-tab-size:''nn''; tab-size:''nn'';"> 태그를 사용하여 변경할 수 있습니다(<div>가 아니며, 자체 style 속성을 사용하지 않음).
| |
| Firefox(버전 4.0부터)에는 -moz- 접두어가 필요하고 Opera(버전 10.60에서 버전 15까지)에는 -o- 접두사가 필요합니다. (주목할 것은 위키 편집 상자는 8-칸 탭으로 가정한다는 점입니다.)
| |
| 이것은 실제 저장된 페이지에만 적용됩니다. 편집 상자 또는 mw:Special:ExpandTemplates를 통해 생성된 미리보기는 다를 수 있습니다
| |
