'문법'에 해당되는 글 4건

  1. 2010.03.25 태터툴즈의 스킨 이미지 주소 (5)
  2. 2009.12.23 아크로에디트 : 문법 강조에서 멀티 라인 기능
  3. 2009.12.22 아크로에디트 : 문법 강조에서 문법 이름 표기 문제
  4. 2009.11.10 문법 강조 적용했다

태터툴즈의 스킨 이미지 주소

  • 참고 : 소스 복사 버그가 고쳐졌다고 생각해서 글을 올렸는데, 오늘(3월 30일) 보니 다시 나타났습니다. 아마도 제가 무엇인가를 착각했나 봅니다. 죄송합니다.

최근 텍스트큐브닷컴(http://www.textcube.com/)에서 소리소문 없이 패치된 기능이 있다. 문법 강조 기능의 버튼 중에 "copy to clipboard"가 있는데, 처음에는  가 잔뜩 달라붙는 문제(텍큐닷컴은 Syntax Highlighter을 개선하라! by BLUEnLIVE)가 있었으나 최근 고쳐졌다. 그 버그가 고쳐졌음을 확인하는 과정에서 스킨의 images 디렉터리를 나타내는 주소에 대해 생각해 볼 기회를 갖게 되었습니다.

[code html]<p>예제</p> <p>오른쪽에는 공백이 있습니다.→               .</p> <p>.                  ←왼쪽에는 공백이 있습니다.</p>[/code]
더 이상 &nbsp;를 볼 수 없다.

더 이상 &nbsp;를 볼 수 없다.

그런데 버전은 v2.0.320 그대로입니다. 그래서 공지를 안 했나?

BLUEnLIVE 님의 패치

물론 느려터진 텍스트큐브닷컴 개발자 분들이 패치하기 전에 BLUEnLIVE 님이 패치를 멋지게 해주셨다(텍큐닷컴 용 Syntax Highlighter 2.0 버그 패치 by BLUEnLIVE 참조). 사실 이번에 티스토리에서 옮겨온 뒤로 문법강조가 적용된 부분이 있어서 BLUEnLIVE 님의 패치를 적용하려고 했는데, 벌써 패치가 되었더라고요.

태터툴즈의 스킨 이미지 주소

한편 BLUEnLIVE 님의 패치에 대한 글과 다른 글을 보았습니다.

그런데 텍스트큐브닷컴스킨 이미지 주소를 아주 정확하게 나타내려고 노력하셨습니다. 그러나 그것은 결론만 말하자면, 엄청난 삽질임을 깨닫게 되었습니다. 왜? 스킨이기 때문입니다. 무슨 뜻인지 이해가 안 된다고요?

스킨(skin)은 컴퓨팅에서 저마다 다른 사용자의 취향에 맞추기 위해 어떠한 소프트웨어웹사이트에 적용할 수 있는 사용자 그래픽 배색 (GUI)으로서의 테마와 연결된다. from 위키백과 :: 스킨 (컴퓨터)

스킨이란 기본적으로 테마 기능을 갖게 됩니다. 다시 말해 태터툴즈 시스템을 사용한 블로그에서 사용하는 스킨은 다른 블로그에 그대로 적용 가능하다는 점입니다. 물론 텍스트큐브닷컴에서 사용하는 스킨은 티스토리에서 그대로 사용할 수 없는 경우도 있지만, 적어도 스킨 이미지 주소 또는 스킨 이미지 디렉터리 주소는 동일하게 적용된다는 뜻입니다.

티스토리 스킨 이미지 주소 표현

티스토리 스킨에서 이미지 주소를 어떻게 표현했는지를 알아보겠습니다. 이것은 제 테스트 블로그를 이용했습니다. 태터툴즈 시스템에 거의 대부분 공통으로 존재하는 rss.gif 파일의 경로를 찾겠습니다.

티스토리 테스트 블로그 스킨 편집 화면

티스토리 테스트 블로그 스킨 편집 화면

티스토리 테스트 블로그 스킨 rss.gif 파일 나타내기

티스토리 테스트 블로그 스킨 rss.gif 파일 나타내기

위에서 보면 스킨 이미지 주소는 "./images/rss.gif"라고 표현했습니다. 이때 중요한 부분은 맨 앞에 보이는 ( . )과 images 라는 디렉터리 이름입니다. 이때 ( . )은 현재 디렉터리를 가리키는 축약 표현입니다. 도스/윈도/유닉스 공통입니다. 매킨토시의 OS X 에서도 적용 가능합니다.

티스토리 테스트 블로그의 rss.gif 파일의 실제 위치

티스토리 테스트 블로그의 rss.gif 파일의 실제 위치

위의 티스토리 테스트 블로그의 rss.gif 파일의 실제 위치 그림에서 보듯이 스킨에서 "./images/rss.gif"라고 나타난 부분이 "http://cfs.tistory.com/custom/blog/48/488983/skin/images/rss.gif"라고 바뀌어 있습니다.

이 파일은 제 티스토리 블로그인 왕미친놈의 왕미친세상에도 있습니다. 거기에서는 "http://cfs.tistory.com/custom/blog/35/354861/skin/images/rss.gif"라고 나타나 있네요.

맨 끝에 나타나는 /images/rss.gif 부분이 공통으로 보입니다.

텍스트큐브닷컴 스킨 이미지 주소 표현

한편 rss.gif 파일텍스트큐브닷컴의 스킨에도 존재합니다.

텍스트큐브닷컴 블로그 스킨 편집 화면

텍스트큐브닷컴 블로그 스킨 편집 화면 (아랫부분 생략)

텍스트큐브닷컴 블로그 스킨 rss.gif 파일 나타내기

텍스트큐브닷컴 블로그 스킨 rss.gif 파일 나타내기

위에서 보면 스킨 이미지 주소는 "./images/rss.gif"라고 티스토리의 경우와 똑같이 표현했습니다.

텍스트큐브닷컴 블로그의 rss.gif 파일의 실제 위치

텍스트큐브닷컴 블로그의 rss.gif 파일의 실제 위치

위의 텍스트큐브닷컴 블로그의 rss.gif 파일의 실제 위치 그림에서 보듯이 스킨에서 "./images/rss.gif"라고 나타난 부분이 "http://fs.textcube.com/blog/0/6512/skin/1/images/rss.gif"라고 바뀌어 있습니다.

이 파일은 아무리 스킨을 바꾸더라도 항상 "./images/rss.gif"라는 꼴을 유지하게 됩니다. 결국 BLUEnLIVE 님이 찾아내신 다음과 같은 표현은 모두 삽질이 되어 버립니다. 정말 애써 작성하셨을 텐데 뭐라 위로의 말을 드려야 할지... T,T

[code html]<script type="text/javascript" src="http://(블로그 이미지 주소)/j_shCore.gif"></script> <script type="text/javascript" src="http://(블로그 이미지 주소)/j_shBrushMsx.gif"></script> </body>[/code]

위의 코드에서 굳이 "http://(블로그 이미지 주소)/j_shCore.gif"라고 표현할 필요가 없습니다. (텍큐닷컴 용 Syntax Highlighter 2.0 버그 패치 by BLUEnLIVE 참조) 앞서 밝힌 코드를 응용하여 "./images/j_shCore.gif"라고 바꾸면 됩니다.

BBCode for 텍큐닷컴 3.2 대공개 문서와 BBCode for 텍큐닷컴 3.3 업데이트 문서에 보이는 그림도 별로 쓸모는 없습니다. 오히려 스킨이 가진 장점, 곧 어디에도 그대로 적용할 수 있다는 점을 없애 버리는 삽질이 됩니다.

BBCode for 텍큐닷컴 3.2 대공개 문서의 그림 일부

BBCode for 텍큐닷컴 3.2 대공개 문서의 그림 일부

BBCode for 텍큐닷컴 3.3 업데이트문서의 그림 일부

BBCode for 텍큐닷컴 3.3 업데이트문서의 그림 일부

관련 문서

내부 문서

외부 문서

이 글은 스프링노트에서 작성되었습니다.

Trackback 0 Comment 5

아크로에디트 : 문법 강조에서 멀티 라인 기능

최근 아크로에디트에 관한 글을 쓰다가 조금 불편한 기능이 있어서 개선할 수 없을까 궁리하다가 멀티 라인 기능이 있음을 알게 되었습니다. 

문법 강조와 자동 줄 바꿈

강제 열 맞춤 지시선에 걸쳐 있는 내용

강제 열 맞춤 지시선에 걸쳐 있는 내용

위 그림을 보면 글 내용이 강제 열 맞춤 지시선에 걸쳐 있습니다. 이때 모두 문법 강조가 올바르게 되어 있어 색깔이 잘 나타납니다. 이것을 강제 줄 바꿈 하게 되면 아래 그림처럼 됩니다.

자동 줄 바꿈 화면

자동 줄 바꿈 화면

그런데 이때 2번 영역은 전체가 다음 줄로 밀려나면서 문법 강조가 올바르게 되었습니다. 기본적으로 3번 영역은 모두 비었습니다. 자동 줄 바꿈을 하였으니 당연한 일이지요.

문제는 1번 영역이다. 이것은 중간이 잘립니다.

비교 1 : 잘린 부분만 표시

비교 1 : 잘린 부분만 표시

위 그림 비교 1을 살펴보면, 윗부분은 제대로 문법 강조가 되었는데, 아랫부분은 문법 강조가 제대로 되지 못하였습니다. 결국 윗부분은 파란색으로, 아랫부분은 검정색으로 나타납니다.

문법 강조 설정 변경 : 올바르게 보기

기왕에 문법 강조를 하였으니 제대로 봐야 하지 않겠습니까? 지금부터 환경 설정을 해 봅시다.

문법 강조 설정 : 현재 파일에 알맞은 문법 강조 설정을 편집

문법 강조 설정 : 현재 파일에 알맞은 문법 강조 설정을 편집

위와 같이 환경 설정에서 문법 강조를 불러 옵니다. 이때 현재 편집하고자 하는 문법 강조를 찾아서 편집 단추를 클릭합니다. 현재 자주색 네모로 테두리가 된 부분을 살펴보시면 이해할수 있으리라 생각합니다.

멀티 라인 문자열 허용에 체크 표시

멀티 라인 문자열 허용에 체크 표시

위 그림처럼 문법 강조 기능 설정 대화상자에서 멀티 라인 문자열 허용 체크박스에 체크 표시를 하면 됩니다. 끝난 뒤에는 확인 단추를 클릭해 주시면 됩니다.

올바르게 나타난 문법 강조

올바르게 나타난 문법 강조

찾아 보기 힘든 사람을 위해 문제가 된 부분만 떼어내면 다음과 같습니다.

비교 2 : 올바르게 바뀐 부분만 표시

비교 2 : 올바르게 바뀐 부분만 표시

위 그림 비교 2를 살펴보면, 비교 1과는 달리 윗줄과 아랫줄 모두 파란색으로 문법 강조를 올바르게 나타내고 있습니다.

추가 정보

이때 바꾸기 기능(문자열을 찾아서 바꾸는 기능)으로 바꿀 경우 위 비교 2에서 나타난 문자열 부분은 찾지 못하였습니다. 버그인지 아닌지 확인 중입니다.

관련 문서

내부 문서

외부 문서

이 글은 스프링노트에서 작성되었습니다.

Trackback 0 Comment 0

아크로에디트 : 문법 강조에서 문법 이름 표기 문제

최근 아크로에디트에 여러 가지 문법 강조(Syntax Highlight) 파일을 추가하였습니다. 그런데 일부 문법 강조에서 그 표시가 정확하지 않은 현상을 발견하였습니다.

벌레의 유형

  • 다른 놈에게 이름이 없다고 자기 이름을 강요하는 난폭한 벌레이다.

벌레의 발견

2009년 12월 16일경에 아크로에디트 최신 버전(0.9.20.92)을 실행하여 문법 강조 파일을 추가하다가 발견하였습니다.

문법 강조의 문법 이름에서 오류가 나타난 화면

문법 강조의 문법 이름에서 오류가 나타난 화면

위 그림을 보면 같은 문법 이름으로 나타나 있지만, 실제로는 전혀 다른 문법 강조 파일입니다. 이는 확장자만 확인해도 알 수 있습니다.

벌레의 원인

이 벌레가 나타난 부분을 살펴보다가 모두 세 부분임을 알게 되었습니다. 화면에 보이는 두 가지(C#, MS SQL2000), 그리고 나머지 하나는 VB.NET 입니다. 확장자로 볼 때 *.cs 는 C#, *.sql은 MS SQL2000, *.vbs는 VB.NET로 여겨졌습니다. 이것은 모두 아크로에디트 홈페이지 사용자 자료실에서 받은 파일에 포함되어 있었습니다. 직접 파일을 받아서 확인해 보고 싶은 사람은 C#, MSSQL2000, VB.NET문법강조파일 문서에서 첨부 파일을 받아서 Syntax 폴더에 복사해 넣고 확인해 보기 바랍니다.

아무튼 이 벌레가 나타나는 원인문법 이름을 지정해 주지 않았기 때문으로 여겨집니다. 그러므로 직접 문법 이름을 수정해 주면 됩니다. 다만 개발자가 이 벌레가 전혀 나타나지 않도록 고치는 일도 병행되어야 한다고 생각합니다.

이번 버그의 원인

이번 버그의 원인

벌레 잡기

아크로에디트 프로그램이 수정될 때까지는 사용자가 직접 이름을 지정하여 이 벌레를 없애야 합니다. 여기에서는 이미 아크로에디트를 설치하고, 문법 강조 파일을 다운로드 하였다고 가정하고 설명하겠습니다.

다운로드 한 문법 강조 파일

다운로드 한 문법 강조 파일

압축 파일을 풀면 세 파일이 나타난다. cs.stx, mssql2000.stx, vbnet.stx 파일이다. 참고로 위 화면은 다른 컴퓨터에서도 나타나는 현상인지를 알기 위해 PC방에 와서 잡은 화면입니다. 제 컴퓨터에는 알집이 없습니다. ^^a

AcroEdit 폴더에서 문법 강조 폴더(Syntax)를 찾아서 복사해 넣는다.

AcroEdit 폴더에서 문법 강조 폴더(Syntax)를 찾아서 복사해 넣는다.

문법 강조 파일을 <아크로에디트 폴더>\Syntax 폴더로 복사한다.

아크로에디트 옵션 >> 문법 강조

아크로에디트 옵션 >> 문법 강조

아크로에디트를 실행하여 환경 설정 대화상자를 불러와서 문법 강조 설정 화면을 봅니다. 위와 같은 화면에서 추가를 눌러 하나씩 추가하거나, 자동 검색을 눌러 새로운 문법 강조 파일을 자동으로 추가할 수 있습니다. 다만 작업이 끝나면 반드시 적용 또는 확인을 클릭하여야 합니다.

문법 강조 파일 목록이 잘못 나타난 예시 1

예시 1 - 문법 강조 파일 목록이 잘못 나타난 화면

예시 화면 1에서는 문법 강조가 세 부분에서 틀려 있다. 직접 찾아 보면 프로그램 오류를 찾는 눈이 밝아질 수도... (아니면 말고.)

문법 강조 파일 목록이 잘못 나타난 예시 2

예시 2 - 문법 강조 파일 목록이 잘못 나타난 화면

예시 화면 2에서는 틀린 문법 강조 표시가 마지막 부분에 몰려 있다.

위와 같이 두 가지 형태로 버그가 나타날 수 있으므로 다르다고 해서 이 기사 내용이 틀리다고 생각하지는 말아주기 바랍니다. 이때 예시 1은 문법 강조를 많이 추가했을 때 그 가운데 섞여서 나타납니다. 그때 파일명의 자모순으로 정렬해 주는데, 파일 사이에 정렬되면서 바로 앞의 문법 이름을 그대로 쓰게 됩니다. 예시 2에서는 이미 문법 강조를 적용한 상태에서 해당 문법 강조만을 추가하면, 앞서 적용한 문법 강조는 그 앞에까지 정렬되어 있고, 새로 추가한 파일만 따로 정렬해 줍니다. 그러면서 문법 이름은 바로 앞의 문법 이름을 가져오게 됩니다.
이 글에서는 예시 1을 기준으로 설명합니다.

엉뚱하게 나타난 문법 이름

엉뚱하게 나타난 문법 이름

편집할 문법 강조 부분에 커서를 두고 편집을 클릭합니다. 여기에서는 확장자가 *.cs인 부분을 클릭한 뒤, 편집 단추를 클릭합니다.

문법 이름이 비어 있다.

비어 있는 문법 이름

위와 같이 문법 이름 부분이 비어 있습니다. 이것이 바로 버그의 원인으로, 이것에 대한 처리 과정에서 엉뚱한 결과가 나타났습니다.
문법 이름 부분에 알맞은 값을 넣어 주면 됩니다. 이 경우에는 C#을 넣어 줍니다.

올바르게 나타난 문법 이름

올바르게 나타난 문법 이름

이제 C# 언어에 대한 문법 강조 이름이 올바르게 나타납니다. 이때 적용 단추를 클릭하면 방금 한 작업이 환경 설정적용됩니다.

다른 문법 이름을 편집하려면 원하는 부분을 클릭하여 선택한 뒤에 편집 단추를 클릭하고, 그냥 끝내려면 확인 단추를 클릭합니다. 이 과정에 대한 설명은 생략합니다.

참고 사항

팝업 메뉴

이때 환경 설정문법 강조 항목만 엉뚱하게 나타나느냐? 아닙니다. 팝업 메뉴도 엉뚱하게 나타납니다.

엉뚱하게 나타난 팝업 메뉴

엉뚱하게 나타난 팝업 메뉴

아마도 팝업 메뉴의 내용은 환경설정 > 문법 강조 항목의 내용을 읽어서 표시해 주기 때문으로 여겨집니다.

올바르게 나타나는 팝업 메뉴

올바르게 나타나는 팝업 메뉴

환경설정 > 문법 강조 항목에서 올바르게 고쳐주면 팝업 메뉴의 내용도 올바르게 나타납니다.

숫자와 URL/URI 표시

위의 올바르게 나타나는 팝업 메뉴 그림에서 숫자 1숫자 2로 표시한 부분에서 조금 엉뚱한 현상이 보입니다. 이는 버그인지 아닌지 확인할 수 없었습니다.

  • 숫자 1에서 보면, 문법 강조 Text File은 아무런 기능도 없이 빈 문법 강조입니다. 그런데 이처럼 숫자만 다른 색깔(밝은 자주색)로 문법강조가 되어 있습니다.
  • 숫자 2에서 보면, URL/URI를 파란 색으로 표현해 주고 있습니다. 이것은 아크로에디트의 기능으로 보입니다.

제작자/제공자의 답변

2009년 12월 22일 오류를 보고한 상태이다.

관련 문서

내부 문서

외부 문서

이 글은 스프링노트에서 작성되었습니다.


Trackback 0 Comment 0

문법 강조 적용했다

조커(ZocKr) 님의 블로그 BLUEnLIVE's ZocKrWorld를 참조하여 Google Syntax Highlighter(문법 강조)를 적용하였습니다.

적용 예시

  • 배치파일 : [ code bat]내용</code>
[code bat; highlight: (6, 9, 13)] @ECHO OFF REM 1부터 10까지의 합을 구하는 배치파일 SETLOCAL SET SUM=0 SET SUMTEMP=0 FOR /L %%i IN (1,1,10) DO CALL :COUNT GOTO :EOF   :COUNT SET /A SUMTEMP=%SUMTEMP%+1 SET /A SUM=%SUM%+%SUMTEMP% ECHO 0부터 %SUMTEMP%까지의 합은 %SUM%입니다. GOTO :EOF [/code]
  • C 언어 : <code class="brush:cpp;">내용</code>
[code cpp] int main () { // 1부터 10까지의 합을 구하는 C 언어 소스코드     int i, sum;     for (i=1, sum=0; i<=10; i++) {         sum = sum + i;         printf ("\d\n", sum);     }     return (0); } [/code]
  • HTML & 티스토리 치환자 : <code class="brush:html;">내용</code> 그리고 치환자는 [## 사이에 \를 집어넣었습니다.(조커 님의 팁 참조)
[code html; stripBrs;] <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>[\##_title_##] :: [\##_page_title_##]</title> <link href="./style.css" rel="stylesheet" type="text/css" /> [/code]

참조 문서

이 글은 스프링노트에서 작성되었습니다.


'일기' 카테고리의 다른 글

TeamViewer 시험  (0) 2009.12.04
블로그 백업 및 점검  (4) 2009.11.20
문법 강조 적용했다  (0) 2009.11.10
경술국치  (0) 2009.08.29
[동칠, 이계 정착하기] 어라, 이건 뭐야?  (0) 2009.08.22
고달픈 넷째 달  (2) 2009.06.29
Trackback 0 Comment 0
prev 1 next