The Pygments syntax highlighter can be used
for xhtml11, html5 and bootstrap outputs (set the source-highlighter
attribute to pygments).
Until now, AsciiDoc allow only to use Pygments with a default theme that look like to emacs
theme.
We have no way to customize this at document build time, unless editing contents of ./stylesheets/pygments.css
file.
AsciiDoc-Bootstrap backend introduce in version 3.1.0 the new attribute pygments-style
to change Pygments stylesheet at document build time.
![]() | |
Credit to AsciiDoctor GH-637 issue. |
By default, AsciiDoc-Bootstrap used the AsciiDoc pygments theme. To change the style,
set the pygments-style
attribute and assign it the alternate style’s name.
![]() | |
To see what pygments styles you have available, open a terminal and type: $ pygmentize -L styles It will output the style names and brief descriptions. Pygments 1.5 provides 19 themes, but only 3 pre-defined stylesheets are available in standard AsciiDoc-Bootstrap backend distribution (default, pastie, monokai). Here are how to setup other themes. Open a terminal and type: $ pygmentize -f html -S <theme> -a .highlight where |
In the example document below, we used the monokai
style as main theme,
and pastie
as local theme to highlight a block of CSS code.
![]() | |
Pygments token |
![]() | |
The source-highlighter |
== Alternate Pygments Theme :source-highlighter: pygments :pygments-style: monokai [source,php,numbered] .Using global theme [label label-default]#{pygments-style}# ---- <?php use Symfony\Component\Finder\Finder; $finder = new Finder(); $finder->files()->in(__DIR__); foreach ($finder as $file) { // affiche le chemin absolu print $file->getRealpath()."\n"; // affiche le chemin relatif d'un fichier, sans le nom du fichier print $file->getRelativePath()."\n"; // affiche le chemin relatif du fichier print $file->getRelativePathname()."\n"; } ---- [source,css] .Using local theme [label label-default]#{local-css-style}# ---- /* |-------------------------------------------------------------------------- | UItoTop jQuery Plugin 1.2 | http://www.mattvarone.com/web-design/uitotop-jquery-plugin/ |-------------------------------------------------------------------------- */ #toTop { display:none; text-decoration:none; position:fixed; bottom:10px; right:10px; overflow:hidden; width:51px; height:51px; border:none; text-indent:100%; background:url(../images/icons/ui.totop.png) no-repeat left top; } #toTopHover { background:url(../images/icons/ui.totop.png) no-repeat left -51px; width:51px; height:51px; display:block; overflow:hidden; float:left; opacity: 0; -moz-opacity: 0; filter:alpha(opacity=0); } #toTop:active, #toTop:focus { outline:none; } ----
Renders