XenForo default code block functionality is rather basic. Thankfully GeSHi Syntax Highlighter add-on provides richer support for hundreds of programming languages. However the default GeSHi colour scheme is far from ideal on dark background therefore, once again, we needed some extra customization.
Thanks that article on CyberAsylum we could easily work something out and apply a neat dark theme to our GeSHi syntax.
Nonetheless that required a couple of change to BBcode Formatter Base.php.
Basically you need to add enable_classes and set_overall_class lines to each of your formatter, CODE, HTML and CSS so that they look like that:
Then edit your EXTRA.CSS and add something like:
See also GeSHi on GitHub.
Thanks that article on CyberAsylum we could easily work something out and apply a neat dark theme to our GeSHi syntax.
Nonetheless that required a couple of change to BBcode Formatter Base.php.
Basically you need to add enable_classes and set_overall_class lines to each of your formatter, CODE, HTML and CSS so that they look like that:
PHP:
$geshi->set_link_target('_blank" rel="nofollow');
$geshi->set_header_type(GESHI_HEADER_NONE);
$geshi->set_tab_width(4);
$geshi->enable_classes(true);
$geshi->set_overall_class('geshi');
$content = $geshi->parse_code();Then edit your EXTRA.CSS and add something like:
CSS:
/*
* Geshi stylesheet
*
* CyberAsylum.eu
* dark theme by niekto@niekde.sk (Jaroslav Petras)
* there is no licence and you can use it, copy it, sell it
* or burn it
*
*/
div.bbCodeBlock
{ background: @pageBackground !important; }
/* all */
.geshi
{ border: none !important; }
/* lines */
.geshi .li1
{ background: @pageBackground !important; }
.geshi .li2
{ background: @pageBackground !important; }
/* brackets */
.geshi .br0
{ color: #bfbfbf !important; }
/* comments */
.geshi .co0,
.geshi .co1,
.geshi .coMULTI
{ color: #7a7a75 !important; }
/* strings */
.geshi .st0,
.geshi .st_h
{ color: #ff4444 !important; }
/* methods */
.geshi .me0,
.geshi .me1
{ color: #ffffff !important; }
.geshi .me2
{ color: #ffcc66 !important; }
/* keywords */
.geshi .kw1
{ color: #99ee00 !important; }
.geshi .kw2
{ color: #eeaa22 !important; }
.geshi .kw3
{ color: #dd88ff !important; }
.geshi .kw4
{ color: #ff7744 !important; }
/* operators */
.geshi .sy0
{ color: #44ffbb !important; }
/* numbers */
.geshi .nu0
{ color: #ff2288 !important; }
/* variables */
.geshi .re0
{ color: #88c0ff !important; }
.geshi .re1
{ color: #88c0ff !important; }
.geshi .re2
{ color: #ccddff !important; }
.geshi .re3
{ color: #88c0ff !important; }
.geshi .re4
{ color: #88c0ff !important; }
.geshi .re5
{ color: #ddddff !important; }
/* EOF */See also GeSHi on GitHub.
Last edited: