로그인

검색

Extra Form

Font Awesome fortyTwofa42Main.png


ckeditor Plugins fa42 적용 방법입니다. 

fa42 는 Font-awesome 최신버전인 6.4.0 을 적용할 수 있습니다. 

Font-awesome 의 버전이 어떤 의미가 있는지 모르지만 최신 경향이 반영된 아이콘이 추가되었거나 그런정도의 차이가 있을 듯 합니다. 

 

 라이믹스에서 Ckeditor 4 버전으로 편집기를 사용하여 Font-awesome 아이콘을 추가할 수 있도록 설정하도록 하겠습니다. 

 

 다운로드

   - Ckeditor 4 배포처에서 받기  바로가기

   - 개발자 사이트에서 받기  바로가기

 

 의존하는 다른 플러그인 

   - fa42 는 colordialog 플러그인을 필요로 합니다. 

 

 설치경로

  • ckeditor/plugins/fa42

 환경설정

4.1. config.js

config.extraPlugins = 'colordialog,fa42'; 


CKEDITOR.dtd.$removeEmpty['i'] = 1 또는 false; // <i> 태그를 사용하려는 경우, 라이믹스에서는 <i>사용시 기울임 꼴로 나타남
CKEDITOR.dtd.$removeEmpty['span'] = 1 또는 false; // <span> 태그를 사용하려는 경우 

 

4.2. CND을 이용하려는 경우 - /fa42/plugin.js

 

       var rootPath = CKEDITOR.plugins.get("fa42").path,
                defaultConfig = {
                    fa42Path: '//cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css',
                           // CDN 경로지정 
                    fa42Tag: 'span'    // span 태그를 사용하려는 경우 
                }

 

 

 웹사이트 헤더의 스타일시트에 아래 내용 적용

// 이렇게 font-awesome 을 적용시켜 줘야 게시판 글 보기 상태에서 적용된 내용이 보여집니다. 

<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
또는
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

 

 

 기타 참고사항, 아래는 배포처 설명임

config.fa42 = {
    fa42Version: '10.4.2',   // 사용 버전을 지정할 수 있지만 않하면 자동으로 최신버전이 적용된다는 소리인듯 
    fa42Level: 'free' // 'free' or 'pro' 이지만 지정하지 않으면 자동임 
}
 


  1. 26
    Mar 2024
    12:43

    Rhymix(XE)의 sketchbook5 방명록형 스킨 사용시 권한없는 사용자에게 "비밀글입니다." 숨기기

    Sketchbook5 방명록형 사용시 비밀글은 읽기 권한이 없는 사용자에게 노출될 필요가 없으므로 "비밀글입니다." 화면까지 완전히 보이지 않게 하여 깔끔한 게시판을 유지할 수 있도록 만드는 방법입니다. 위의 이미지에서 빨강 부분을 완전히 사라지게 합니다. ...
    Read More
  2. 23
    Mar 2024
    09:18

    Rhymix에 네이버 클로바 나눔손글씨 웹폰트 적용하기

    Rhymix와 Ckeditor 4.0 을 이용환경에서 네이버에서 제공하는 클로바 나눔손글씨를 적용하는 방법 https://hangeul.naver.com/font/clova 에 접속하여 원하는 글꼴을 선택 후 클릭 웹 폰트 URL 부분의 코드를 복사하여 레이아웃 "HTML/CSS 설정"에 넣어 줌 <li...
    Read More
  3. 29
    Feb 2024
    13:17

    PlannerXE123 게시판 스킨에서 회원만 글쓰기 가능 설정

    PlannerXE123 게시판 스킨(일정 달력)에서 글쓰기 권한이 없는 사람에게도 달력의 날짜(일정 등록)가 링크되어 권한이 없다고 나타나서 무엇인가 지저분한 느낌이 들었다. 글쓰기 권한이 없는 사람에게 달력을 보여주기는 하지만 마우스 hover 시 클릭이 되지 ...
    Read More
  4. 10
    Dec 2023
    00:49

    Rhymix(XE) 보드스킨 sketchbook5 에서 카테고리 영역의 배경 지

    sketchbook5 > css > board.css 또는 black.css 수정 .bd_cnb .bg_f_f9 { background: transparent; background-image: url(이미지URL); background-size: cover; border-color: transparent; }
    Read More
  5. 18
    Nov 2023
    11:24

    rhymix (XE) - ckeditor에 Google Fonts 넣는 방법

    Google Fonts - Hi Melody 넣기 구글폰트에서 제공하는 예쁜 한글 글꼴 Hi Melody를 Rhymix 홈페이지에 넣어 보도록 하겠습니다. Rhymix 웹편집기 ckeditor와 조합하여 언제든 게시글에 예쁜 구글폰트를 넣을 수 있습니다. 1. 구글폰트를 검색해서 원하는 폰트...
    Read More
  6. 15
    Nov 2023
    15:59

    CKEditor 입력영역 배경색

    Rhymix의 기본 웹편집기인 Ckeditor 사용시 툴바영역의 기본 배경색을 지정하는 부분임(실제로 반응 없음, 다른 방법을 찾아 보세요.) 파일명 rhmix/modules/editor/tpl/js/aditor.app.js allowedContent: true, removePlugins: 'stylescombo,language,bidi,fl...
    Read More
  7. 08
    Jul 2023
    09:33

    Plugins / Font Awesome fortyTwo(fa42)

    Font Awesome fortyTwo ckeditor Plugins fa42 적용 방법입니다. fa42 는 Font-awesome 최신버전인 6.4.0 을 적용할 수 있습니다. Font-awesome 의 버전이 어떤 의미가 있는지 모르지만 최신 경향이 반영된 아이콘이 추가되었거나 그런정도의 차이가 있을 듯 ...
    Read More
  8. 06
    Jul 2023
    00:55

    elfinder Cloud Thumbnail Setting - 엘파인더에서 실제파일과 다른위치에 썸네일 만들기

    elfinder Cloud Thumbnail Setting 엘파인터에서 클라우드와 같이 썸네일을 표시할 수 없는 다른위치에 있는 파일의 썸네일을 표현하는 방법 서버에서 실제파일의 위치는 /Documents 에 있고, 웹서비스 루트는 /publichtml 인경우 elfinder 의 기본 설정 conne...
    Read More
  9. 10
    Nov 2022
    22:22

    elfinder Thumbnail Size

    elFinder 웹 파일 관리자에서 썸네일 크기를 변경하기 1. 썸네일 기본 크기 48 원하는 크기로 설정 ./php/elFinderVolumeDriver.class.php 파일에서 tmbSize 부분을 찾아서 초기값 48 을 찾아 원하는 값으로 설정함. (모든 48 을 변경해야 함) ※ 너무 크면 페...
    Read More
  10. 03
    Nov 2022
    12:56

    XE 매뉴얼

    XE 개발자 매뉴얼 v1.1 XE 스킨제작 매뉴얼 v1.1
    Read More
Board Pagination Prev 1 2 3 4 Next
/ 4