반응형
웹 개발과 게임 개발 관련 포스팅을 하기 위해서 준비하던 도중,
소스 코드를 블로그에 어떻게 올리면 좋을지 궁금해져서 알아보게 되었고 내 블로그에도 소개하려한다.
여러 방법들을 찾아보았는데 그 중 가장 간편한 방법인 'Color Scripter' 웹을 통한 방법을 소개한다.
Color Scripter
Simple & Flexible Syntax HighLighter
colorscripter.com
위 사이트에서 매우 간편하게 진행할 수 있다.
우선 사이트를 방문하면 위와 같은 모습이다.
소스를 붙여넣으면 자동으로 언어를 인식하여 알려준다.
만약 잘못인식하였을 경우 수동으로 변경하면 된다.
대략 20가지의 언어를 지원하는데, 메이저한 언어는 다 있다고 보면 된다.
이렇게 스타일을 블랙으로 할 수도 있다.
우측 하단에 html 보기를 클릭후 전체를 복사한다.
티스토리 뉴 에디터 기준으로 우측 상단의 기본모드를 html모드로 변환한다.
아까 복사하였던 코드를 붙여넣고, 다시 돌아오면
이렇게 코드가 깔끔하게 들어와있다!
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<!DOCTYPE html>
<html>
<head>
<title>록셉은 오공을 잘할까?</title>
<meta charset="utf-8" />
<link rel="shortcut icon" href="../lockcept2_white-alpha.ico">
</head>
<body>
<div>
<a href="https://www.op.gg/summoner/userName=%EB%A1%9D%EC%85%89"><img src ="opgg.png"></a> <br>
<img src="https://ddragon.leagueoflegends.com/cdn/9.18.1/img/champion/MonkeyKing.png" /> <p> this is wukong </p>
<img src="https://ddragon.leagueoflegends.com/cdn/4.18.1/img/champion/MonkeyKing.png" /> <p> this was wukong </p>
<div style="position: relative; max-width: 100%; padding-bottom: 56.25%; height: 0;">
<iframe width="320" height="180" src="https://www.youtube.com/embed/k1zAhC5aeQs" frameborder="0" allowfullscreen="" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"></iframe>
</div>
</div>
</body>
</html>
|
cs |
반응형
'지식 인생' 카테고리의 다른 글
| 마스크 KF94 뜻 KN95 차이 (0) | 2020.03.25 |
|---|---|
| 보드게임 쿼리도 하는 법 (0) | 2019.10.16 |
| 보드게임 티츄 하는 법 (0) | 2019.09.18 |
| 웹 도메인, 티스토리 블로그와 연동하기! (0) | 2019.09.17 |
| Gmail 의 plus (+) 와 dot (.) 기능 (0) | 2019.03.07 |