스마트에디터 글꼴추가
본문
안녕하세요,, 여기서 방법을 찾아 에디터 글꼴목록에 추가하는것까지는 성공했는데
글꼴이 바뀌진 않더라구요,, 제가 잘못한 것이 있는지 한 번 봐주시면 감사하겠습니다..
제가 추가하고 싶은 글꼴은 'G마켓 산스' 입니다.
1. plugin/editor/smarteditor2/config.js 변경
(function($){
$(document).ready(function() {
$(".smarteditor2").each( function(index){
var get_id = $(this).attr("id");
if( !get_id || $(this).prop("nodeName") != 'TEXTAREA' ) return true;
var aAdditionalFontSet = [['GmarketSansBold','G마켓 산스 Bold'], ['GmarketSansMedium','G마켓 산스 Medium'], ['GmarketSansLight','G마켓 산스 Light']];
nhn.husky.EZCreator.createInIFrame({
oAppRef: oEditors,
elPlaceHolder: get_id,
sSkinURI: g5_editor_url+"/SmartEditor2Skin.html",
htParams : {
bUseToolbar : true, // 툴바 사용 여부 (true:사용/ false:사용하지 않음)
bUseVerticalResizer : true, // 입력창 크기 조절바 사용 여부 (true:사용/ false:사용하지 않음)
bUseModeChanger : true, // 모드 탭(Editor | HTML | TEXT) 사용 여부 (true:사용/ false:사용하지 않음)
bSkipXssFilter : true, // client-side xss filter 무시 여부 (true:사용하지 않음 / 그외:사용)
aAdditionalFontList : aAdditionalFontSet, // 추가 글꼴 목록
fOnBeforeUnload : function(){
//alert("완료!");
}
}, //boolean
fOnAppLoad : function(){
//예제 코드
//oEditors.getById["ir1"].exec("PASTE_HTML", ["로딩이 완료된 후에 본문에 삽입되는 text입니다."]);
},
fCreator: "createSEditor2"
});
});
});
})(jQuery);
2. plugin/editor/smarteditor2/SmartEditor2Skin.html에 글꼴 추가
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ko">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>네이버 :: Smart Editor 2 ™</title>
<link href="css/ko_KR/smart_editor2.css" rel="stylesheet" type="text/css">
<style type="text/css">
body { margin: 10px; }
</style>
<script type="text/javascript" src="./js/lib/jindo2.all.js" charset="utf-8"></script>
<script type="text/javascript" src="./js/lib/jindo_component.js" charset="utf-8"></script>
<script type="text/javascript" src="./js/service/SE2M_Configuration.js" charset="utf-8"></script> <!-- 설정 파일 -->
<script type="text/javascript" src="./js/service/SE2BasicCreator.js" charset="utf-8"></script>
<script type="text/javascript" src="./js/smarteditor2.min.js" charset="utf-8"></script>
<!-- 사진첨부샘플 -->
<script type="text/javascript" src="photo_uploader/plugin/hp_SE2M_AttachQuickPhoto.js?v3" charset="utf-8"></script>
</head>
<body>
<span id="rev" style="display:none">Version: 2.9.0.4a256db </span>
<!-- SE2 Markup Start -->
<div id="smart_editor2">
<div id="smart_editor2_content"><a href="#se2_iframe" class="blind">글쓰기영역으로 바로가기</a>
<div class="se2_tool" id="se2_tool">
<div class="se2_text_tool husky_seditor_text_tool">
<ul class="se2_font_type">
<li class="husky_seditor_ui_fontName"><button type="button" class="se2_font_family" title="글꼴"><span class="husky_se2m_current_fontName">글꼴</span></button>
<!-- 글꼴 레이어 -->
<div class="se2_layer husky_se_fontName_layer">
<div class="se2_in_layer">
<ul class="se2_l_font_fam">
<li style="display:none"><button type="button"><span>@DisplayName@<span>(</span><em style="font-family:FontFamily;">@SampleText@</em><span>)</span></span></button></li>
<li class="se2_division husky_seditor_font_separator"></li>
<li><button type="button"><span>G마켓 산스 Bold<span>(</span><em style="font-family:'G마켓 산스 Bold',GmarketSansBold;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>G마켓 산스 Medium<span>(</span><em style="font-family:'G마켓 산스 Medium',GmarketSansMedium;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>G마켓 산스 Light<span>(</span><em style="font-family:'G마켓 산스 Light',GmarketSansLight;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>나눔고딕<span>(</span><em style="font-family:'나눔고딕',NanumGothic;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>나눔명조<span>(</span><em style="font-family:'나눔명조',NanumMyeongjo;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>나눔고딕코딩<span>(</span><em style="font-family:'나눔고딕코딩',NanumGothicCoding;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>나눔바른고딕<span>(</span><em style="font-family:'나눔바른고딕',NanumBarunGothic,NanumBarunGothicOTF;">가나다라</em><span>)</span></span></button></li>
<li><button type="button"><span>나눔바른펜<span>(</span><em style="font-family:'나눔바른펜',NanumBarunpen;">가나다라</em><span>)</span></span></button></li>
</ul>
</div>
</div>
<!-- //글꼴 레이어 -->
</li>
3. plugin/editor/smarteditor2/css/ko_KR/smart_editor2.css 최상단에 @font-face 추가, 사용 테마 css에 @font-face 추가
보시는 것처럼 목록에는 뜨지만 글꼴 적용은 전혀 되지 않고 있어요
도움 부탁드립니다 ㅠㅠ
답변 2
1) /plugin/editor/smarteditor2/css/ko_KR/smart_editor2_in.css 최상단에도 font-face 추가 (에디터 내부용)
2) /plugin/editor/smarteditor2/js/smarteditor2.min.js
smart_editor2_in.css
->
smart_editor2_in.css?v=1
3) /plugin/editor/smarteditor2/SmartEditor2Skin.html
smarteditor2.min.js
->
smarteditor2.min.js?v=1
4) /plugin/editor/smarteditor2/config.js
SmartEditor2Skin.html
->
SmartEditor2Skin.html?v=1
5) /theme/basic/css/default.css 에도 font-face 추가 (게시글용)
6???) /plugin/editor/smarteditor2/editor.lib.php
config.js
-> config.js?v=1
와..드디어 됐어요 ㅠㅠㅠㅠㅠㅠ
네이버 개발자센터에도 올려보고 근 이틀을 해도 안됐는데 ㅠㅠㅠㅠ
천재신가요 ㅠㅠㅠㅠㅠㅠ 정말 감사합니다!!
캐시 문제일 가능성이 있습니다.
* /plugin/editor/smarteditor2/SmartEditor2Skin.html
<link href="css/ko_KR/smart_editor2.css"
->
<link href="css/ko_KR/smart_editor2.css?v=0824"
감사합니다 ㅠ 링크 수정해보았지만 해결되지 않네요..
차라리 목록에도 뜨지 말지 목록에 뜨는 것 보면 폰트는 있는것 같은데 정작 에디터에 적용이 안되니 환장하겠네요..
답변 정말 감사합니다!
