집 비교 문맹 퇴치 비주얼 편집기 CKEditor 설치. CKEdit 설정 또는 Ckeditor 패널 설치에서 추가 아이콘을 제거하는 방법

비주얼 편집기 CKEditor 설치. CKEdit 설정 또는 Ckeditor 패널 설치에서 추가 아이콘을 제거하는 방법

Drupal 7은 여섯 번째 버전과 마찬가지로 비주얼 편집기가 내장되어 있지 않습니다.

사용자 가이드: Drupal 7에서 ckeditor를 설치 및 구성하는 방법. Elfinder에서 이미지를 다운로드합니다.

Drupal 7에서는 여섯 번째 버전과 마찬가지로 편집기를 설치해야 합니다. 물론 이렇게 코드만 보고 글을 쓸 수는 없습니다. 하지만 저는 비주얼 에디터를 좋아합니다. 2과에서 Drupal 6의 설치 및 구성을 공부했음을 상기시켜 드리겠습니다.

오늘 우리는 편집기와 함께 작동하는 cms 번들을 살펴볼 것입니다.
드루팔 7.17
CKEditor - WYSIWYG HTML 편집기 7.x-1.11
씨케이 에디터 4.0
elFinder 파일 관리자 7.x-0.7
스크립트 elFinder - elfinder-1.2

Drupal 버전 7의 경우 전체 설치 및 구성 프로세스가 훨씬 간단합니다. 파일에서 아무 것도 편집할 필요가 없으며 모든 작업은 관리자 패널에서 사용할 수 있습니다(상자만 선택). 기존의 현재 버전모듈은 우리의 삶을 훨씬 더 쉽게 만듭니다.

편집기로 작업할 때 발생하는 문제

CKeditor는 모든 버튼을 표시하지 않습니다

이렇게 하려면 https://ckeditor.com/download에서 다운로드한 버전을 확인하십시오.

기본 패키지에는 몇 개의 버튼이 있습니다.
표준 패키지 - 더 많이 있습니다.
전체 세트는 전체 패키지에 있습니다. 최대값을 사용하려면 다운로드하세요.

Drupal 7용 Elfinder 파일 관리자 설치 및 구성

많은 편집기와 파일 관리자가 작업을 가장 즐겁게 만듭니다. 서버나 컴퓨터의 어느 곳에서나 이미지를 삽입할 수 있습니다. 필요한 속성, 대체 설명을 할당하십시오. 안타깝게도 설치해야 합니다.
CKEditor 파일 관리자는 사진뿐만 아니라 다른 파일도 로드합니다.
편집기와 마찬가지로 모듈과 스크립트를 다운로드해야 합니다.

모듈 다운로드 ]]> https://drupal.org/project/elfinder ]]>

아카이브 압축을 풀고 파일을 site/all/modules/elfinder 폴더에 넣습니다.

스크립트 다운로드 ]]> ]]>

에서 최신 버전접근 엘파인더-1.2.
그런 다음 아카이브의 압축을 풀고 파일을 site/all/libraries/elfinder 폴더에 넣습니다.
여기에 작은 기능이 있습니다. 폴더는 elfinder라고 해야 합니다.

설정. 이를 위해 우리는 간다 관리자/구성/엘파인더 - "구성 - 모듈 - elFinder - 구성".

"루트 디렉토리"에서 "시스템 기본값 사용"에 대한 선택을 그대로 둡니다. Drupal의 기본값입니다.

기본 설정 admin/config/media/file-system:

콘텐츠 페이지 - 관리자/콘텐츠에서 볼 수 있습니다. 새로운 탭"파일". 이제 그것을 클릭하면 파일 관리자 인터페이스가 표시됩니다.

마지막 단계는 편집기를 다음과 결합하는 것입니다. 파일 관리자하나의 기능적 도구로
위에서 이미 편집기 프로필 설정에 대해 설명했습니다.

다시 한번 말한다:
에서 선택 파일 브라우저 유형 - elFinder . 원하는 경우 여기에서 파일 다운로드 폴더를 변경할 수도 있습니다.

