CODEWITHSUNDEEP
javascripthtmlcsssyntax-highlightingsyntaxhighlighter
chrisapotek
chrisapotek

Reputation: 6227

SyntaxHighlighter: How to remove the lime-colored question mark or at least change its color?

Well, the green question mark does not go with my website color scheme. How do I change/remove it? You can see it here: http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html

Thanks!

Upvotes: 14

Views: 5023

Answers (7)

Om Sao
Om Sao

Reputation: 7663

The question mark toolbar can be removed in 2 ways;

  1. CSS method: In file shThemeDefault.css add property for display: none; inside, selector: '.syntaxhighlighter .toolbar '

  2. JavaScript statement Method Just before the closing of tag, alongwith statement SyntaxHighlighter.all(); include this statement SyntaxHighlighter.defaults.toolbar = false; or SyntaxHighlighter.defaults['toolbar'] = false;

Detailed explaination on: use-syntax-highlighter-in-website-blog-html

Upvotes: 0

Pramod Kishore
Pramod Kishore

Reputation: 315

If you are facing this issue for your Google Blogger, it means you have already added SyntaxHighlighter libraries in your template.

So go to Template in your Blogger. Then click on Edit HTML and search for the line:

SyntaxHighlighter.all();

Add the below line before that line:

SyntaxHighlighter.defaults['toolbar'] = false;

This will disable your lime-colored question mark in Blogger.

Upvotes: 1

e.s. kohen
e.s. kohen

Reputation: 303

Use Syntax Highlighter's Configuration API to disable the Toolbar, the Green Question Mark box when it doesn't display properly.

After your Brush Script References, add this ...

...
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/>
... 
<script language='javascript'> 
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
</script>

Upvotes: 0

David Kerwick
David Kerwick

Reputation: 538

What I found with the answer given is that if you try to use

<pre class="brush: plain; collapse: true">
    test
</pre

It won't display the "expand source" as the whole toolbar is hidden

I believe this css targets the green box and the question mark only, leaving the toolbar available for other functions

.syntaxhighlighter div.toolbar span a.toolbar_item{
   display: none !important;
} 

.syntaxhighlighter .toolbar {
  background: none !important;
}

Upvotes: 1

Dmitry Trifonov
Dmitry Trifonov

Reputation: 1119

For version 3.0.x

SyntaxHighlighter.defaults['toolbar'] = false;

Upvotes: 3

Fred Yang
Fred Yang

Reputation: 2601

SyntaxHighlighter.defaults.toolbar = false;

Upvotes: 46

Kiran
Kiran

Reputation: 20313

In your shThemeDefault.css you can find the following code:

.syntaxhighlighter .toolbar {
    background: none repeat scroll 0 0 #6CE26C !important;
    border: medium none !important;
    color: white !important;
}

Above CSS difines to display green color '?' mark in you website.So, if you want to hide that then specify display : none in above code.If you need to change the background color you can specify you desired color in background property.

Upvotes: 10

Related Questions