2017-10-12 10 views
0

코드 블록에 많은 셸 예제를 게시하는 지킬 사이트가 있습니다. 스크립트/셸 명령과 명령의 결과를 시각적으로 설명하기 위해 노력하고 있습니다.다른 스타일을 다른 구문 형광펜 언어에 적용하십시오

생성 된 HTML이 예에서는

<pre><code class="language-powershell"> 
function DemoCode { 
    return 'rab', 'oof' 
} 
DemoCode 

rab 
oof 
</code></pre> 

는 마지막 두 라인 분명 제 4 개 라인으로 출력 할 필요가있다.

```powershell 
function DemoCode { 
    return 'rab', 'oof' 
} 

DemoCode 

rab 
oof 
``` 

내가 두 번째 코드 블록으로 분할 피하기 위해 선호하는 것 :

마크 다운은 현재 파워 쉘 태그 단지 일반 트리플 역 따옴표입니다. Wordpress에서는 인라인 스타일 태그를 사용하여이 작업을 수행했지만 작업의 돼지였습니다.

이 나를 위해 좋은 해결책이 아니라 내가 구문 형광펜으로 '일반 텍스트'태그와 별도의 코드 블록 수 :

내가 지금까지 가지고있는 최고의 별도의 코드 블록에 참입니다. 루어에 'plaintext'태그를 적용하면 구문 강조를 얻을 수 없으므로 도움이됩니다. 그러나 생성 된 HTML은 여전히 ​​.highlight에서 동일한 CSS를 상속받습니다.

마크 다운 :

```powershell 
function Write-Stuff { 
    Write-Output $Stuff 
} 
``` 

```plaintext 
Output I would like with different color and background-color 
``` 

나는 아직도 그, 그래도 다른 CSS를 상속해야합니다. 생성 된 HTML :이 my-custom-class 권리를 삽입합니다

{:.my-custom-class} 
``` powershell 
function Write-Stuff { 
    Write-Output $Stuff 
    } 
``` 

:

<div class="language-powershell highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">#this is formatted with md code block and powershell tag</span> 
</code></pre></div></div> 

<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>#formatted with md code block and plaintext tag 
</code></pre></div></div> 
+0

왜 두 개의 다른 코드 블록을 사용하지 않습니까? –

+0

시각 언어에 관한 질문입니다. 그래픽 디자인은 중요하며 두 개의 개별 코드 블록은 해결책이 아닙니다. 두 번째 코드 블록이 예를 들어 별도의 색상으로 시각적으로 구별되지만 html 클래스가 github 페이지에 대한 커밋에서 생성되므로 jekyll에서이를 달성하는 방법을 볼 수없는 경우 부분적인 해결책이 될 수 있습니다. – FSCKur

+0

원하는 출력은 무엇입니까? 스타일이 전혀 없습니까? – marcanuy

답변

0

별도의 코드 블록으로 이동하려는 경우, 당신은 구문에 대한 사용자 정의 클래스를 설정하는 IAL 블록을 사용할 수있는 블록을 강조 language-powershell highlighter-rouge 옆에서 CSS를 적절하게 사용자 정의 할 수 있습니다.

블록 분할을 피하는 방법 : kramdown에서는 불가능합니다. 그러나 이것을 수행하는 방법을 알고있는 custom syntax highlighter을 구현할 수 있습니다.