아미나, 나리야 syntaxhighlighter 테마 변경하기

Tip & Tech

활용팁

홈 > 회원포럼 > 활용팁
활용팁

아미나, 나리야 syntaxhighlighter 테마 변경하기

11 우성군 8 340 3 0

.note-editor.note-frame.codeview .note-editing-area .note-editable,
.note-editor.note-airframe.codeview .note-editing-area .note-editable {
display: none;
}
.note-editor.note-frame.codeview .note-editing-area .note-codable,
.note-editor.note-airframe.codeview .note-editing-area .note-codable {
display: block;
}


원래는 위와 같이 흰색 배경에 심심한 모양인데요.


저는 블랙 배경을 좋아해서



위와 같이 바꿨습니다.



1. 아미나에서 변경하기


/lib/apms.lib.php  3278번째 줄


add_stylesheet('<link rel="stylesheet" href="'.APMS_PLUGIN_URL.'/syntaxhighlighter/styles/shCoreDefault.css">', -1);


에서 shCoreDefault.css 를 바꿔주면 됩니다.




저는 shCoreEmacs.css 로 바꿨는데요. 나름 쓸만하네요.



그리고 변경한 CSS 가 좀 이상하게 보일 것인데요.


57번째 줄을


margin: 0 !important;


위와 같이 바꿔주면 됩니다.




2. 나리야에서 변경하기


/nariya/lib/core.lib.php 391번째 줄


add_stylesheet('<link rel="stylesheet" href="'.NA_URL.'/app/syntaxhighlighter/styles/shCoreDefault.css">', -1);


에서 shCoreDefault.css 를 다른 것으로 바꾸면 됩니다.



저는 shCoreEmacs.css 로 바꿨는데요. 나름 쓸만하네요.


바꾸면 글자 아래위 간격이 이상한데요.


해당 css 파일을 열어서


35번째 줄을


line-height: 1.4em !important;


로 바꾸고,


57번째 줄을


margin: 0 !important;


위와 같이 바꿔주면 디폴드 값과 똑같이 바뀝니다.




3. 꾸미기



위와 같이 검은색 배경을 좀더 넓게 잡고, 모서리 부분을 둥글게 적용하려면


대략 55번째 줄에 있는 


.syntaxhighlighter {
.
.
.
}


블럭 안에 


padding : 20px 0 !important;
border-radius:10px !important;


위와 같이 padding과 raius 속성을 추가해줍니다. 그러면 깔끔하고 답답하지 않게 나옵니다.




4. 마치며..



깃허브에 보니 3.0.90이 올라와서 적용해보았는데요.


CSS 파일이 SCSS 파일로 바뀌어서 당장 적용이 안되더라구요...


그누보드에서도 SCSS 파일을 막는거 같구요...


개인적으로 prismjs나 hljs로 바꾸는 것을 원하지만.. 다음 기회로 돌려야겠습니다.

8 Comments
25 선구자 07.19 21:26  
황금 팁입니다
11 우성군 07.19 22:49  
미세먼지팁입니다.

잘 사용하시기 바랍니다. ㅎㅎ
28 사과 07.19 23:20  
syntaxhighlighter 사용하다가 sir에 prismjs 적용되어있는거보고 따라서 해놓으니 나름 깔끔하게 좋더라구요.
11 우성군 07.19 23:25  
오 팁 좀 주시겠어요?

prism js는 제가 SIR에 추천했는데...

정작 저는 아직 적용을 못했어요 ㅠㅠ
28 사과 07.20 02:39  
저도 급하게 코드 정리안하고 적용 한터라....
소스가 뒤죽박죽..
나중에 시간날때 정리되면 게시글 올려드리던가 할께요...
11 우성군 07.20 07:24  
넵 대충 알려주셔도 제가 정리해서 다시 올리면 되니깐요 ㅎㅎ

감사합니다!
M 한별아빠 07.20 02:27  
이거 그냥 CSS 파일명 변경해서 사용하는게 편할 것 입니다.ㅠㅠ
11 우성군 07.20 07:25  
무슨 말인지 알거 같아요.

업데이트되면 다시 바꿔야하니 ㅜ ㅜ
제목
최근 글
최근 댓글
Facebook Twitter GooglePlus KakaoStory KakaoTalk NaverBand