Comments (9)
I'm having the same issue.
This works correctly :
<pre><code class="language-css">p { color: red }</code></pre>
Whilst this failed at highlighting syntax :
<pre><code class="language-none">p { color: red }</code></pre>
I have to set the class on the <pre>
tag to make it work :
<pre class="language-none"><code>p { color: red }</code></pre>
from prism.
Since Prism doesn’t have this issue out of the box, it sounds like an issue with the WP plugin. Anyone know its author so we can @mention him/her here?
from prism.
Not sure this has something to do with WordPress. See this JS Bin : http://jsbin.com/aduvun/1/
Note that this happens on Chrome 26.0.1410.65 and Safari 6.0.4 (7536.29.13). Not tested on other browsers.
from prism.
Oh, maybe I misunderstood the issue. Well of course you need to define the language somewhere, otherwise Prism wouldn’t know how to highlight it.
Some syntax highlighters auto-detect languages, but this is usually done by brute force: Trying to highlight with every available language and counting the number of resulting tokens. I think it’s pretty inefficient.
from prism.
Sorry, I think I have poorly expressed myself. The issue is not really auto-detecting of languages, but setting a default highlighting when a <code>
tag has an undefined language setted in its class.
See the second example, when class="language-none"
is setted on the <code>
tag, the text loses the dark background color (it is kind of difficult to notice it on the screenshot because it's almost white on white). However if I set class="language-none"
on the <pre>
tag it works perfectly.
Maybe that's the intended behaviour, but it looks odd to me.
from prism.
To be clear, it looks like the WordPress plugin just takes care of adding the Prism assets to the page:
http://plugins.svn.wordpress.org/prism-syntax-highlighter/trunk/wp-prism.php
The real issue here (as @iamdto explained) is that the following two examples render exactly the same:
<pre class="language-css"><code>p { color: red }</code></pre>
<pre><code class="language-css">p { color: red }</code></pre>
While the following two examples render differently:
<pre class="language-none"><code>p { color: red }</code></pre>
<pre><code class="language-none">p { color: red }</code></pre>
(They match @iamdto's results from above)
I think this is all due to the following line of CSS:
https://github.com/loganfranken/prism/blob/gh-pages/themes/prism.css#L55
Removing the :not(pre) >
appears to fix it. I can put a PR for this unless there are any objections.
from prism.
8030db9 actually fixed this as well (nice work @Golmote!):
https://jsfiddle.net/za1qg99x/
Looks like this can be closed!
from prism.
Indeed. Thanks!
from prism.
So cool, seriously didn't think this would get picked up, amazing work! <3
from prism.
Related Issues (20)
- Add support for caddyfile (caddy)
- Show-invisibles plugin throws TypeError exception with Dart and Lisp languages
- Add support for CoNLL-U framework
- JavaScript syntax number strings rendered with an offset HOT 2
- Highlighting working in TinyMCE, but not website
- Library broken in Service worker HOT 1
- Masm, Nasm, Fasm or just asm
- Unterminated parenthetical HOT 2
- [CSharp] Attributes following comments are either mis-tagged or not tagged as `class-name`
- Microsoft Typespec HOT 1
- C# `file` keyword/accessibility modifier is not highlighted
- Crowdstrike/LogScale/Humio syntax highlighting
- Jsonnet language syntax support
- Support for VEX, SideFX Houdini's scripting language
- [Language request] Smithy support
- Overwrites autoloader path HOT 2
- Add support for Lean (lean) HOT 1
- [Language Request] Mojo by Modular
- Add syntax highlighting for GNU Autotools
- Bash syntax highlighting is weak compared to highlight.js
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.