'it'에 해당되는 글 3건

  1. 티스토리에 프로그램 소스코드 테마적용하기 - SyntaxHighlighter (1)
  2. Pinterest 이미지기반 소셜 큐레이션 서비스 (2)
  3. [DNSEver] 무료 DNS서비스

티스토리에 프로그램 소스코드 테마적용하기 - SyntaxHighlighter





티스토리 블로그에 프로그램 소스코드를 작성하면 일반적인 텍스트 방식으로 표현되기에 가독성이 떨어진다.

프로그램 소스코드를 좀 더 읽기 쉽게 표현해주는 SyntaxHighlighter 를 티스토리 블로그에 적용하는 방법에 대해 알아보자.



1. 다운로드

  • 다운로드 주소 : http://alexgorbatchev.com/SyntaxHighlighter/download/
  • 다운로드 주소로 접속하여 "Click here to download" 를 클릭하면 최신 버전으로 다운로드 된다. (v3.0.83)
  • 다운로드된 syntaxhighlighter_3.0.83.zip 파일을 압축해제한다.
  • 압축해제하면 아래 그림처럼 파일구성을 하고 있다. 이 중 "scripts"와 "styles"를 티스토리에 업로드 해야한다.




2. 티스토리에 파일 업로드

  • 티스토리 관리자 모드로 로그인한다.
  • " 꾸미기 > HTML/CSS 편집 " 메뉴로 이동하여 "파일 업로드" 탭을 클릭하면 위 화면을 볼 수 있다.
  • "추가" 버튼을 클릭하여 다운로드 받았던 "styles"와 "scripts" 폴더안의 파일을 모두 업로드한다.

3. 업로드한 파일을 스킨에 적용하기
    • " 꾸미기 > HTML/CSS 편집 " 메뉴의 "HTML/CSS" 탭으로 이동한다.
    • "skin.html" 에서 "</body>" 바로 위에 아래 스크립트를 입력한다. (Ctrl + F 로 </body>를 검색한다.)

    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    • 스크립트를 입력한 화면

    • Default 테마 외에 다른 테마를 적용하고 싶으면 shCore.css 와 shThemeDefault.css 파일명을 변경하면 된다.

    4. SyntaxHighlighter를 이용하여 소스코드 입력하기
    • 글쓰기 화면에서 HTML 체크박스를 선택하면 HTML 입력화면으로 변경된다.


    • SyntaxHighlighter를 이용하려면 아래 형식으로 작성해야 한다.
    형식)
    <pre class="brush:브러시이름">
    소스코드 입력
    </pre>

    예제) javascript 소스코드
    <pre class="brush:html">
    <script type="text/javascript" src="./images/shCore.js"></script>
    <script type="text/javascript" src="./images/shLegacy.js"></script>
    <script type="text/javascript" src="./images/shBrushBash.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/shBrushGroovy.js"></script>
    <script type="text/javascript" src="./images/shBrushJava.js"></script>
    <script type="text/javascript" src="./images/shBrushJScript.js"></script>
    <script type="text/javascript" src="./images/shBrushPhp.js"></script>
    <script type="text/javascript" src="./images/shBrushPython.js"></script>
    <script type="text/javascript" src="./images/shBrushSql.js"></script>
    <script type="text/javascript" src="./images/shBrushXml.js"></script>
    <script type="text/javascript" src="./images/shBrushVb.js"></script>
    <link rel="stylesheet" type="text/css" href="./images/shCore.css">
    <link rel="stylesheet" type="text/css" href="./images/shThemeDefault.css">
    <script type="text/javascript">
    SyntaxHighlighter.all();
    </script>
    </pre>

    결과) Emacs 테마로 적용된 모습을 볼 수 있다.


    Pinterest 이미지기반 소셜 큐레이션 서비스



    소셜 큐레이션 서비스를 알아보던 중 Pinterest(핀터레스트)가 대표적으로 많이 언급되어 알아보고자 한다.


    소셜 큐레이션이란?

    큐레이션이란 박물관이나 미술관에서 쓰이는 용어로 전시된 작품을 기획하고 설명하는 큐레이터에서 파생된 단어이다.

    요즘같이 정보가 넘쳐나는 정보홍수의 시대에 정보가 과잉됨에 따라 정작 필요한 것을 얻지 못하고 정보 공해에 의해 혼란스럽기까지 하다.

    이에 원하는 정보를 수집, 분류, 공유함으로써 정보를 가치있게 하는 것을 소셜 큐레이션이라 한다.



    이미지 기반 소셜 큐레이션 서비스의 대표 'Pinterest (핀터레스트)'

    핀터레스트는 이미지 기반 소셜 큐레이션 서비스이다.

    사용자가 인터넷 서핑을 하다가 원하는 이미지가 있을 경우 '핀잇(Pin it)'을 하면 핀터레스트에 스크랩이 된다. 이미지를 클릭하면 이미지가 있었던 원래 페이지로 이동하여 쉽게 접근이 가능하다.

    예를 들어 일반적으로 요리를 좋아하는 사람들은 레시피에 대한 정보를 다시 찾아보기 위해 에버노트나 즐겨찾기 등의 다양한 방법으로 저장해놓곤 한다.(아니면 일일이 필요할 때마다 검색해보곤 한다.) 일종의 필요한 정보를 수집하는 것인데 여간 불편한 것이 아니다.

    이런 점을 해결해 주는 서비스가 소셜 큐레이션 서비스라 할 수 있다.



    트랜드 파악이 쉬운 'Pinterest (핀터레스트)'

    핀터레스트를 가입하면 제일 먼저 관심사 주제를 팔로우(핀 설정)하도록 되어있다.

    전세계 사람들이 수집하여 올린 정보에서 내가 설정한 핀 주제에 해당되는 것을 보여준다.

    사람들이 수집한 정보는 관심이 있다는 것이고 그것이 트랜드라 할 수 있다.

    영감이 필요한 작업에 있어서 좋을거라 생각된다.



    서비스 소개 영상





    링크

     

    [DNSEver] 무료 DNS서비스

     

     

    무료로 DNS서버를 제공하는 DNSEver 라는 곳을 소개하고자 한다.

    티스토리 블로그를 2차 도메인으로 사용하기 위해 알아보던 중 지인을 통해 소개를 받고 알아보기 시작했다.

     

    DNSEver 는 10년 동안 무료로 DNS서비스를 제공하는 업체이다.

    10년이라는 시간동안 무료로 서비스를 제공했다는 점이 놀랍고,

    그 시간동안 안정적으로 운영했다는 점에서 기술력이 뒷받침되고 안정적인 서비스를 제공하리라 생각된다.

    나처럼 소규모 블로그나 프로그램 개발 목적으로 하는 사람에게 비용이 소요되는 서비스를 이용하는 것이 부담스러울 수 있는데 무료로 제공해주니 감사할 따름이다.

     

    최근 DNSEver 는 유료화 정책을 내놓았다.

    기업을 상대로 더욱더 안정적인 서비스와 프리미엄 서비스를 제공하기 위해 유료화로 변경하였다.

    개인은 트래픽이 적은 (100만 쿼리) 도메인은 무료이고 2014년 06월 30일까지 서포터즈 프로그램에 가입하면 무료로 사용할 수 있다.