안녕하세요 대짜이찐입니다.
이번 시간에는 네이버, 티스토리, 구글 블로거 등
블로그에서 소스코드를 이쁘게 꾸며주는
Color Script라는 사이트를 소개하려 합니다.
Color Scripter는 네이버 블로그등 <script> 태그가 지원되지 않아
Syntax HighLighter를 사용할 수 없는 곳에서도 사용할 수 있으며,
간단한 설정만으로 자신이 원하는 방식으로 소스코드를 하이라이팅 할 수 있습니다.
이렇게 코드를 작성할 수 있는 화면이 뜹니다.
Color Scripter로 Action Script, ASP, C, C#, CSS, HaXe, HTML, Java, JavaScript, JSP, Objective C, Perl, PHP, Python, Ruby, SQL, Swift, Visual Basic 등
다양한 언어를 하이라이트하여 소스코드를 더 보기좋게 블로그등에 업로드 할 수 있습니다.
또 다른 사용자들이 추가적으로 공유한 플러그인을 통해 없는 언어팩이나
스타일 패키지를 추가로 사용할 수 있습니다.
그것도 없다면 본인이 스스로 제작할 수도 있습니다.
플러그인으로 아두이노 언어팩과 스타일 패키지를 적용한 모습입니다.
그 후에 클립보드에 복사를 누르시고 붙여 넣기 하시면 됩니다.
HTML로 복사하실 분들은 세부설정에서
HTML태그 자체 복사에 체크하신후 클립보드에 복사를 누르시면 됩니다.
※주의
네이버 블로그에서는 문제가 없지만
구글 블로거의 경우 클립보드에 복사 붙여넣기를 그대로 하면
글쓰기 상태에선 정상적인 소스코드가
실제 업로드 했을때는 아래 사진처럼 순서가 무너집니다.
다른 블로그에서는 "white-space:pre" 을
"white-space:nowrap" 으로 강제 치환하는 방법등을 쓰는데
이 방법도 줄이 조금 어긋나 버립니다.
제일 간단한 해결책은
세부설정에서 줄번호 복사 체크 해제하고, 줄번호를 안쓰는 방법입니다.
근데 재밌는건, 다시 줄번호 복사를 체크 하고
소스코드를 넣었다 뺏다 하면 이렇게 제대로 잡히긴 합니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
|
// 행(row)열(column) 도트매트릭스 led 아두이노에 연결
// -1,-2는 행열을 1부터 시작하기 위해 더미(dummy) 핀으로 넣음
int rows[] = {-1,10,11,12,13,14,15,16,17};
int cols[] = {-2,2,3,4,5,6,7,8,9};
void setup() {
for (int i = 1; i < 9; i++) // 도트매트릭스 행열 출력으로 세팅
{
pinMode(cols[i], OUTPUT);
pinMode(rows[i], OUTPUT);
}
}
| cs |
아무래도 html에서 번호쪽과 소스코드쪽 테이블과 설정이 달라서 생기는것 같은데요
사실 매우 귀찮은 방법이긴 합니다.
다만 이 방법은 글을 쓰고 마지막에 해주셔야 합니다.
추가적인 작업을 할시 다시 소스코드가 무너지니 조심하세요.
감사합니다.
1 댓글
그냥 구글 워드에 붙혔다가 다시 복사해서 끌어 다쓰면 됨.
답글삭제