• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.4 duplication the CODE tag but in a different colour ?

eva2000

Well-known member
#1
My forums extensively use use the CODE bbcode tag for code. But I want sometimes use a different background and font colour (black background + white text) like I do on my main site see example at http://centminmod.com so want to duplicate the CODE bbcode tag with a bbcode named like CODEB or something.

I want a wider margin for the CODEB tag as well. Using dev tools inspector i altered the existing CODE tag's CSS but of course need to rename these css references for CODEB.

Questions

  1. Question is how would the custom bbcode be setup ? there's no admin reference to what the default CODE bbcode tag looks like to be able to duplicate it in custom bbcode add section ? HTML replacement code something like
    Code:
    <div class="bbCodeBlock bbCodeCode">
    <div class="type">Code (Text):</div>
    <div class="code">{text}</div>
    </div>
    . I believe I got that far so far https://community.centminmod.com/threads/testing-custom-codeb-tag.4998/
  2. Also how to add CODEB tag to overlay dropdown language code menu ?
  3. Also the CODE default bbcode doesn't pick up tag codes in text, but CODEB tag does ? how to disable that ? i already have parse BBCODE disabled ?

Code:
.bbCodeBlock {
    margin: 1em 80px 1em 0;
    border: 1px solid #e8e8e8;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -khtml-border-radius: 0px;
    border-radius: 0px;
    overflow: auto;
}

.bbCodeBlock .type {
    font-size: 11px;
    font-family: 'Open Sans',sans-serif;
    color: #fff;
    background-color: #000;
    padding: 7px 8px;
    border-bottom: 1px solid #e8e8e8;
    -webkit-border-top-left-radius: 0px;
    -moz-border-radius-topleft: 0px;
    -khtml-border-top-left-radius: 0px;
    border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -moz-border-radius-topright: 0px;
    -khtml-border-top-right-radius: 0px;
    border-top-right-radius: 0px;
}

.bbCodeBlock pre, .bbCodeBlock .code {
    font-size: 10pt;
    font-family: Consolas,'Courier New',Courier,monospace;
    background-color: #000;
    padding: 10px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -khtml-border-radius: 0px;
    border-radius: 0px;
    word-wrap: normal;
    overflow: auto;
    line-height: 1.24;
    min-height: 30px;
    max-height: 500px;
    _width: 600px;
    direction: ltr;
    color: #fff;
}
example for CODEB custom bbcode

upload_2015-11-23_10-44-23.png

cheers
 
Last edited: