$jekyll new sitename

로 새로운 사이트를 만들 때 아래와 같은 에러가 발생했다.


Bundler: ruby: No such file or directory -- /usr/lib/ruby/gems/2.3.0/gems/bundler-1.16.1/exe/bundle (LoadError)


$gem env

로 환경설정을 보면 경로가 아래와 같이 나온다.

/var/lib/gems/2.3.0


해당 경로로 심볼릭 링크를 걸어주거나, jekyll 설정을 변경하면 해결된다.



 

 

 

 

 

 

티스토리 초대장 9장 배포합니다!

아래 양식에 맞추어 덧글을 작성해주세요

 

1. 메일주소

2. 블로그 운영목적 (간단하게)

3. (있을 경우)기존에 운영하던 블로그

 

 

 

 

 

 

 

 

 



1. 2013년 월별 방문자수 추이





2. 2012년과 2013년의 월별 방문자수비교 그래프



3. 블로그 시작일부터 지금까지 월별 방문자 수




4. 인터넷 브라우저별 페이지뷰 비율






5. 모바일기기별 페이지뷰 비율









 



웹페이지에 소스코드를 올릴 때 그냥 붙여넣으면 모두 같은 색으로 나와서 읽기가 어렵다.

이럴 때 SyntaxHighlighter는 코드의 키워드나 명령문, 주석 등에 색을 입혀서 가독성을 높여준다.



(▼ 코드가 색칠된 모습을 볼 수 있다.)




 SyntaxHighlighter를 블로그에 적용하면 게시물을 쓸 때

간단한 태그로 쉽게 코드에 색을 입힐 수 있다.


먼저 http://alexgorbatchev.com/SyntaxHighlighter/download/ 에서 최신 버전의 파일을 내려받는다.

scripts 폴더를 보면 각종 프로그래밍 언어들의 Brush 파일들이 있는데

shAutoloader, shCore, shLegacy파일은 필수적으로 업로드하고, 추가로 자신이 쓸 언어들을 더 올린다.

여기서는 AS3, Cpp, Java, JS, Php, Xml 파일을 선택했다.





그 다음 스타일시트 파일을 올리는데, shCore.css 파일은 기본적으로 올려야 하고

기본 스타일로 하려면 shCoreDefault, shThemeDefault 파일을 선택한다.

하이라이터가 다른 모양으로 나타나게 하려면 그 테마의 스타일시트 파일을 올려야 한다.

테마가 적용된 모습은 http://alexgorbatchev.com/SyntaxHighlighter/manual/themes/ 여기서 볼 수 있다. 




필요한 파일을 다 올렸으면 메인 스킨의 html파일로 들어가서

head태그 안에 아래와 같은 코드를 추가해야 한다.

<link rel="stylesheet" type="text/css" href="./images/shCore.css" />
<link rel="stylesheet" type="text/css" href="./images/shCoreDefault.css" />
<link rel="stylesheet" type="text/css" href="./images/shThemeDefault.css" />
<script type="text/javascript" src="./images/shCore.js"></script>
<script type="text/javascript" src="./images/shAutoloader.js"></script>
<script type="text/javascript" src="./images/shBrushAS3.js"></script>
<script type="text/javascript" src="./images/shBrushCpp.js"></script>
<script type="text/javascript" src="./images/shBrushJava.js"></script>
<script type="text/javascript" src="./images/shBrushXml.js"></script>
<script type="text/javascript" src="./images/shBrushJScript.js"></script>
<script type="text/javascript" src="./images/shLegacy.js"></script>
<script type="text/javascript">
    SyntaxHighlighter.all();
</script>

코드를 보면 아까 업로드한 css파일과 js파일들의 경로를 볼 수 있다. (티스토리는 리소스 파일들이 images폴더에 저장되어 저런 경로를 써주어야한다.)

테마나 다른 언어를 추가하고자 할 땐 이것도 추가해야 한다.

그리고 마지막으로는 SyntaxHilighter.all();함수를 호출한다.


 


이제 블로그 게시글을 쓸 때 하이라이터를 쓸 수 있는데,

<pre class="brush:언어의 명칭(alias)">

코드

</pre>

HTML 모드로 들어가서 위와 같이 적어주면 된다.


예를 들어 C++언어를 쓰려고 한다면

<pre class="brush:cpp">

코드

</pre>

로 적어주면 되는것이다.


나머지 언어들의 alias들은 여기서 확인할 수 있다.

http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/





한가지 중요한 주의점이 있는데

코드에 < 문자가 들어가면 코드가 깨지고 하이라이팅도 정상적으로 되지 않으므로

<문자가 있으면 모두 &lt; 로 바꿔야 한다.

찾아바꾸기를 지원하는 텍스트 에디터를 쓰거나 직접 간단한 프로그램을 작성하여 일괄적으로 바꿔놓으면 간단하다.


<pre>태그 대신 <srcipt>태그를 쓰면 이 문제는 해결되지만

특정환경(티스토리 모바일 등)에선 코드가 아예 안보이게 되는 점을 주의해야 한다.


script태그로 코드를 넣는 법은

http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html 

이 주소에 쉽게 설명되어 있다.



그리고 여러 가지 기능을 비롯한 더 자세한 설명은 신택스하이라이터 공식 페이지에 접속하면 볼 수 있다.

http://alexgorbatchev.com/SyntaxHighlighter



 







몇 주 전에 애드센스 수익이 인증 기준액인 10달러를 넘었다.

일반우편을 통해 주소지 인증을 위한 PIN이 발송되고

3~6주 후에 도착한다고 하는데 약 4주만에 편지가 왔다.




보낸 주소를 보니 미국에서 직접 보낸 것 같다.





편지의 내용을 보면 맞춤형 도움말에 대한 안내와 PIN을 어떻게 입력해야 하는지에 대한 설명이 있다.


우편으로 받으려면 시간이 너무 오래 걸리고 (일반우편으로 오니까)분실위험도 있기에

현재는 지급 방식을 기업은행을 통해 송금받을 수 있는

웨스턴 유니온 퀵 캐시(Western Union Quick Cash)로 설정해 놓았다.











2012년 tibyte.kr 블로그 통계



1. 월별 블로그 방문자 수 (2009.12 ~ 2012.12)





2. 월별 블로그 방문자 수 누계 (2009.12 ~ 2012.12)






3. 국가별 유입 비율 (2012)







4. 지역별 유입 비율(국내, 2012)








5. 유입 브라우저 비율 (2012)













10월과 11월에 충전된 티스토리 초대장을 7장 배포합니다.

아래 형식에 맞게 비밀덧글을 남겨주시면 검토후 일곱 분을 선정하여

티스토리 초대장을 보내드리겠습니다.


1. 메일주소
2. 개설하고자 하는 블로그의 주제나 방향

3. 기존에 운영하던 블로그 주소 (있을 경우에만)


마감기한 : 24시간 이내 (선착순 아님)











티스토리 블로그 글쓰기창이 새 에디터로 바뀌면서

플래시를 삽입할 때 불편함을 느끼셨을 것입니다.


기존 에디터와는 달리 플래시 무비의 크기를 조절하는 인터페이스가 없기 때문입니다.

HTML태그를 봐도 width와 height속성을 어디에 넣어야 할 지 쉽게 알 수 없게 되어있고요.


이럴 때 아래 과정을 거치면 쉽게 플래시의 크기와 위치를 조절할 수 있습니다.







1. 파일 버튼을 눌러서 올릴 플래시를 선택.






2. 파일을 올렸으면 HTML모드로 들어갑니다.






3.  cfile 부터 swf부분까지를 복사합니다.





4. 복사가 되었으면 [## 부터   ##]부분까지를 지우고 다음 태그로 대체합니다.


<embed width="가로크기" height="세로크기" src="/attachment/복사했던 주소" quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer">




5. 다시 HTML모드를 해제하면 지정한 크기로 멀티미디어 그림이 나타납니다.






이렇게 해서 새에디터에서도 원하는 크기로 플래시를 넣을 수 있습니다!
















티스토리 블로그를 시작하시려는 분들께 초대장을 배포합니다.
초대장을 받고도 블로그를 운영하지 않거나, 스팸 블로그를 만드는 분들이 간혹 있어서
다음과 같은 양식에 맞게 덧글을 작성해주시기 바랍니다. (비밀댓글로 하셔도 됩니다.)

- 초대장을 받을 메일 주소
- 블로그 개설 목적
- (있을 시) 기존에 운영하던 블로그 주소

초대장 갯수가 한정되어 있어서 전부 보내드리지 못한 점 아쉽지만
검토 후 총 네 분에게 보내드리겠습니다.


마감되었습니다.
초대장 갯수가 한정되어 있어서 보다 많은 분들께 보내드리지 못한 점 아쉽습니다.










제 블로그 본문 하단에 애드센스와 다음뷰가 있는데요,

글을 발행하면 400x80 짜리 다음뷰 박스가 336x250짜리 애드센스의 위쪽에 자리를 잡습니다.

그래서 모양을 맞추기 위해 다음뷰를 내리려고 카페 스킨 html로 들어가 애드센스보다 하단에 놓기로 했습니다.


html 코드에 다음뷰를 표시하기 위한 embed태그를 달고



 <embed src="http://api.v.daum.net/static/recombox1.swf?nurl=글주소(티스토리블로그 치환자 사용)" quality="high"  bgcolor="#ffffff" width="400" height="80" type="application/x-shockwave-flash"</embed>



다시 블로그로 돌아와 글을 보니 다음뷰가 (당연히..)두개가 떠있는 것이었습니다.

그래서 아무 생각도 없이 플러그인 설정에서 다음뷰를 체크 해제했죠.. 

그랬더니 pc화면에서는 잘 나왔지만 모바일에서 뷰온 버튼이 표시가 안됐습니다.

본문에 다음뷰를 표시하는 embed 태그도 넣어봤지만 본문에서는 글번호를 불러오는 치환자가 먹히지 않더군요..


  

답은 간단했는데 플러그인 설정에서 view on 박스 항목에서 '표시하지 않음'을 선택하면 된다는 것이었습니다.

 이렇게 하면 pc화면에서는 (추가적인)다음뷰가 보이지 않게 되지만,

 모바일 스킨에서는 뷰온 버튼이 사라지지 않고 여전히 잘 나오게 됩니다.












+ Recent posts