이제 모든 것이 작동해야 하지만 이것이 Drupal 코어에 없는 이유를 이해할 수 없습니다. 대신 모든 취향에 맞는 여러 편집기 옵션이 있습니다. 어느 것이 너무 좋습니다. ;)

새로운 작업 링크

드루팔 7.21
CKEditor - WYSIWYG HTML 편집기 7.x 1.13
CKEditor - ckeditor_4.1_standard
elFinder 파일 관리자 7.x-0.8
elFinder 스크립트 - elfinder-1.2

편집할 때마다 새 보이드()를 추가하는 데 결함이 있습니다.

Drupal 티저를 삽입할 때 글리치가 나타나는 것으로 밝혀졌습니다. 기사가 발표를 분리하지 않으면 결함이 없습니다.

그 이유는 기본적으로 공지 사항 크기가 콘텐츠 유형에 이미 설정되어 있기 때문입니다. 그것은 밝혀 알림 칸 이중 사용: 수동 및 자동.

광고 표시 설정 경로:

홈 » 관리 » 구조 » 콘텐츠 유형 » 기사 » 디스플레이 관리

조언. 설정해야 합니다 모습두 프로필의 비주얼 편집기에서 Teaser-drupal 버튼을 제거하십시오.

drupal 학습을 위한 기사:

초보자를 위한 일반 개념.

Drupal과 그 모듈을 Russify하는 방법.

블로그 모듈 선택.

빠른 가이드.

내 사이트에서 BUEditor를 사용했습니다. 간단하고 편리한 편집기이지만 사용자에게는 그다지 편리하지 않습니다. CKEditor 설치에 대해 종종 생각했지만 일종의 괴물처럼 보였지만 실제로는 모든 것이 그렇게 무섭지 않은 것으로 나타났습니다.

모듈 설치 방법 읽기.

모듈을 통해 연결한 후 탭의 admin/config/content/ckeditor/edit/profile_recognition 페이지에서 편집자의 모습, 장에서 플러그인활성화 확인란이 나타납니다. 켜고, 저장하고, 확인하십시오.

3. 링크를 삽입합니다.기본적으로 링크 삽입 대화 상자에는 불필요하고 이해할 수 없는 많은 것들이 포함되어 있습니다. Simple link 플러그인으로 교체합니다. 설치 방법은 단락 2를 참조하십시오. 우리는 연결합니다(항목 1 참조):

Config.extraPlugins = "SimpleLink";

플러그인의 새 아이콘(버튼)도 나타납니다.

4. 이미지를 삽입합니다.여기 모든 것이 링크와 동일합니다. Simple Image 플러그인을 넣어 링크로 이미지를 삽입할 수 있습니다.

Config.extraPlugins = "SimpleImage";

또는 원 클릭 업로드 모듈을 사용하여 이미지를 업로드하십시오. . 더 읽어보세요. BUEditor에서 둘 다 사용했지만 두 번째 방법으로 정착했습니다.

내가 추가하고 싶은 유일한 것은 Enhanced Image 플러그인에 Widget 및 Lineutils 플러그인이 두 개 더 필요하다는 것입니다.

로그를 볼 때까지 플러그인이 시작되지 않은 이유를 알 수 없었습니다.

5. 외모.기본적으로 Moono 스킨이 사용되지만, BUEditor의 모습으로 그 모습을 담고 싶었습니다.

BUEditor는 이렇게 생겼습니다.

7. 자리 표시자.자리 표시자를 추가하려면 플러그인을 설치합니다(2단계 참조) 구성 도우미 . 우리는 연결합니다(항목 1 참조):

Config.extraPlugins = "구성 도우미"; config.placeholder = "(!LANG:텍스트"; // текст нашего placeholder !}

8. 이모티콘.인서트 스마일리 플러그인은 CKEditor "e에서 스마일을 담당하며 표준 패키지인 풀 패키지에 포함되어 있습니다.

