WordPress 위젯에 "링크 추가"팝업을 사용하는 방법


12

WordPress의 WYSIWYG 편집기에서 텍스트 링크를 추가하려는 경우 팝업이 나타납니다. 이 기능에 액세스 할 수 있습니까? 백엔드에서 구성하면 위젯에 링크를 추가 할 수 있도록 내가 만든 WordPress 위젯에이 팝업을 사용하고 싶습니다.

다음은 내가 의미하는 바의 스크린 샷입니다. 여기에 이미지 설명을 입력하십시오

답변:


8

나는 조금 노력했지만 이것이 완벽하게 작동하지는 못했지만 가까운 거리에서 하드 <form>코딩 된 팝업 스타일을 위해 확장하기가 어렵고 더 많은 작업으로 가능하다고 생각했습니다.

시작하려면 다음을 수행하십시오.

링크 팝업 자바 스크립트 및 스타일을 큐에 넣습니다 wp-includes/wplink.js. 기본 .js 파일은 입니다. 이것을로드하는 위치에 따라 여러 가지 ( thickbox, jQuery-ui, ui-dialog 등 )에 의존하기 때문에 더 많거나 적은 스크립트 / 스타일을 추가해야 할 수도 있습니다 .

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');

번역 가능한 변수를 설정하십시오.

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

지금 당신은 해야 확장 할 수 wpLink같은 것을 사용 기능 :

// 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;
});

<form>defualt로 오랫동안 붙여 넣을 수있는 팝업 요소 가 필요합니다 .defualt를 여기에서 볼 수 있습니다 : https://gist.github.com/wycks/6402573

이제이 가진 중요한 문제, 즉 내가 같은 함수에 어떤 폐쇄 또는 제출 (또는 검사) 자바 스크립트를 추가하지 않은 있습니다 wpLink.close또는 wpLink.textarea그렇게 참조, wplink.js자세한 정보를 원하시면.

죄송합니다. 기본 사항이 누락되지 않은 한 오랫동안 바이올린을 사용하는 데 시간이 오래 걸리지 만 대부분의 방법을 사용해야합니다.


당신의 도움을 주셔서 대단히 감사합니다. <?를 사용하여 스타일 / 스크립트 참조를 해결했습니다. wp_editor ( '', ''); ?>-아마도 더 짧은 해결책을 얻을 수 있습니다! 그러나 선택된 링크를받는 방법에 대해서는 여전히 의문이 있습니다.
Benny Neugebauer

이것을 게시 해 주셔서 감사합니다. 필요한 답변을 찾게되었습니다. 제 경우에는 "wpdialogs"스크립트를 명시 적으로 큐에 넣어야했습니다.이 스크립트는 종속성으로 지정되었을 때 작동하지 않았습니다. wp_enqueue_script('wpdialogs');
Inigoesdr
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.