web-dev-qa-db-fra.com

Afficher la boîte de dialogue dans le plugin TinyMCE et utiliser les fonctions WordPress php dans celle-ci

J'ajoute un bouton TinyMCE à mon plugin. Jusqu'à présent, j'ai pu ajouter le bouton et appeler mon fichier editor_plugin.js et sa commande. Ce n'est pas une mission facile d'ailleurs ...

Je veux que ce bouton affiche une boîte de dialogue, qui offre plusieurs options à l'utilisateur. Ce sont des listes déroulantes que je dois remplir et des zones de texte pour que l'utilisateur écrive simplement l'entrée. Certaines d’entre elles ont besoin d’informations provenant de fonctions WordPress, d’autres d’informations statiques.

Une fois cette boîte de dialogue acceptée, je souhaite qu’elle écrive le code court sur le message pour que mon plug-in s'affiche avec les options sélectionnées dans la zone.

Le problème est que je souhaite utiliser certaines des fonctions de WordPress dans mon fichier php. Mais c'est un peu "hors contexte". Je ne peux pas utiliser les fonctions WordPress, ni même les fonctions __() pour i18n.

Voici le code que j'utilise dans l'un des exemples de TinyMCE:

ed.addCommand('mceExample', function() {
                            ed.windowManager.open({
                                    file : url + '/box.php',
                                    width : 500 + ed.getLang('example.delta_width', 0),
                                    height : 300 + ed.getLang('example.delta_height', 0),
                                    inline : 1
                            }, {
                                    plugin_url : url, // Plugin absolute URL
                                    some_custom_arg : 'custom arg' // Custom argument
                            });
                    });

Je manque aussi le moyen d'écrire dans le post. Comme vous pouvez le voir ici, ce code n’utilise rien pour écrire dans le post. J'ai essayé d'utiliser ce code que j'ai trouvé sur un autre exemple: ed.execCommand('mceInsertContent', false, 'Hello World'); mais je n'ai pas trouvé comment l'utiliser sur mon nouveau script.

Désolé si cette question a déjà été résolue, mais toute la documentation concernant les tâches de TinyMCE est assez déroutante, et j'ai eu du mal à l'intégrer dans mes plugins. Merci d'avance.

1
Fernando Briano

Au lieu de requérir admin.php, vous pouvez simplement utiliser la fonctionnalité ajax intégrée WP, même si ce n'est pas ajax dans ce cas.

Ajouter un crochet

 add_action('wp_ajax_my_plugin_function', 'my_plugin_function_callback');

Créez votre fonction de sortie (rappel)

function my_plugin_function_callback() {
    // do stuff
}

Appelez ça comme ça

au lieu de:

file : url + '/box.php',

vous devriez pouvoir utiliser le ajaxurl global:

file: ajaxurl + '?action=my_plugin_function&optional=data ...

Peut-être ajouter un nonce pour des raisons de sécurité, mais c'est vous qui décidez :)

5
ungestaltbar

[modifier: partie manquante de la question]

Je ne peux pas jurer que cela soit une bonne pratique, mais la solution que j'ai vue consiste à inclure "wp-admin/admin.php", ce qui devrait vous permettre d'accéder à toutes les fonctions WordPress.

Le défi est d’y arriver, étant donné que votre plugin peut être renommé/déplacé. Cette solution [hackish] suppose que le plugin réside toujours dans le répertoire 'wp-content'. Vous voudrez placer ce code en haut de votre fichier 'box.php'.

$admin = dirname( __FILE__ ) ;
$admin = substr( $admin , 0 , strpos( $admin , "wp-content" ) ) ;
require_once( $admin . 'wp-admin/admin.php' ) ;

S'il y a une meilleure façon de faire cela, j'aimerais bien le voir aussi - cela semble un peu hackish.

Pour ce qui est de remettre votre contenu dans l'éditeur, vous devez inclure le fichier "tiny_mce_popup.js" dans votre boîte de dialogue. Mettez ceci dans la tête de votre fichier box.php.

<script type="text/javascript" src="<?php echo get_option( 'siteurl' ) ?>/wp-includes/js/tinymce/tiny_mce_popup.js"></script>

Votre boîte de dialogue doit avoir une forme de méthode javascript qui est déclenchée lorsque l'utilisateur clique sur OK. Dans cette méthode, vous utiliserez la commande execCommand, comme suit:

<script type="text/javascript">
function myOnSubmitFunction( ){
    tinyMCEPopup.editor.execCommand('mceInsertContent', false, 'Put your content here...' ) ;
}
</script>

Espérons que je l'ai un peu plus clair.

2
user3437