'Tech-tips/Skin how'에 해당되는 글 10건
Tech-tips/Skin how 운영체제 별 시스템 폰트 적용 2014.04.17 21:00

블로그에서 보이는 폰트 같은 것에 별다른 관심이 없다면 모든 운영체제에서 굴림체로 뜨게 할 수도 있다. 그러나 전 우주의 평화와 번영을 위해서 그런 일은 삼가토록 한다. 요즘은 시스템에서 기본으로 제공하는 폰트도 나쁘지 않은 편이므로 양심이 있다면 시스템 폰트를 불러오도록 설정해주는 것이 좋다. 특히 운영체제에 따라서 지원하는 기본 시스템 폰트가 다르므로 font-family를 지정할 때 신중하게 하여야 한다. - 시스템 별로 기본..

read
Tech-tips/Skin how 티스토리 에디터 클래스 분석 2014.04.16 21:00

스킨 수정을 하다 보면 다른 부분은 건드리기 싫고 딱 본문에 나오는 이 부분만 바꿔보고 싶다는 생각을 할 때가 있다. 이를 위해서 몇 가지 css 셀랙터가 필요한데 이 기회에 정리를 해보았다. 티스토리 공식 스킨 가이드에는 더 보기 접기 부분만 나와 있기 때문에 좀 불만이 있는 부분이기도 하다.tt_article_useless_p_margin→ 티스토리 글 설정에서 문단 간격 없음을 선택하면 자동으로 감싸지는 div. 의외로 활용도가 많고 스킨 구조..

read
Tech-tips/Skin how 디스커스 코맨트 갯수 표시 api 적용 2014.02.19 01:05

디스커스에서 기본으로 제공하는 코맨트 갯수 api를 블로그에 적용 하였습니다. 코드는 어이가 없을 정도로 간단합니다. <a href="자신의 블로그 주소[ ##_article_rep_link_## ]#disqus_thread"></a>적당한데 붙여 넣어주시고 여기다가 스타일만 적용 하면됩니다. 코맨트 갯수를 누르면 디스커스 입력창으로 자동으로 이동합니다. 원한다면 자바스크립트를 사용해서 애니매이션 스크롤을 적용할수도 있겠내요. ..

read
Tech-tips/Skin how 네이버 블로그에 원형 프로필 사진을 넣어보자 2014.02.14 23:14

네이버에 프로필 사진을 넣을때는 용량제한이 아주 심합니다. 일반이미지 이면 별 상관없긴 하지만 GIF이미지는 기준 용량에 맞추면 화질열화가 아주 쩔게 됩니다. 이를 어떻게 우회할지 고민을하다가 그냥 기본 프로필 위젯에서 사진을 꺼버리고 별도로 프로필 이미지를 만들어 넣은것이 현재 제 네이버 블로그 스킨의 형태입니다. 그리고 한가지 일반 프로필 넣는 방식과 다른점은 원형 테두리 안에 들어가 있다는 것이죠. (물론 IE8이하에서는 네모 낳게 보..

read
Tech-tips/Skin how 티스토리 스킨 강좌 - 중복사용이 가능한 사이드바 모듈 2014.02.13 17:24

티스토리 기본 스킨 사이드바를 기준으로 보면 프로필, 공지사항, 카테고리. 관리자 메뉴, 검색, 카테고리, 태그박스, 최신글, 최신댓글, 최신트랙백, 아카이브, 달력, 링크, 방문자수가 있습니다. 이 중에서 프로필, 방문자수, 카테고리는 반복사용이 가능합니다. 그러나 나머지 요소들은 반복사용이 불가능합니다. 하지만 사이드바를 여러개 생성한 뒤에 복제를 하면 중복으로 사용할수 있는 요소도 있습니다. (ex 공지사항) 그러나 검색 모듈은 중복으..

read
Tech-tips/Skin how 티스토리 스킨 강좌 - 로그인 했을때만 보이는 관리자메뉴 2014.02.13 16:54

티스토리는 관리자 메뉴는 비로그인한 사용자한테도 보이는 이상한 구조를 가지고 있습니다. 아마도 관리자 메뉴를 통해서 로그인을 하게 되어 있는 구조 때문에 이렇게 만들어 놓은것 같습니다. 하지만 왠만하면 관리자 관련 메뉴는 타 사용자에게 보이지 않았으면 하는게 사람 마음 입니다. (아니면 저만 보기 싫을수도 있고요)게시글 작성시 관리자에게만 나타나는 메뉴의 치환자로 s_ad_div가 있습니다. 보통 글의 맨 상단에 기본으로 추가가 되는데요, 이 안에 ..

read
Tech-tips/Skin how Addthis Smart Layer 설치/설정/활용 2013.10.21 20:00

제 블로그에는 Addthis smartlayer 가 달려있습니다. 블로그의 왼쪽 상단과 오른쪽 하단에 뜨는 것인데요, 왼쪽 상단은 공유버튼, 오른쪽하단은 추천게시글이 뜹니다. 물론 기본제공하는 스마트레이어 같은 경우에는 공유버튼, 팔로우버튼, 추천게시글, 추천 컨텐츠 부분이 뜹니다. 자신이 필요한 부분만 선택해서 적용이 가능하기 때문에 필요한 것만 설치했습니다. 이렇게 스마트 레이어는 잘 적용해두면 활용도가 높습니다. 이제 Addthis sm..

read
Tech-tips/Skin how 티스토리 툴바에 스타일 적용하기 2013.10.20 15:49

티스토리 화면의 오른쪽 상단에는 다음과 같은 툴바가 있습니다. 다음과 티스토리 메인화면으로 바로가는 버튼과 자신의 블로그를 관리할수도 있고 링크를 추가 하는 버튼과 심심하면 누르게 되는 렌덤 버튼이 존재하죠. 스킨에 웹폰트를 적용해도 이 부분은 바뀌지 않습니다. 사실 스킨 치환자에 저것을 설정하는 부분도 없고요. 저것을 보기 싫어서 설정에서 색상을 투명처리 시키거나 아예 CSS 오버라이드로 꺼버리시는 분들이 종종 있습니다. 그렇지만 그렇게하면..

read
Tech-tips/Skin how 블로그 파비콘 쉽게 제작 하는 방법 2013.10.09 20:30

포토샵은 ico포맷을 지원하지 않아서 파비콘을 만드려면 따로 ico플러그인을 설치 해줘야 합니다. 하지만 이렇게 번거로운 작업을 할 필요없이 요즘은 웹에서도 파비콘 제작이 가능합니다. 간단하게 아이콘으로 쓸 png파일을 만든 뒤에http://www.icoconverter.com/에 업로드 하면 됩니다. 그러면 변환된 ico파일을 다운로드 받을 수 있습니다.

read
Tech-tips/Skin how 스킨 만들기 강좌 - 1. HTML 기초 2013.10.06 16:52

저도 그렇게 웹에 대해서 뛰어난 편은 아닌 초보 웹개발자입니다. 기껏해야 만들줄 아는 것은 위젯같은 간단한 웹앱이나 고작 티스토리 스킨 만드는 것 입니다. 그래서 부족한 부분이 있다면 지적해주시면 겸허히 받아 드리도록 하겠습니다. 티스토리로 이주 해 오신 분들은 여러가지 이유가 있어서 오셨을 겁니다. 무제한 저장 용량일수도 있고, 자신만의 도매인을 쓸수도 있는 자유로운 환경이거나, 수많은 플러그인의 다양한 기능, 여러 포털 블로그와는 차별화된 ..

read
lifeinvader

티스토리 툴바