Come posso utilizzare la funzionalità "Sfoglia link" di Wordpress integrata?

Sto codificando un widget e vorrei che l'utente fosse in grado di scegliere un collegamento come è possibile quando si modificano post o pagine normali (quando si fa clic sull'icona del piccolo collegamento e si ottiene la funzionalità di ricerca AJAX nel pop-up ). Qualcuno sa come faccio a farlo funzionare? Ho un pulsante HTML che vorrei allegare e fare clic anche a, e un campo in cui inserire il valore.

In class-wp-editor.php ho trovato alcune cose interessanti e mi chiedevo se potevo aver bisogno di questi file ..?

wp_enqueue_script('wp-fullscreen');
wp_enqueue_script('wplink');

Alla chiamata fullscreen.link();, come il file sopra menzionato, ottengo questo errore:

Uncaught ReferenceError: wpActiveEditor is not defined

..e per ora sono sconcertato, perché il JS che fa riferimento a quella variabile mi sembra pazzo.

Vuoi indicarmi la giusta direzione? Mi piacerebbe farlo funzionare, creerà un'interfaccia utente killer per i miei widget!

------modificare-------

Finora non molto codice, a parte le inclusioni di script che ho precedentemente affermato;

<label for="<?php echo $this->get_field_name('link'); ?>">Link URL (including http://) : </label>
<input type="text" id="<?php echo $this->get_field_id('link'); ?>" name="<?php echo $this->get_field_name('link'); ?>" value="<?php if(isset($link)) echo esc_attr($link); ?>" class="widefat" />
<button class="secondary" id="choose_link">Link Browser</button>

..la parte di JS che dovrebbe attivare l'apertura dello script di collegamento;

linkBrowserButton.on("click", function(e){
    e.preventDefault();
    fullscreen.link();
});

Invoco il dialogo di collegamento all'interno della classe metabox che utilizzo per lo sviluppo. È un po 'confuso ma può essere fatto, fino a quando non viene sviluppato qualcosa di più robusto .

È possibile richiamare la casella dei collegamenti accodando prima i js richiesti e quindi interagendo con i metodi dei file js wp-link.

Assicurati di aver accodato wp-link

1 / wp_enqueue_script( 'wp-link' );

2 / Configura la tua interfaccia utente. Di solito utilizzo un pulsante per richiamare la finestra di dialogo dei collegamenti e un campo di testo per gestire l'URL dei collegamenti.

3 / Richiama il dialogo di collegamento

var _link_sideload = false; //used to track whether or not the link dialogue actually existed on this page, ie was wp_editor invoked.

var link_btn = (function($){
'use strict';
var _link_sideload = false; //used to track whether or not the link dialogue actually existed on this page, ie was wp_editor invoked.

/* PRIVATE METHODS
-------------------------------------------------------------- */
//add event listeners

function _init() {
    $('body').on('click', '.lm-link-button', function(event) {
        _addLinkListeners();
        _link_sideload = false;

        var link_val_container = $('#your_input_field');

        if ( typeof wpActiveEditor != 'undefined') {
            wpLink.open();
            wpLink.textarea = $(link_val_container);
        } else {
            window.wpActiveEditor = true;
            _link_sideload = true;
            wpLink.open();
            wpLink.textarea = $(link_val_container);
        }
        return false;
    });

}

/* LINK EDITOR EVENT HACKS
-------------------------------------------------------------- */
function _addLinkListeners() {
    $('body').on('click', '#wp-link-submit', function(event) {
        var linkAtts = wpLink.getAttrs();
        var link_val_container = $('#your_input_field');
        link_val_container.val(linkAtts.href);
        _removeLinkListeners();
        return false;
    });

    $('body').on('click', '#wp-link-cancel', function(event) {
        _removeLinkListeners();
        return false;
    });
}

function _removeLinkListeners() {
    if(_link_sideload){
        if ( typeof wpActiveEditor != 'undefined') {
            wpActiveEditor = undefined;
        }
    }

    wpLink.close();
    wpLink.textarea = $('html');//focus on document

    $('body').off('click', '#wp-link-submit');
    $('body').off('click', '#wp-link-cancel');
}

/* PUBLIC ACCESSOR METHODS
-------------------------------------------------------------- */
return {
    init:       _init,
};

})(jQuery);


// Initialise
jQuery(document).ready(function($){
 'use strict';
 link_btn.init();
});

4 // enqueue script. Aggiungi quanto segue al tuo file Functions.php e regola i nomi / percorsi dei file per adattarli.

function linkbtn_enqueue() {
    //register script
    wp_register_script('link_btn',get_template_directory_uri() . '/js/link_btn.js', array('jquery'), '1.0', true);
    //now load it
    wp_enqueue_script( 'link_btn');
}

 add_action( 'admin_enqueue_scripts', 'linkbtn_enqueue' );

Dovrebbe farlo. Uso lo stesso approccio nella mia classe metabox e sembra funzionare bene.

RE: "Come lo faresti? (Approssimativamente?)"

In primo luogo, lo costruirò in modo simile alla funzionalità di collegamento in WordPress: un campo di testo di input, risultati, selezionare funzionalità e pulsante di invio (aggiungi collegamento).

Ajax: questo si attiva quando si immette del testo nell'input, restituendo una serie di risultati in base al termine di ricerca. Dai un'occhiata a ciò che abbiamo fatto con il nostro plugin di ricerca rapida , WP Jarvis. Devi solo impostare la chiamata ajax per indirizzare ajaxurl (admin-ajax.php) e impostare un hook di azione nel tuo php per eseguire la query ed eseguire l'eco dei risultati in formato json. Vorresti che i risultati includessero titolo, post-tipo e permalink per ogni risultato. Maggiori informazioni su ajax nei plugin .

Infine, selezionando il risultato che ti interessa prenderebbe il permalink dall'oggetto json e lo inseriresti nel campo del widget.

So che questa non è una risposta completa, ma spero che questo aiuti.