이모티콘은 다음과 같이 표시됩니다.

자신의 것으로 바꾸려면 구성에서 이미지가 있는 폴더의 경로를 지정해야 합니다(1단계 참조) smiley_path :

Config.smiley_path = "/사이트/기본/파일/스마일/";

Smiley_images 에 표시될 파일(이미지)의 이름을 작성하십시오.

config.smiley_images = ["스마일_1.png","스마일_2.png"];

및 설명(마우스를 가리키면 설명) smiley_descriptions

config.smiley_descriptions = ["설명-1", "설명-2"];

이모티콘을 표시할 열 수를 지정할 수도 있습니다(기본값: 8) smiley_columns

config.smiley_columns = 6;

그게 내가 한 일이야

9. 맞춤법 검사 브라우저.쓰여진대로 욱수소FF브라우저 기반 맞춤법 검사는 CKEditor에서 비활성화됩니다.

Config.disableNativeSpellChecker = 거짓;

10. 상황에 맞는 메뉴. CKEditor에서 RMB를 누르면 열립니다. 컨텍스트 메뉴, 브라우저의 기본 메뉴가 아닙니다.

이 기사에서는 사이트에 비주얼 편집기를 설치하는 방법을 보여줍니다. 이러한 편집기는 사이트에 대한 새 정보를 추가 및/또는 편집할 때 매우 편리합니다. 예를 들어, 포럼에 설치, 주석이 있는 블록에 설치하면 새 주석의 텍스트 편집 가능성을 촉진하고 확장할 수 있습니다. 텍스트를 강조 표시하고, 밑줄을 긋고, 링크를 삽입하는 등의 작업을 수행할 수 있습니다. 이 모든 것은 독자에게 얼마나 많은 액세스 권한을 부여하는지에 따라 다릅니다. 그리고 물론 잊지 말아야 할 것은 관리 부분으로, 자료를 추가하고 편집할 때 작업을 크게 용이하게 할 수 있습니다.

두 명의 비주얼 에디터와 함께 작업했습니다. 타이님체그리고 씨케이 에디터솔직히 이 두 에디터는 꽤 유명하지만, 씨케이 에디터나는 그것을 더 좋아했다, 아니 오히려 내 작업에 더 적합했습니다. 따라서 여기에서는 편집기를 설치하는 방법을 고려할 것입니다. 씨케이 에디터그리고 다시 말씀드리겠습니다.

시작하려면 항상 그렇듯이 편집기를 다운로드해야 합니다. 가득한- 패키지 또는 공식 웹 사이트에서 필요한 모든 패키지를 선택하십시오.

