J'ai posé cette question il y a environ un an et j'espère qu'il existe un type de solution simple qui me permettra d'atteindre mon objectif. Alors voilà:
J'utilise souvent des codes courts dans l'éditeur d'administration, mais lorsque je remets cela au client, ils ne comprennent souvent pas comment ils fonctionnent.
Ce que je recherche, c'est une solution qui rendrait simplement automatiquement la sortie associative des shortcodes dans l'éditeur WYSIWYG administrateur.
D'un point de vue visuel, j'aimerais que cela s'affiche de la même manière que lorsque la ligne "plus" apparaît ou lorsqu'une image est affichée dans l'éditeur. J'entends par là que l'utilisateur verrait la sortie mais ne pourrait que la supprimer mais pas éditer le contenu du shortcode rendu.
Réponses:
En fait, ce n'est pas trop mal de faire ce que vous demandez. Cela devrait vous prendre environ une heure pour faire votre premier, et 10 minutes pour faire les suivants.
En fin de compte, ce que vous allez faire est de créer un plugin TinyMCE. Voici ce que vous devez vous armer pour commencer:
Vous avez maintenant tous les outils pour vous en sortir! De tout cela, le code qui vous intéressera le plus est ce bloc dans l'exemple de code WP:
Ici, le shortcode d'une galerie est remplacé par une
img
balise. Laimg
balise a la classewp-gallery
, qui est stylisée par le CSS trouvé ici .Edit 2016-04-06: Contenu et liens mis à jour pour TinyMCE 4 et WordPress 4.4
la source
Ce n'est pas une réponse complète, juste une direction de conception. Je pense que la meilleure approche est quelque chose comme ceci:
Dans le post de modification de l'administrateur
Extrayez tous les shortcodes de la publication enregistrée et rendez-les dans une métabox, à l' exception de l'éditeur . Assurez-vous qu'ils apparaissent dans le même ordre que les shortcodes se produisent dans le petit éditeur.
Dans l'API javascript de tinyMCE
Faire une fonction jQuery, lorsque l'utilisateur clique sur un shortcode, il échange le HTML de la metabox dans l'éditeur. Et vice versa. L'ordre lui-même devrait être correct en tant qu'association, mais je ne crains pas de placer des shortcodes. Cependant, il existe de nombreuses façons de concevoir une belle connexion ID. Les mises à jour des shortcodes peuvent être effectuées à la volée avec ajax.
N'enregistrez jamais l'état de shortcode rendu
Avant de changer d'éditeur, d'enregistrer des brouillons, des brouillons automatiques et de publier, effectuez un appel d'API pour déclencher la restauration, de sorte que l'état de shortcode rendu ne soit jamais enregistré ...
Cela peut être fait, mais vous devez être familier avec l'API tinyMCE pour comprendre où et quand accéder au contenu de l'éditeur et vous connecter aux actions javascript avant de «sauvegarder» et plus encore.
Il peut y avoir plusieurs éditeur tinyMCE sur le même post-edit pageload.
La partie restauration peut être étudiée en regardant le
[gallery]
code court. Mais le clic sur[MY_SHORTCODE]
doit être fait par quelques astuces jQuery.dans le script admin_footer, accédez au contenu de l'endroit où le curseur est actif avec:
est un indice sur la façon de commencer.
la source
Je cherchais également un moyen d'afficher graphiquement et de modifier les shortcodes. Et maintenant, enfin, j'ai trouvé un tutoriel qui fait exactement cela: https://generatewp.com/take-shortcodes-ultimate-level/
J'ajoute la description pour que les moteurs de recherche la récupèrent:
la source