2013-06-16 5 views
-2

내 웹 사이트에 WYSIWYG 편집기를 신속하게 추가하고 싶습니다. 나는 wordpress, drupal, 또는 joomla를 사용하지 않고있다. 나는 그것을 모두 손으로 코딩하여 웹 사이트를 만들고있다. WYSIWYG 편집기는 어떻게 구현합니까? 나는 이것을 다운로드 한 후에 이들 중 하나를 구현하는 쉬운 방법을 찾지 못하는 것 같다. 내가 반응 형 웹 사이트를 만들고 있기 때문에 특히 tinyMCE를 사용하고 싶습니다. 누군가가 이것을 구현하고 그것을 좋아하는대로 사용자 정의하는 방법에 대한 쉬운 지침을 줄 수 있습니까?내 웹 사이트에 WYSIWYG 편집기를 어떻게 구현합니까?

나는 이런 식으로 뭔가를 구현할 수 있도록하려면 :

http://www.tinymce.com/tryit/classic.php

+0

TinyMCE를 페이지에 추가하는 방법은 분명히 해당 웹 사이트에서 내려 졌으므로 downvoted했습니다. 지침을 따랐다면 코드를 보여주고 문제가 있다고 생각하는 곳을 찾아보십시오. (이것은 모든 질문에 대한 좋은 조언입니다.). 몇 분이면 FAQ를 읽어보십시오. 질문을하는 방법을 설명합니다. – halfer

+0

미안하지만 몇 시간 동안 노력했는데 웹 사이트의 지침은 나에게 매우 혼란 스러웠습니다. 나는 그것을 매우 유감스럽게 생각한다! 내가 용서를 구할 수 있을까? 나는 금지되고 싶지 않습니다. – Someguy

+0

이상한 downvote':)'에 대해서는 걱정하지 마십시오. downvotes 및/또는 마감 된 질문이 많은 경우 자동으로 여기에서 묻는 질문에 대해 자동으로 잠글 수 있지만 몇 가지 질문에 대답하여 평판을 얻음으로써 해결할 수 있습니다. 내가 말했듯이 FAQ를 읽으면 여기서 좋은 질문을하는 데 도움이 될 것입니다! 행운을 빌어 요. – halfer

답변

4

기본 지침 (http://www.tinymce.com/wiki.php/Installation)

을이 텍스트 영역을 대체 할 TinyMCE에를 얻기위한 최소한의 구성입니다.

<!-- Place inside the <head> of your HTML --> 
<script type="text/javascript" src="<your installation path>/tinymce/tinymce.min.js"></script> 
<script type="text/javascript"> 
tinymce.init({ 
    selector: "textarea" 
}); 
</script> 

<!-- Place this in the body of the page content --> 
<form method="post"> 
    <textarea></textarea> 
</form> 

그리고 당신이 게시 된 예를 들어 소스 :

<script type="text/javascript" src="<your installation path>/tinymce/tinymce.min.js"></script> 
<script type="text/javascript"> 
tinymce.init({ 
     selector: "textarea", 
     plugins: [ 
       "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak spellchecker", 
       "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking", 
       "table contextmenu directionality emoticons template textcolor paste fullpage textcolor" 
     ], 

     toolbar1: "newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect", 
     toolbar2: "cut copy paste | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor image media code | inserttime preview | forecolor backcolor", 
     toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | spellchecker | visualchars visualblocks nonbreaking template pagebreak restoredraft", 

     menubar: false, 
     toolbar_items_size: 'small', 

     style_formats: [ 
       {title: 'Bold text', inline: 'b'}, 
       {title: 'Red text', inline: 'span', styles: {color: '#ff0000'}}, 
       {title: 'Red header', block: 'h1', styles: {color: '#ff0000'}}, 
       {title: 'Example 1', inline: 'span', classes: 'example1'}, 
       {title: 'Example 2', inline: 'span', classes: 'example2'}, 
       {title: 'Table styles'}, 
       {title: 'Table row 1', selector: 'tr', classes: 'tablerow1'} 
     ], 

     templates: [ 
       {title: 'Test template 1', content: 'Test 1'}, 
       {title: 'Test template 2', content: 'Test 2'} 
     ] 
});</script> 

<form method="post" action="somepage"> 
    <textarea name="content" style="width:100%"></textarea> 
</form> 
+0

나는 이것을 시도하고 아무것도 바뀌지 않았다. 설치 경로에 대해서는 다른 모든 PHP 파일이있는 폴더에 tinyMCE 폴더 다운로드를 설치합니까? 그런 다음 경로를 현재 위치로 설정하십시오. – Someguy

+0

주 패키지를 다운로드하고 루트 웹 폴더에 압축 파일의 압축을 풀었 으면'src = "/ tinymce/js/tinymce/tinymce.min.js" – Alfie

+0

경로가 필요합니다. 현재 실제 서버에 없습니다. 나는 XAMPP와 htdocs를 사용하여 localhost에있다. htdocs에있는 모든 파일을 개인 웹 사이트라고하는 폴더가 있습니다. 개인 웹 사이트 폴더에 다운로드 한 폴더 tinymce를 넣었습니다. 내 경로는 현재 : 이고 여전히 작동하지 않습니다. – Someguy

0

내가 TinyMCE에의 웹 사이트를 검토 한 결과, 그리고 그들이 바로 자신의 첫 페이지에 빠른 설치 설명서를 넣어 한 것으로 보인다. 설치에 표시 할 단추는 문서 섹션에 필요한 정보가 있습니다. @ Alfie의 설명이 충분히 효과적입니다.

그리고 나는 이것을 충분히 강조 할 수 없습니다. 베어 본 설치를 원하지 않는다면 문서를 읽으십시오.

관련 문제