본문 바로가기

티스토리 TIP

syntaxhighlighter 적용하기

syntaxhighlighter 적용하기

 


 

syntaxhighliter 파일을 다운받고 추가하는 것은

 

http://hunit.tistory.com/298에 잘 정리되어 있음.

 

따라서 할 떄 , 해당 블로그에서 HTML/CSS 편집의 위치가 최근에 바뀌어 조금 다르다.

 

"블로그관리페이지"의 "꾸미기"에 "스킨 편집"안에 "HTML편집"으로 가서 함.

 

 

 

 

 

 

내가 HTML은 아주 기초적인 것 (head body 이거 밖에 모름 ㄹㅇ ..)  밖에 몰라서 이해하기는 나중으로 미루고 일단은
http://hunit.tistory.com/298 사이트를 기준으로 하고 따라서 설정 하였다.

 

다운 받고 파일들을 업로드 한 이후에 단계들은 기록했다.

 

 

 

 

 

 

-head 끝나기 직전, 즉 </head> 앞에 해당 내용 추가   - 타입을 설정하는 것이다.


<link type="text/css" rel="Stylesheet" href="/styles/shThemeMidnight.css"/> 

 // 따라서 하는데 미드나잇타입으로 하려고 했는데 실패해서 그냥 똑같은 타입 적용 시킴 ㅠ

 

<link rel=" stylesheet" =""="" type="text/css" href="./images/shCoreEclipse.css">

 

 

 

 

 

-body 끝나기 직전, 즉 </body> 앞에 해당 내용 추가  -추가된 파일들을 참조할 수 있게 해주는 역할을 하는것으로 추정된다

 

<--!여기부터 syntaxhighlighter 때문에 추가된 부분 시작 // head에도 추가부분 있음-->
<script type="text/javascript" src="./images/shCore.js"></script>
<script type="text/javascript" src="./images/shAutoloader.js"></script>
<script type="text/javascript" src="./images/shBrushAppleScript.js"></script>
<script type="text/javascript" src="./images/shBrushAS3.js"></script>
<script type="text/javascript" src="./images/shBrushBash.js"></script>
<script type="text/javascript" src="./images/shBrushColdFusion.js"></script>
<script type="text/javascript" src="./images/shBrushCpp.js"></script>
<script type="text/javascript" src="./images/shBrushCSharp.js"></script>
<script type="text/javascript" src="./images/shBrushCss.js"></script>
<script type="text/javascript" src="./images/shBrushDelphi.js"></script>
<script type="text/javascript" src="./images/shBrushDiff.js"></script>
<script type="text/javascript" src="./images/shBrushErlang.js"></script>
<script type="text/javascript" src="./images/shBrushGroovy.js"></script>
<script type="text/javascript" src="./images/shBrushJava.js"></script>
<script type="text/javascript" src="./images/shBrushJavaFX.js"></script>
<script type="text/javascript" src="./images/shBrushJScript.js"></script>
<script type="text/javascript" src="./images/shBrushPerl.js"></script>
<script type="text/javascript" src="./images/shBrushPhp.js"></script>
<script type="text/javascript" src="./images/shBrushPlain.js"></script>
<script type="text/javascript" src="./images/shBrushPowerShell.js"></script>
<script type="text/javascript" src="./images/shBrushPython.js"></script>
<script type="text/javascript" src="./images/shBrushRuby.js"></script>
<script type="text/javascript" src="./images/shBrushSass.js"></script>
<script type="text/javascript" src="./images/shBrushScala.js"></script>
<script type="text/javascript" src="./images/shBrushSql.js"></script>
<script type="text/javascript" src="./images/shBrushVb.js"></script>
<script type="text/javascript" src="./images/shBrushXml.js"></script>
<script type="text/javascript" src="./images/shLegacy.js"></script>
<script type="text/javascript"> SyntaxHighlighter.all(); </script>
<--!여기부터 syntaxhighlighter 때문에 추가된 부분 끝-->

 

 

 

 

 

 

 

참고로 HTML주석을 통해 해당 내용추가한 부분 표시해둠.

HTML에 주석 문법은 아래와 같음.

 

<--!  내용  -->


여기까지가 설정이 끝난 것이고 이제는 실제로 사용하기만 하면 된다. 

 

 

 

 

 

# 실제 사용 방법

글쓰기에 들어가서 보면 우측 상단에 HTML이라는 체크박스가 하나 있음
이거 체크하고


 

<pre class ="brush:cpp">

소스코드 내용

 </pre>

 


해서 사용하면 됨.

여기서 brush는 해당 코드를 설정한 타입에 맞게 색칠해주는 것 같음..

그리고 cpp는 c++언어를 사용한다는 것임.  HTML언어이면 brush:HTML이라 하면 된다.

 

 

실제 코드 사용 예 opencv 공부하던거 들고옴.

#include 
#include 

int main()
{
	int i , j ;
	CvScalar tempValue1, tempValue2, resultValue;
	bool isBackGround = false;

	CvCapture* capture = cvCreateFileCapture("test.avi"); 
	//뭔지 정확히는 아직 모르는데 아마 동영상을 프레임으로 쪼개서 해당 구조체에 저장하는게 아닌가 싶다.
	IplImage* frame;

	IplImage* grayFrame = cvCreateImage(cvSize(320,240),8,1);
	IplImage* backgroundImage = cvCreateImage(cvGetSize(grayFrame),8,1);
	IplImage* resultImage = cvCreateImage(cvGetSize(grayFrame),8,1);
	//영상을 흑백으로해서 영상 얻고, 해당 영상 배경과 물체를 분리시켜 저장할 공간을 만드는 것임

	while(1){
		frame = cvQueryFrame(capture); // 동영상의 프레임을 복사 한다고 하는데 아직 잘 모르겠음 // 해당 함수 검색해보기
		if(!frame)break; //?
		cvShowImage("Source",frame);

		cvCvtColor(frame, grayFrame, CV_RGB2GRAY); //2가 to의 의미인가봄, 컬러영상을 흑백으로 변환
		cvShowImage("Gray Scale",grayFrame);
		
		if(isBackGround != true){
			cvCopy(grayFrame, backgroundImage); //배경영상을 추출한다는데?
			isBackGround =true;
		}
		cvShowImage("Background Image", backgroundImage);

		for(i=0; i< grayFrame->height;i++){
			for(j=0;jwidth;j++){
				tempValue1 = cvGet2D(grayFrame, i,j);
				tempValue2 = cvGet2D(backgroundImage,i,j);
				resultValue.val[0] = abs(tempValue1.val[0]-tempValue2.val[0]); // 두영상의 차는 object를 출력 할거야 //abs?
				cvSet2D(resultImage,i,j,resultValue);
			}
		}
		cvShowImage("Result Image", resultImage);
		if(cvWaitKey(30)==27) break; 
		//30ms간 프로그램 정지, ESC(27)을 누르지 않으면 루프반복 //esc번호를 지칭하는 숫자가 27인가 봄
	}
	cvReleaseCapture(&capture);
	cvDestroyAllWindows();
	cvReleaseImage(&grayFrame);
	cvReleaseImage(&backgroundImage);
	cvReleaseImage(&resultImage);

	return 0;

}