[javascript] TinyMCE에서 텍스트 에디터에 찾기 및 바꾸기 기능을 추가하는 방법은?

TinyMCE는 강력한 오픈소스 WYSIWYG 텍스트 에디터입니다. 이 툴을 사용하는 경우 텍스트 에디터에 추가 기능을 구현하는 것이 매우 쉽습니다. 여기에서는 TinyMCE에 텍스트 찾기 및 바꾸기 기능을 추가하는 방법을 안내하겠습니다.

  1. TinyMCE 라이브러리 로드하기:
    <script src="path/to/tinymce.min.js"></script>
    
  2. 텍스트 에디터 초기화하기:
    tinymce.init({
      selector: 'textarea',
      plugins: [
        'searchreplace'  // 탐색 및 교체 플러그인 추가
      ],
      toolbar: 'searchreplace', // 툴바에 검색 및 교체 아이콘 표시
      menubar: false // 메뉴바 비활성화 (선택 사항)
    });
    
  3. 텍스트 에디터 화면에서 찾기 및 바꾸기 사용하기: 위의 코드를 사용하면 텍스트 찾기 및 바꾸기 기능이 활성화됩니다. 텍스트 에디터의 툴바에 있는 검색 아이콘을 클릭하면 찾기 대화상자가 표시됩니다. 검색할 단어를 입력하고 “다음” 또는 “이전” 버튼을 클릭하여 해당 단어를 찾을 수 있습니다. 또한 “바꾸기” 탭을 사용하여 검색한 단어를 다른 단어로 바꿀 수도 있습니다.

이렇게 TinyMCE에 텍스트 찾기 및 바꾸기 기능을 추가할 수 있습니다. 자세한 내용은 TinyMCE 공식 문서를 참조하세요.