Prettify
But
Affiche de la syntaxe des extraits de code source.
Needs translation
Use when
- Applying syntax highlighting to source code snippets on a web page.
Exemple pratique
Comment mettre en œuvre
-
Appliquer
class="wb-prettify"
à un élément sur la page pour charger le composant (une fois par page) :<span class="wb-prettify"></span>
-
Appliquer
class="prettyprint"
à un élément pre ou code pour appliquer la mise en surbrillance de syntaxe. Comme alternative utiliserclass="wb-prettify all-pre"
pour appliquer la mise en surbrillance de syntaxe à tous les éléments pre sur la page :<pre class="prettyprint"> <!-- Appliquer la mise en surbrillance de syntaxe à tous les éléments pre sur la page --> <span class="wb-prettify all-pre"></span>
-
Appliquer
class="linenums"
à un élément pre ou code pour ajouter les nombres de ligne. Comme alternative utiliserclass="wb-prettify linenums"
pour ajouter les nombres de ligne à tous les éléments pre applicables. Spécifier le nombre commençant en ajoutantlinenums:#
avant linenums :<pre class="prettyprint linenums"> <!-- Spécifier le nombre commençant --> <pre class="prettyprint linenums:50 linenums"> <!-- Ajouter les nombres de ligne à tous les éléments pre applicables --> <span class="wb-prettify linenums"></span>
- Ajouter le soutien supplémentaire de langage de programmation avec
class="wb-prettify lang-*"
et en ajoutantclass="lang-*"
à chaque élément pre ou code applicable :
Les formats supportés sont ci-dessous :<span class="wb-prettify lang-css"></span> <pre class="prettyprint lang-css">
- lang-apollo
- lang-clj
- lang-css
- lang-dart
- lang-go
- lang-hs
- lang-lisp
- lang-lua
- lang-ml
- lang-n
- lang-proto
- lang-scala
- lang-sql
- lang-tex
- lang-vb
- lang-vhdl
- lang-wiki
- lang-xq
- lang-yaml
Needs translation
Configuration options
All configuration options of the plugin are controlled with CSS classes.
Option | Description | How to configure |
---|---|---|
all-pre |
Applies syntax highlighting to all pre elements on the page. | Add all-pre CSS class to the wb-prettify element. |
linenums |
Adds line numbers to the syntax highlighting. | Add linenums CSS class to the wb-prettify or prettyprint element. |
linenums:# |
Specifies the starting line number (e.g. linenums:20 starts the line numbers at 20). Must be added along with the linenums CSS class. | Add linenums:# CSS class to a prettyprint element, before the linenums CSS class |
lang-* |
Specifies language specific syntax highlighting. | Add lang-* CSS class to the wb-prettify and prettyprint elements. |
Events
Document the public events that can be used by implementers or developers.
Event | Trigger | What it does |
---|---|---|
wb-init.wb-prettify |
Triggered manually (e.g., $( ".wb-prettify" ).trigger( "wb-init.wb-prettify" ); ). |
Initializes the plugin and applies syntax highlighting to the web page's pre and code elements. Note: The Prettify plugin will be initialized automatically unless the element is added after the page has already loaded. |
wb-ready.wb-prettify (v4.0.5+) |
Triggered automatically after the Prettify enhancement has completed. | Used to identify when Prettify has finished enhancing the page.
|
wb-ready.wb (v4.0.5+) |
Triggered automatically when WET has finished loading and executing. | Used to identify when all WET plugins and polyfills have finished loading and executing.
|
Source code
- Date de modification :