본문 바로가기

코드

CSS3의 HLSA 색상이 멋진 이유 CSS에서 사용되는 색상은 hex 코드, rgb(a), 그리고 색상 명이 있다. hex 코드는 웹 뿐만 아니라 워낙에 광범위 하게 쓰이고 있다 보니 따로 설명할 필요가 없다고 본다. rgb 같은 경우에는 IE7 이하는 alpha 필터를 별도로 지정해줘야 하기 때문에 rgba 속성은 쓸 수가 없다. 색상 명은 w3c 표준으로 지정된 몇 개의 색상 명이 있는데 이것들은 이름만 적으면 바로 사용할 수 있다. 그런데 이번에 새로 등장한 CSS3에서 추가된 색상 표기 방법 중에 HLSA라는 것이 추가 되었다. 이것은 무엇일까? HLSA는 Hue Lightness Saturation Alpha의 약자이다. 각각의 항목을 설명해보자면, H는 색조, L은 명도, S는 채도, A는 투명도를 뜻한다. 기존의 rgba 컬러.. 더보기
다음뷰 추천 위젯 코드 수정하기 티스토리 블로거라면 필수적으로 사용하시는 것중 하나가 다음뷰 일겁니다. 제가 네이버 블로그를 쓸데만해도 글 하나 발행할때마다 다음뷰 홈페이지에 가서 위젯을 퍼오는 과정이 너무 귀찮았는데요, 티스토리는 다음이 관리를 하고 있다보니 다음뷰와의 연동이 아주 잘 되어있습니다. 글의 발행/송고나 이벤트 참여도 클릭 한번으로 가능하며 아주 편리합니다. 가장 큰 장점으로는 다음뷰 추천 위젯을 스킨에 네이티브로 심을 수 있다는 것입니다. 물론 html을 잘 모르시는 분들을 위해서 티스토리에서는 다음 뷰 추천 위젯 플러그인을 제공하고 있습니다. 그래서 이것을 활용하시면 게시글 하단에 별 다른 설정 없이도 추천 위젯을 달 수 있습니다. 그러나 티스토리를 좀 오래 사용하시다 보면 남들 처럼 둥둥떠다니는 호버 버튼도 달아보고.. 더보기
다음뷰 글 목록 위젯 수정하기 다음뷰가 2013년 초에 개편을 하면서 위젯 디자인이 세련되게 바뀌었습니다. 그러나 이전까지는 최신글/인기글/추천글 목록위젯을 구할수가 있었으나, 현재는 지원을 하지 않고 있습니다. 디자인이 개편한 다음 뷰와 어울리지 않아 더 이상 제공을 하지 않는 것 같습니다. 그래도 대부분 이런 서비스들이 구식코드를 완전히 사용할 수 없게 만들지 않고 어느 정도는 계속 사용할 수 있게 유지를 해주는 편인데요, 그래서 예전에 발급 받아놓은 코드를 십분 활용하면 다음뷰 글 목록 위젯을 사용 할 수 있습니다. 다음뷰 글 목록 위젯은 이렇게 생겼습니다. 여기서 api가 나타내 주는 부분을 조정해주면 아주 간단하게 수정을 할 수 있습니다. 위쪽의 주소가 나타내는 부분을 대충 해석해보자면, 5번 스킨(검정)이 적용되고, 목록에.. 더보기
Syntax Highlighting 기능 추가 했습니다. 이전부터 Syntax Highlighting 에는 SyntaxHighligher를 사용해 왔으나, 이번에는 좀 더 커스텀을 많이 할 수 있는 Highligter.js로 갈아탔습니다. SH 보다 장점이라고 하면 더 광범위 하게 적용 되는 스타일이라고 보시면 됩니다. 게다가 테마도 많아서 굳이 새로 만들필요도 없더군요. 기존에 있던것 가져다가 약간 변형만 시켰습니다. SH는 브러시라는 개념으로 자신이 쓸 언어의 갯수만큼 스크립트 파일을 추가해줘야 하나, Highlight.js는 자체적으로 선택해서 단일 파일을 생성할 수 있는 점이 참 마음에 듭니다. 저 같은 경우 제가 현재 쓰고 있는 CSS,HTTP,Javascript,Ruby,CoffeeScript,PHP,Markdown,HTML/XML,Python,Ha.. 더보기
디스커스 코맨트에서 코드뷰를 써보자 디스커스 코맨트 플러그인에서 코드뷰(SyntaxHighlight) 쓰는 방법을 알아보도록 하겠습니다. 디스커스는 아무래도 일반사이트에서 부터, 웹개발자 포털이나, 개인 개발자 블로그까지 아주 널리쓰이다 보니 이 Syntax Highlight 기능을 아주 강력하게 지원합니다. (라이브리가 이런기능을 지원할까요? 글쎄요... 죽었다 깨어나도 그런일은 없을겁니다.) 사용하는 방법은 사이에 코드를 넣으면 됩니다. 디스커스 플러그인은 생각보다 똑똑해서 어떤 코드 인지 지정해줄 필요 없이 자동으로 인식합니다. 디스커스에서 지원하는 언어는 다음과 같습니다. BashDiffJSONPerlC#HTML/XML JavaPythonC++HTTPJavaScriptRubyCSSIniPHPSQL※HTML/XML 같은 경우에는 < .. 더보기
야후 날씨 코드 얻는법 weather.com 야후코드가 아닌 weather channel 코드를 사용하는 위젯이 늘어나고 있습니다. 코드 얻는 법은 야후 날씨 에 접속하셔서 검색창에 지역을 영문으로 치면 http://weather.yahoo.com/south-korea/busan/busan-1132447/ 이렇게 주소가 뜹니다. 1132447 이부분이 날씨 코드 입니다. var locale 뒤에 적어주시는건 모두 아시겠죠? 더보기

티스토리툴바