다운로드가 완료되면 다운로드한 아카이브의 압축을 풉니다(예: 폴더에 도서관사이트의 루트에 있습니다. 에 index.html 태그 사이 편집기 플러그인 추가 ckeditor.js 그리고 물론 도서관 제이쿼리.

HTML

따라서 테스트 필드가 있는 양식을 만드는 것이 남아 있습니다. , 편집자가 상호 작용할 것입니다.

HTML

일반적으로 페이지를 로드한 후 지정된 텍스트 필드에 설치에 관한 모든 것 이제 텍스트 편집기가 나타납니다. 이 편집기는 사용자의 취향에 맞게 사용자 정의할 수 있으며, 편집기 프레임이나 언어의 배경을 변경하고, 창의 너비와 높이를 설정할 수 있습니다. 파일은 이를 위해 사용됩니다. config.js 폴더에 있는 라이브러리/ckeditor/config.js . 이 파일에서 위에 나열된 설정 및 기타 여러 설정을 지정할 수 있습니다. 자세한 내용은 공식 웹사이트에서.

예를 들어 파일을 변경하여 config.js 아래에 표시된 대로 편집기의 언어, 테두리 색상 및 높이를 변경합니다.

자바스크립트

CKEDITOR.editorConfig = function(config) ( config.language = "en"; //언어 config.uiColor = "#AADC6E"; //프레임 색상 config.height = 300; //프레임 높이);

설정에서 설정하여 편집기의 모양을 변경할 수도 있습니다. config.toolbar기본- 최소 또는 가득한- 최대 편집기 기능. 또는 설정을 사용하여 편집기를 개별적으로 사용자 정의합니다. config.toolbar_기본아래 예와 같이.

최소 구성을 선택하면 편집기의 기능이 제한되고 버튼만 사용할 수 있습니다. 굵은 텍스트 설정 기울임꼴, 나열, 링크 생성 링크 삭제 및 이모티콘(아래 예 참조).

자바스크립트

CKEDITOR.editorConfig = function(config) ( config.width = 1050; //에디터 창의 너비 config.toolbar = "Basic"; //에디터 기능, 기본-최소, 전체-최대 config.toolbar_Basic = //개별 설정 기본 모드 [ ["굵게", "기울임꼴", "-", "번호 목록", "불릿 목록", "-", "링크", "연결 해제","-","스마일리"] ]; );

버튼을 그룹으로 그룹화하는 것이 가능하며 다시 파일이 필요합니다. config.js .

자바스크립트

CKEDITOR.editorConfig = function(config) ( config.toolbarGroups = [ ( name: "document", groups: [ "mode", "document", "doctools" ] ), ( name: "clipboard", groups: [ "clipboard" ", "실행 취소" ] ), ( 이름: "편집", 그룹: [ "찾기", "선택", "맞춤법 검사기", "편집" ] ), ( 이름: "양식", 그룹: [ "양식" ] ), "/", ( name: "basicstyles", groups: [ "basicstyles", "cleanup" ] ), ( name: "paragraph", groups: [ "list", "indent", "blocks", "align ", "bidi", "paragraph" ] ), ( name: "links", groups: [ "links" ] ), ( name: "insert", groups: [ "insert" ] ), "/", ( name : "스타일", 그룹: [ "스타일" ] ), ( 이름: "색상", 그룹: [ "색상" ] ), ( 이름: "도구", 그룹: [ "도구" ] ), ( 이름: " other", 그룹: [ "others" ] ), ( name: "about", 그룹: [ "about" ] ) ]; );

일반적으로 기본 설정은 텍스트 에디터표시됨, 내가 마음에 들지 않는 한 가지는 이 편집기의 크기입니다. 다운로드 후 무게가 4m 265kb그건 좀 너무합니다. 그것이 당신을 귀찮게한다면, 당신은 디렉토리를 삭제할 수 있습니다 샘플 또한 가장 무게가 나가기 때문에 언어로 카탈로그를 정리하십시오. 사용되지 않는 언어가 많이 있으므로 러시아어와 영어와 같이 필요한 언어만 제거하고 필요한 것만 남겨 둘 수 있습니다.

카탈로그로 이동 libs/ckeditor/lang 여기에서 필요한 언어를 제외한 모든 파일을 삭제합니다. 예를 들어 다음과 같이 둡니다. en.js 그리고 en.js . 모든 조작이 끝나면 크기가 절반으로 줄어들고 디렉토리는 ckeditor다음과 같이 보일 것입니다:

이것에 대해이 편집기의 다른 미묘함을 아는 모든 사람이 의견을 작성합니다.

단지에 대해. 프로그램들. 철. 인터넷. 창

비주얼 편집기 CKEditor 설치. CKEdit 설정 또는 Ckeditor 패널 설치에서 추가 아이콘을 제거하는 방법

사용자 가이드: Drupal 7에서 ckeditor를 설치 및 구성하는 방법. Elfinder에서 이미지를 다운로드합니다.

최신 CMS Drupal 7.17에 WYSIWYG 편집기 CKEditor를 설치하는 방법

CKEditor 프로필 사용자 지정

편집기로 작업할 때 발생하는 문제

CKeditor는 모든 버튼을 표시하지 않습니다

Drupal 7용 Elfinder 파일 관리자 설치 및 구성

편집할 때마다 새 보이드()를 추가하는 데 결함이 있습니다.