WordPress.org

Français

Obtenir WordPress
WordPress.org

Plugin Directory

Syntax-highlighting Code Block (with Server-side Rendering)

Syntax-highlighting Code Block (with Server-side Rendering)

Par Weston Ruter
Télécharger

Description

Cette extension étend le bloc Code dans le cœur de WordPress pour ajouter la coloration syntaxique, laquelle rendue sur le serveur. Les blocs Code préexistants sur un site sont automatiquement étendus pour inclure la coloration syntaxique. La mise en évidence de la syntaxe côté serveur élimine le besoin de mettre en file d’attente tout JavaScript sur l’interface publique (par exemple Highlight.js ou Prism.js) et cela garantit qu’il y aucun flash de code non mis en évidence (FOUC ?). La réduction du nombre de scripts sur l’interface publique améliore les performances de ce dernier et permet également au code mis en évidence par la syntaxe d’apparaître correctement dans les pages AMP telles qu’elles sont rendues par l’extension AMP officiel (voir également ampproject/amp-wp#972) ou lorsque JavaScript est inactif dans le navigateur.

Ce bloc Code étendu utilise la détection automatique du langage pour ajouter la coloration syntaxique, mais vous pouvez surcharger le langage dans la colonne latérale des réglages du bloc (il n’y a actuellement aucune mise en évidence de la syntaxe du bloc Code dans l’éditeur, mais voyez #8). L’extension prend en charge tous les langages de programmation que highlight.php prend en charge (étant un portage de highlight.js). Le bloc Code est également étendu pour prendre en charge la spécification des lignes à mettre en évidence qui sont marquées par des éléments mark (y compris dans les flux RSS). Une case à cocher permet également d’afficher ou non les numéros de ligne sur l’interface publique (les numéros n’étant pas sélectionnables). Enfin, étant donné les incohérences entre les thèmes quant à savoir si les lignes d’un bloc Code doivent être renvoyées à la ligne, cette extension ajoute un style pour les forcer à ne pas utiliser de retour chariot par défaut, avec une case à cocher pour opter pour forcer le retour à la ligne si vous le souhaitez.

Pour une utilisation avancée, veuillez consulter le wiki de l’extension.

Cette extension est développée sur GitHub. Voir la liste des problèmes actuels avec l’extension. N’hésitez pas à nous faire part de tout problème ou demande supplémentaire que vous pourriez rencontrer. Les pull requests sont les bienvenues. Voir les informations sur la contribution.

Crédits

C’est un fork de Code Syntax Block par Marcus Kazmierczak (mkaz), qui est également disponible sur WordPress.org. Copyright (c) 2018 Marcus Kazmierczak. Sous licence GPL 2.0 ou ultérieure.

highlight.php est publié sous la licence BSD 3-Clause. Copyright © 2006-2013, Ivan Sagalaev (maniac@softwaremaniacs.org), highlight.js (auteur original). Copyright © 2013, Geert Bergman (geert@scrivo.nl), highlight.php

Captures d’écrans

  • Les blocs de code peuvent être ajoutés comme d’habitude, en surchargeant éventuellement la langue détectée automatiquement. Indiquez également les lignes à mettre en évidence, si les numéros de lignes doivent être affichés et si les lignes doivent avoir des retours à la ligne.
  • Le bloc Code s’affiche avec une mise en évidence de la syntaxe sur l’interface publique sans qu’aucun JavaScript ne soit mis en file d’attente. Les feuilles de style ne sont ajoutées que lorsque le bloc est sur la page.

Avis

Very good job!

3 juin 2023 1 réponse
missed just a download and/or copy button. also for theme, maybe is best to update « usage instruction »! only after some search I understood can be changed via customized menu. anyway, looks so good. ty.

It’s time to switch to get more performance!

13 juillet 2022 1 réponse
I confess, I’ve been a happy user of Code Syntax Block for quite a while — a plugin which the author, Weston Router, clearly states that Syntax Highlighting (Code Block) is based upon. Alas, however, all the pages I had with the older plugin would suffer from an inevitable rendering slowdown — there is so much Javascript on web pages these days that such a slowdown is inevitable, and this is especially true to those scripts that attempt to recognise the language automatically — something that will consume plenty of CPU cycles on the browser. Parsing the language is also no mean feature by itself (I know, I’ve been doing some experiments for some code editors, and, believe me, it’s tough!). So why force the end-user to bear the burden of all that work? It makes much more sense to pre-render everything on the server, and then let the web server send the already-parsed HTML from its cache. That way, the end-user will already have everything on their browser, no need to wait for parsing! Also, if you ‘forget’ to set the language that your code is in (it happens…), the auto-detecting feature will only run on the server, and just once, when you save the post you’re writing. Even if it takes a fraction of a second more to save, think of how much time all those users will save when they get the already-rendered page! So, this plugin is definitely recommended. As a bonus: if you are already using some sort of code block on your WP setup, once you turn off whatever plugin you were using, Syntax Highlighting (Code Block) will immediately pick it up and start its magic (you might need to open and save all the pages you’ve got code on, though — I’m not quite sure if that’s really the case). That means zero effort (beyond saving) — what you already had will continue to work. And, naturally enough, when you disable this plugin, your code block will just revert to the internal WP code block instead — nothing will be ‘lost’ that way! If you’re still hesitant and reading this to the end… while you wasted your time here, think of how many of your users would have saved their time if you already had this plugin installed 🙂

Muy bueno!

19 avril 2022
No agrega bloques nuevos a WordPress, ya que potencia el bloque de código existente. Soporta gran cantidad de Lenguajes, puedes mostrar líneas y marcar ciertas partes del código. ¡Vaya todo lo que necesito! Y no hay que configurar nada!
Lire les 26 avis

Contributeurs/contributrices & développeurs/développeuses

« Syntax-highlighting Code Block (with Server-side Rendering) » est un logiciel libre. Les personnes suivantes ont contribué à cette extension.

Contributeurs

“Syntax-highlighting Code Block (with Server-side Rendering)” a été traduit dans 9 locales. Remerciez l’équipe de traduction pour ses contributions.

Traduisez « Syntax-highlighting Code Block (with Server-side Rendering) » dans votre langue.

Le développement vous intéresse ?

Parcourir le code, consulter le SVN dépôt, ou s’inscrire au journal de développement par RSS.

Journal des modifications

Pour le journal des modifications de l’extension, veuillez consulter la page des Modifications sur GitHub.

Méta

Évaluations

5 sur 5 étoiles.

Ajouter mon avis

Voir tous les avis

Support

Demandes résolues ces deux derniers mois :

1 sur 1

Voir le forum de support