'Tistory' 카테고리의 글 목록

thumbnail 앨범형 티스토리 스킨배포 무료 다운로드 테마브루(Themebrew) 티스토리의 스킨제작자들은 공식홈페이지를 통해서 무료스킨을 배포하는 경우가 많습니다. 스킨포럼에서도 이용자 제작 스킨등을 배포하기도 하지만, 트위터나 각 개인의 티스토리를 통해서 무료 스킨이 배포되기도 합니다. 티스토리의 공식 스킨도 깔끔하고 좋습니다만, 여러모로 부족한 부분도 많습니다. 특히, SEO와 관련해서 메타태그의 여부 등 치환자로 표현하기 어려운 요소들이 작성되어 있지 않는 경우도 있고, 또한 자잘한 오류가 있기도 합니다. 티스토리에서는 여러가지 스킨을 제작하고 배포하는데, 최근에 배포한 여섯가지의 스킨이 가장 쓸만합니다. 이외에 스킨은 여러가지 아쉬운 점이 많이 있습니다. 티스토리스킨은 아래와 같이 매거진, 미니멀, 반응형, 블로그형, 사이트형, 그리고 초보들이 쉽게 레이아웃을 변경하거나 특정..
thumbnail 티스토리 에디터에서 Alt 요소 쉽게 추가하는 방법 이미지의 Alt값은 일반 웹문서의 키워드와 같습니다. 구글이나 네이버, 다음에서 해당 이미지가 검색되기를 원할 경우에는 이미지에 Alt 요소를 추가해주는 것이 좋은데요. 더불어, Title 값도 함께 추가해준다면 검색엔진에서 내가 업로드한 이미지가 노출 될 확률이 높아집니다. 저 같은 경우에는 글을 쓸 때, 일반 기본모드로 글을 쓰는 경우도 많이 있지만, HTML 모드에서 글을 쓰는 경우가 더 많습니다. P 태그 요소와 더불어 다양한 기능을 CSS(스타일 시트)로 꾸밀 수 있기 때문인데요. 티스토리 내에서 이미지를 업로드 하는 경우에는 고유의 주소값으로 업로드 되기 때문에 하나하나 찾아서 Alt 태그와 Title 태그를 찾아서 넣는 것이 쉽지 않습니다. 그래서 가장 쉬운 방법으로는 F12 개발자 도구를 ..
thumbnail 티스토리 더보기 버튼 디자인(CSS) 일반적으로 별도의 스킨을 사용하지 않거나 티스토리 내에서 스킨수정을 하지 않았다면 더보기 버튼이 매우 밋밋해보일 수 있다. 더보기 기능은 많이 쓰는 편은 아니지만, 쓰는 사람에 따라서 유용하게 사용할 수 있는 기능 중 하나로, 중요하진 않지만 매우 긴 내용을 감추거나 부가적인 설명을 할 때 더보기버튼을 적절하게 활용할 수 있다. ↓ ↓ 별도의 CSS를 추가하지 않았다면 아마도 위와 같이 밋밋한 텍스트만 남아있을 것이다. 이러면 아무리 좋은 글을 써도 감춰진 정보를 방문자가 그냥 놓쳐버릴 수가 있다. 그래서 간단한 안쪽 여백과 외곽선을 추가해줘서 버튼처럼 보이게 할 수 있을 것이다. ↓ ↓ 이렇게 하면 다소 밋밋한 더보기버튼이 위와 같이 조금 색다르게 보일 수 있다. 배경색을 넣고 더보기 글자 색을 흰색으..
thumbnail 티스토리 구글 애드센스 가로로 광고 2개 다는 방법(2단 광고) 티스토리 구글 애드센스 가로로 나열하는 방법 CSS 코드를 조금 안다면 더 자유롭게 수정이 가능하고 테이블 코드를 Div로 감싸서 중앙정렬이나 위 아래 마진값을 주는 방법으로 훨씬 깔끔하게 배치가 가능하다. 물론, 나의 경우에는 수익형 블로그의 경우 광고로 거의 도배하다시피 하지만, 그래도 최대한 깔끔하게 배치하는 것이 광고효율을 높일 수 있는 방법이라고 할 수 있다. 이왕 광고를 할거라도 컨텐츠처럼 활용될 수 있게 꾸미는 것이 바로 구글 애드센스 광고의묘미라고 할 수 있겠다. 보통은 위의 방법으로 구현하고 광고 위치에 따라서 조금 달라질 수 있다. 테이블코드로 가로로 광고를 2개 달 수 있는데, cellspacing(Cell Spacing)속성은 말 그대로 셀과 셀 사이의 여백을 조절할 수 있다. 그래..
thumbnail 사이트맵 등록 후 검색엔진에 등록되는 시간 + 네이버 서치어드바이저 웹페이지 수집요청하기 티스토리나 워드프레스, 구글블로그, 텀블러 등 웹페이지에 수집되는 사이트를 만들었다면 나의 글이 잘 노출이 되어야 합니다. 그리고 저와 같이 중간에 도메인을 변경한다면 다시 사이트맵을 생성하고 각 검색엔진에 등록을 시켜주어야합니다. 이전 도메인과 연동된 웹페이지들이 여전히 검색엔진에 남아있기 때문에 유사문서 등의 문제를 발생시킬 수 있습니다. 가장 좋은 점은 하나하나 수작업으로 페이지 이전 작업을 해주면서 웹수집을 동시에 해야하는 것이지만, 이처럼 귀찮은 일은 또 없습니다. 그래서 대부분 검색엔진이라고 하면 구글, 네이버, 다음만을 집중적으로 해주는 것이 훨씬 효율적이라고 할 수 있는데요. 그렇다면, 저와 같이 검색노출이 잘 안되거나 도메인을 새롭게 연동한다면 언제 나의 글이 새로운 도메인 주소로 노출이..
thumbnail [티스토리] 새로운 글쓰기 에디터 Alt 태그이미지 삽입방법 새로운 글쓰기에서 Alt태그 또는 Alt속성 이미지의 “대체 문구”(alternative text) 적용시키는 방법 티스토리를 하면서 검색노출이 잘 되기 위해서는 네이버 블로그와는 달리 웹사이트상에서 적용되는 아주 중요한 SEO(검색엔진 최적화)를 알아야만 한다. 티스토리와 네이버 블로그를 동일시하는 사람들이 많은데, 네이버 블로그와 비슷한 것은 다음 블로그다. 다음 티스토리와 다음 블로그는 분명히 다르다. 이전에 티스토리를 계속 해왔던 사람들은 이전 에디터에서 쉽게 Alt 속성을 추가해줄 수 있었다. Alt 태그에 대해서는 이해하고 있다는 가정하에 짧게 설명을 한다면, 이미지가 어떠한 이유로 웹상에서 보여지지 않을 때, 이를 대신하여 이미지에 텍스트 문구를 적용하여 노출시켜주는 것이다. 그래서 SEO ..
thumbnail 티스토리의 이미지 복사기능(웹 서버 저장) 나는 누구보다도 글을 쉽게, 또 많이 쓸 수 있는 능력을 가졌다. 그리고 그동안 네이버블로그를 하면서 배웠던 능숙함은 웨일브라우저의 Alt + F2의 영역선택 캡쳐기능으로 블로그에서 글을 쓸 때, 쉽게 이미지를 복사해서 글을 쓸 수 있었다. 이미지를 저장하고 웹에디터에 이미지를 붙여넣을 때, 두 가지 방법이 있다. 하나는 이미지를 별도로 웹 에디터 기능의 파일을 내 컴퓨터에서 불러와서 등록을 시키는 방법이고, 또 하나는 이미지를 그대로 복사 붙여넣기 하는 기능이다. 캡쳐기능으로 붙여넣기를 하게 되면 네이버블로그의 경우에는 이미지가 웹서버에 저장이 된다. 그렇지만, 드래그를 해서 저장을 하게 되면 드래그한 서버의 웹주소 데이터도 그래도 복사가 된다. 이 때문에, 이미지만으로도 유서문사 처리를 당할 수 있는..
thumbnail 알게모르게 변경된 티스토리 업데이트 '인용글, 구분선' 변경된 인용글 디자인 위와 같은 디자인으로 변경되었다. 매일 티스토리에 글을 쓰는 사람이라면 바로 알아챘을거라고 생각된다. 구분선의 경우에도 명확하게 변경이 되었는데, 구분선을 새롭게 추가하는 것이 아니라 변경한 것이여서 이전 디자인이 마음에 들었던 사람에게는 조금 아쉬울 수 있는 업데이트였다. 인용글 디자인의 경우에는 회색 박스에 선이 없었는데, 추가되었다. 그래서 훨씬 선명하게 인용글을 확인할 수 있게 되었다. 인용글이나 구분선의 경우에는 직접 CSS나 HTML을 수정하면 내가 원하는 느낌으로 변경할 수 있지만, 기존의 느낌도 좋은 것 같아서 그대로 사용하고 있다. 또, 이와 같이 잠수함 패치(업데이트)를 하게 되는 경우에는 하나하나 수정하는 것이 번거롭기 때문에 위와 같은 요소들은 기존의 티스토리 ..
thumbnail 투명한 파비콘 만들기 : 다이나믹 드라이브 툴 웹툴을 제공해주는 개인 사이트가 있다. 공식적으로 운영되는 사이트보다는 블로그에 가까운 사이트임에도 불구하고 다양한 웹툴을 제공하고 있다. 요즘은 직접 만드는 것보다 이렇게 웹툴을 통해서 만드는 것이 훨씬 완벽에 가깝다. Web Tools Image Optimizer FavIcon Generator FavIcon Editor Animated Gif Email Riddler .htaccess Password .htaccess Banning Gradient Image Button Maker Image to Base64 String Ribbon Rules List Scrubber Tool DD Whois Service 다이나믹 드라이브 사이트에서 제공하고 있는 링크는 위와 같다. 여러가지 기능들을 제공하고 있..
thumbnail 티스토리 토글형 사운드클라우드 배경음악 구현하기 티스토리 사이트에 배경음악을 따로 설치할 생각은 없었는데, 우연히 괜찮은 라이브러리를 발견해서 설치해봤습니다. 토글형식으로 되어 있고 자주 방문하는 사이트라면 크롬엔진에서도 자동음악재생이 가능해집니다. 어쨌든, 토글형식의 배경음악 기능은 꽤 예쁘고 깔끔합니다. $('.cata-music-toggle-btn.cata-toogle').on("click", function() { $('.cata-music-toggle-btn.cata-toogle').not(this).removeClass('.cata-music-toggle-btn.cata-toogle'); $(this).toggleClass('active'); }) 제 사이트에서는 메인에 위치한 재생버튼도 있지만, 사운드클라우드처럼 리스트 형식의 음악을 재생..
thumbnail 티스토리 카테고리 페이지 주소 Category 삭제방법 var articleListPage = document.getElementsByClassName("post-item"); var articleListPage = document.getElementsByClassName("related-articles"); var removeSID; var indexSID; if(articleListPage.length) { for (i = 0; i < articleListPage.length; i++) { removeSID = articleListPage[i].getElementsByTagName("a")[0].href; indexSID = removeSID.indexOf("?"); if(indexSID == -1) {break;} removeSID = removeSID..
thumbnail 나라별 구글애드센스 단가(CPC) 2018년 CPC 상위국 (단위: USD) 룩셈부르크: 0.65 미국: 0.61 호주: 0.57 영국: 0.48 핀란드: 0.45 캐나다: 0.45 오스트리아: 0.45 뉴질랜드: 0.33 스웨덴: 0.31 아일랜드: 0.31 덴마크: 0.28 싱가포르: 0.27 남아프리카: 0.26 노르웨이: 0.26 네덜란드: 0.26 바하마: 0.27 독일: 0.22 스위스: 0.21 벨기에: 0.21 스페인: 0.19 지부티: 0.19 태국: 0.17 프랑스: 0.17 콜롬비아: 0.17 푸에르토리코: 0.16 과테말라: 0.16 그리스: 0.16 아랍에미리트: 0.15 러시아: 0.15 몰타: 0.15 동북아시아 국가 비교 일본: CPC USD 0.14 / CTR 1.14% (33위) 중국: CPC USD 0...
thumbnail 오랜만에 쓰는 티스토리 노하우 사실 티스토리 기반으로 만들어진 사이트는 사이트 관리에 신경을 매우 많이 써주어야만 합니다. 워드프레스와 달리 티스토리는 티스토리 내에 사용할 수 있는 기능들이 한정되어 있고, 이마저도 어려움을 겪는 사람들이 너무나도 많기 때문에 네이버블로그를 했던 분들이라면 티스토리를 시작하는 것에 굉장히 어려움을 느낄 것이라고 생각이 듭니다. 개인적으로는 네이버 스마트에디터보다 티스토리 에디터를 더 마음에 들어합니다. 직관적이고, 깔끔하고 필요한 내용만 작성하면 되기 때문입니다. 티스토리를 다양한 목적으로 하는 사람들이 많습니다. 저는 글을 쓰는 능력은 나름대로 다른 사람들에 비해 빠르게 글을 쓸 수 있다고 생각을 하면서도 다른 사람들 만큼 컨텐츠가 다양하거나, 분석적이거나 정성을 들여서 쓰는 글은 잘 쓰지를 못합니..
thumbnail 티스토리 검색창 추가하기(치환자/출력 갯수/디자인 변경) 기존에 관련 글이 꽤 많이 있었는데 소스를 보니 적용되는 부분이 모두 달랐습니다. 글이 점점 많아지니 제 글도 쉽게 찾지 못하는 경우가 생겨서 급하게 티스토리 검색창을 추가했습니다. 위치는 개인의 취향에 맞게 조정해서 쓰면 되고 HTML을 조금 다루실 줄 아시는 분은 그대로 소스를 긁어서 원하는 위치에 추가하시면 될 것 같습니다. 다만 Submit 출력 버튼은 Display: none; 설정을 한 상태라서 검색 버튼을 활성화시키실 경우에는 CSS를 수정하셔야 합니다. HTML CSS /* 검색창 */ .search { max-width: 1200px; margin: 0 auto; text-align: right; } input#article_search { margin: auto; text-align: ..
thumbnail 티스토리 아이콘 설정 파비콘과 다른 점 티스토리를 처음 개설할 때 여러가지를 설정하게 되는데, 이는 워드프레스나 네이버블로그 등 다른 플랫폼에서도 마찬가지입니다. 사이트에 익숙하지 않다면 새로운 설정을 할 때 무엇을 위한 것인지 모를 때가 많습니다. 티스토리에서는 내 사이트 옵션에서 내블로그로 들어가면 보안설정 외에도 아이콘 설정과 파비콘 설정을 할 수 있는 곳이 있습니다. 프로필 이미지도 따로 설정을 해야하고, 블로그의 프로필도 별도로 설정하는데, 아이콘 까지 있다면 조금 헷갈릴 수 있습니다. 티스토리 아이콘은 댓글에 표시되는 부분입니다. 파비콘은 사이트를 열었을 때 브라우저의 상단에 뜨는 작은 아이콘입니다. 즐겨찾기를 할 때에도 파비콘의 이미지가 보여집니다. 파비콘이 적용된 모습 바로 이렇게 적용된 부분이 파비콘입니다. 그렇다면 아이콘을 ..
thumbnail 티스토리 통계 : 블로그 소유자의 방문 제외 업데이트 드디어 기다리던 소유자 방문 통계가 제외됐다. 그래서 간단한 통계를 보더라도 일단은 실방문자를 파악하는 것이 제일 중요한데, 이제서야 실방문자 통계만 집계되도록 변경이 되었다. 통계 후속 업데이트 - "블로그 소유자의 방문이 제외"됩니다. 통계 후속 업데이트 - "블로그 소유자의 방문이 제외"됩니다. 안녕하세요 티스토리 팀입니다. 블로그 통계 개편 이후에 '블로그 소유자의 방문도 통계에 포함'되어 불편하다는 의견이 있었습니다. 이를 해결하기 위한 논의를 했지만 제외해야 할 방문의 기준을 설정하는 것,.. notice.tistory.com 하지만, 나의 경우에는 글을 쓸때를 제외하고 딱히, 내 글을 별로 안읽기 때문에 이전과 별 차이가 없다. 오히려 요즘에는 그래도 열심히 글을 쓰고 있어서 그런지 유입경로..
thumbnail 티스토리 속도 개선 순위 SPEED Improvement 티스토리 사이트를 운영하다보면 사이트 관리가 왜 어려운지를 깨닫게 된다. 다양한 어려움에 처하다보면 해결방법을 알게 되는데, 우선순위에 따라서 수정하다보면 속도가 굉장히 빨라지는 것을 느낄 수 있다. 데이터를 읽어내는 속도, 즉 사이트의 데이터가 무거우면 당연히 보여지는 우리의 모니터에서 느리게 뜨는 것이다. 즉, 사이트를 가볍게 만들어줘야한다. 다이어트 하라는 소리 듣기도 지겨운데, 사이트까지 다이어트를 해야한다니 이 시대는 확실히 다이어트를 해야만 한다. 그것을 강요받든 받지않든 간에, 다른 문제가 발생하기 때문이다. 사이트를 느리게 하는 요인은 굉장히 많다. 티스토리의 경우 개인 스킨을 세팅하는 경우가 많이 있다. 하지만 이 개인스킨들을 잘 뜯어보면 나에게는 불필요한..
thumbnail 티스토리 각주다는 방법 (새 에디터) 기존 에디터에 내장되어 있던 기능인 각주 기능이 새 에디터에서는 별도의 코드를 입력해줘야한다. 사용방법은 간단하다. HTML 편집모드가 아닌 기본모드 에서 주석을 달고자 하는 단어 뒤에 설명문과 함께 코드를 입력해주면 된다. 각주(FOOTNOTE) 사용법 위와 같은 방식으로 작성을 하게 되면 쉽게 각주를 달 수 있다. 위의 사용방법을 통해서 작성을 하면 인연 식으로 표현된다. 각주 자체에 속성을 부여할 수 있어 글씨에 색상을 변경하거나 볼드처리 등을 할 수 있다. 각주에는 속성을 부여할 수 있다. 각주는 독자들로 하여금 단어나 키워드를 명확하게 설명할 수 있고 글을 깔끔하게 구성할 수 있는 활용도가 높은 기능이다. 각주는 본문 아래쪽에 부차적으로 내용을 추가할 수 있기도 하고, 글이나 참고한 자료를 밝히..
thumbnail 티스토리 신규스킨 'Magazine' 리뷰 이번 4월달에 티스토리에서 신규스킨이 업데이트 되었다. 이전 스킨들보다 훨씬 늦게 업데이트 된 만큼 기대가 컷었다. 신규스킨이 나오면, 이 신규스킨으로 새로운 티스토리를 운영하겠다고 생각했다. 그래서 신규스킨이 나오고 조금 살펴보다가 이전에 있었던 안쓰는 티스토리 사이트를 삭제하고 새로운 사이트를 개설했다. 최근에 게임도 열심히 했으므로, 게임 사이트로 운영하려고 한다. 물론, 인기있는 게임은 아니라서 조회수가 어떻게 유지될지는 모르지만 그래도 꽤 오래된 게임이고 매니아층이 형성되어 있는 게임이다. 또 예전에 나 역시도 정말 재밌게 했었던 게임이기때문에, 꼭 게임블로그를 한번 해보고 싶다는 생각은 항상 있었는데, 이번 기회에 개설을 했다. 아직 글을 많이 작성하지 않아서 구성은 조금 어설프지만, 기본적으..
thumbnail 사이트 디자인을 새롭게 개선하였다. 기존에 티스토리에서 제공하는 스킨을 버리고 최대한 심플하고 간단한 스킨을 다운로드하여 일부 디자인과 기능들을 모두 수정하였다. 항상 느끼는 거지만, 공식 스킨을 다운로드하여도 오류가 있기 마련이고 무엇보다 가장 큰 문제는 사이트 최적화가 되지 않는 것이었다. 공식적으로 제공이 된다는 것은 많은 사람들이 다양한 기능을 활용할 수 있도록 많은 기능을 넣었고, 하다못해 테마의 컬러까지도 각 코드를 모두 넣었기 때문에, 필연적으로 사이트가 무거워질 수밖에 없다. 많은 사람들이 간과하는 것이 바로 속도이다. 한국에서야 워낙 인터넷 환경이 잘 갖춰져 있어 쉽게 체감할 수 없지만 구글의 툴을 이용해서 사이트 속도를 체크하면 SEO 점수에서 감점을 받는다. 그 이야기는 티스토리와 같이 플랫폼의 검색 점유율이 낮고 구글..