web-dev-qa-db-fra.com

Meilleures pratiques pour incorporer le code sur Wordpress?

J'ai deux sites de blog. Une hébergée avec Wordpress.com, une auto-hébergée avec Wordpress.org

Nous sommes une entreprise technique, et un certain nombre de nos blogs porteront sur HTML, Javascript, .NET, etc., et nous aimerions intégrer des extraits de code dans nos messages.

Nous avons environ 20 auteurs sur chaque blog et, par expérience, je dois faire en sorte que l'insertion de fragments de code soit aussi simple et conviviale que possible.


Wordpress.org
J'ai vu, pour Wordpress.org, cet article .
D'après ce que j'ai compris, lors de l'écriture avec l'éditeur HTML, si vous appliquez les balises <code> some code</code>, la mise en forme est préservée.
- C'est bon. Mais le principal inconvénient est la facilité d'utilisation. Par exemple, comparez-le à l'éditeur de texte à échange de pile. Il n'est pas nécessaire de passer en mode HTML et d'écrire des balises, utilisez le bouton 'Exemple de code'.

Je sais qu'il existe un tas de plugins là-bas.
Existe-t-il un consensus général sur la meilleure façon d’intégrer du code dans les publications wordpress.org?

Mes exigences sont que cela soit aussi simple qu'avec Stack Exchange.


Wordpress.com
Il semble que je puisse également utiliser les balises de code avec wp.com.
Je suppose que l’avantage de dire à mes utilisateurs d’utiliser cette approche signifierait qu’il n’y aurait pas de confusion avec les auteurs qui contribuent aux deux blogs.

J'utilisais actuellement le format de texte 'préformaté' de la barre d'outils étendue (évier de cuisine).
Je suppose qu'il n'y a pas d'autres options?

1
Simon

Je préfère utiliser SyntaxHighlighter Evolved qui est co-écrit par Viper007Bond et automattic. Il utilise la solution JavaScript d’Alex Gorbatchev qui prend en charge un grand nombre de langues et est hautement personnalisable.

4
Joseph Leedy

Une autre option consiste à placer vos extraits de code dans Gist et à utiliser le plugin Embed GitHub Gist . Fonctionne bien et offre l’avantage que votre code soit contrôlé par la révision et qu’il puisse être facilement ajouté.

1
webaware

J'avais besoin de quelque chose comme ça et essayé comme 20 plugins liés, et ils ont tous échoué d'une manière ou d'une autre. La plupart des problèmes proviennent de WP filtres affectant le code, tels que la conversion de :) en smileys, ou l'ajout de rel="nofollow" à des liens, etc.

J'ai donc fini par créer mes propres fonctions. En gros, j'accroche une fonction sur the_content/comment_text avec la priorité la plus élevée, dans laquelle je remplace tout le contenu entre les balises PRE/CODE par un ID unique, comme <-- CODE 1 HERE -->, tout en enregistrant ce contenu dans une variable (et le convertissant en entités HTML).

Ensuite, j'attache une autre fonction aux mêmes balises, mais avec la priorité la plus basse (après que tous ces filtres WP ont été appliqués au contenu), et je remplace l'ID ci-dessus par le code stocké dans la variable.

Donc, le code reste inchangé par les filtres. Ensuite, je lance un script de surligneur syntaxe javascript simple - j'ai choisi highlight.js

Je peux poster mon code si vous le souhaitez ...

Stackexchange utilise markdown , le code est encapsulé entre les ticks, pas avec les balises html. En tout cas, l'idée reste la même

1
onetrickpony

Selfhosted: Vous pouvez créer des étiquettes courtes/shortcodes (ce que la plupart des plugins feront probablement déjà) ou créer des types de publication personnalisés pour des ressources de code, ajoutez une méta-boîte vos écrans de post-édition et un lien à partir de là vers vos types de post personnalisés contenant les extraits. Les deux solutions nécessiteront probablement beaucoup de travail et presque la même chose que d’utiliser un plugin bien écrit.

Ma recommandation: Stick avec un plugin.

Ad <code>: Si vous écrivez à propos de code, vous devez déjà être familiarisé avec le langage HTML de base (je suppose donc que j'ai mal compris votre Q), mais enfin: <code> est pour le code en ligne et <pre> est pour le code multi-ligne. Ce dernier conservera les sauts de ligne, mais l’aspect reposera sur vos styles CSS.

0
kaiser

Une chose que j'ajouterai de mon expérience personnelle:

Soyez prudent lorsque vous intégrez du code que vous fournissez à d'autres personnes si vous n'utilisez pas un type de surligneur de syntaxe. J'ai essayé les deux suggestions d'utilisation des balises <pre></pre> et <code></code>. Ils vont ajouter un espace supplémentaire à vos balises php, et peuvent également avoir des effets négatifs sur les guillemets simples et doubles. Ce ne serait pas bien si vous aviez soudainement un blog rempli d'utilisateurs en colère.

Je suggère d'utiliser un surligneur de syntaxe si vous envisagez d'offrir des extraits à d'autres utilisateurs. Je vais donner ma suggestion, mais j'aimerais entendre ce que les autres utilisent aussi, donc j'espère que quelqu'un va "sonner": celui que je sais qui fonctionnera est un extrait de Snipplr . (cela nécessite une inscription, vous pouvez utiliser le plugin WordPress disponible ici: Lien vers WP Répertoire du plugin . J'espère que cela aide.

0
Jeremy Jared