it-swarm.com.de

Wie man das Popup "Link hinzufügen" für ein WordPress-Widget verwendet

Im WYSIWYG-Editor von WordPress erhalten Sie ein Popup, wenn Sie einen Link für einen Text hinzufügen möchten. Gibt es eine Möglichkeit, auf diese Funktionalität zuzugreifen? Weil ich dieses Popup für ein WordPress-Widget verwenden möchte, das ich erstellt habe, damit Sie Links zu einem Widget hinzufügen können, wenn Sie es im Backend konfigurieren.

Hier ist ein Screenshot von dem, was ich meine: enter image description here

12

Ich habe es ein bisschen versucht und konnte es nicht perfekt machen, aber es ist nah, es ist schwierig, den <form> für die hartcodierten Popup-Stile zu erweitern, was mit mehr Arbeit für möglich gehalten wird.

Um loszulegen, können Sie:

Aktivieren Sie das Link-Popup-Javascript und die Stile. Die Haupt-JS-Datei ist wp-includes/wplink.js. Abhängig davon, wo Sie dies laden, müssen Sie möglicherweise mehr oder weniger Skripte/Stile hinzufügen, da mehrere verwendet werden ( Thickbox, jQuery-UI, UI-Dialog usw. ).

wp_enqueue_script('wplink');
wp_enqueue_script('wpdialogs-popup'); //also might need this

// need these styles
wp_enqueue_style('wp-jquery-ui-dialog');
wp_enqueue_style('thickbox');

Setzen Sie die übersetzbare Variable:

var wpLinkL10n = {"title":"Insert\/edit link","update":"Update","save":"Add Link","noTitle":"(no title)","noMatchesFound":"No matches found."};

Jetzt solltest duin der Lage sein, die Funktion wpLink mit etwas zu erweitern:

// test button
<button class="link-btn">Click button for Links</button>

jQuery('.link-btn').on('click', function(event) {
  wpActiveEditor = true;
  wpLink.title = "Hello"; //Custom title example
  wpLink.open();    // Open the link popup
  return false;
});

Sie benötigen ein <form> -Element für das Popup, das hier standardmäßig viel zu lang ist. Das defualt -Element finden Sie hier: https://Gist.github.com/wycks/6402573

Jetzt gibt es große Probleme damit, nämlich, dass ich der Funktion kein Schließen oder Senden (oder Überprüfen) von Javascript hinzugefügt habe, wie z. B. wpLink.close oder wpLink.textarea. Weitere Informationen finden Sie unter wplink.js.

Tut mir leid, das dauert einfach zu lange, bis ich etwas Grundlegendes vermisse, aber das sollte dir den größten Nutzen bringen.

8
Wyck