본문 바로가기

티스토리

구글 웹폰트 적용하는 방법 티스토리 블로그에 폰트를 업로드하지 않고 웹폰트를 이용하여 내 블로그에 바로 폰트를 적용할 수 있습니다. 무료 웹폰트를 제공하는 Goole Fonts : https://fonts.google.com/?subset=korean 사이트에 접속하여 많은 폰트 중에 적용할 폰트를 선택합니다. 폰트를 선택하면 여러 미리보기가 나오는데 그중 'Styles' 항목에서 굵기 별로 미리보기가 있는데 해당 폰트 오른쪽에 '+Select this style' 선택합니다. 오른쪽에 설정 창이 열리면 를 '@import'로 변경하고 아래 두개 박스 내용을 복사해서 CSS 추가하여주면 됩니다. 웹폰트를 선택하였다면 블로그 관리로 가서 '꾸미기 → 스킨 편집 → html 편집 → CSS'를 선택하고 폰트 변경합니다. CSS 편집에.. 2022. 4. 12.

티스토리 블로그 작성글 발행 오류 블로그 운영 중 글을 작성하고 발행을 하면 발행 단계에서 오류로 인해 발행 및 저장이 되지 않는 경우가 있습니다. 글 완성하고 완료 버튼을 클릭하고 저장을 하면 '게시글을 작성하는데 실했습니다. 잠시 후 다시 시도해주세요'라는 에러 메시지가 나오면 저장이 되지 않습니다. 이 때는 임시저장도 안 됐던 거 같은데 이미지를 보면 게시글 정보에 섬네일이 표현되지 않고 있는데 이렇게 되면 저장이 가능한 경우도 간혹 있지만 거의 저장이 되지 않는 상태가 됩니다. 섬네일에 문제가 있으니 섬네일을 지워 주면 되는데 저는 대표 섬네일을 숨겨두기 때문에 HTML 지워야 하지만 숨김 처리를 하지 않았다면 모드 전환 없이 1번 사진 혹은 대표 사진을 지워줍니다. 따로 대표 지정을 하지 않거나 첫 번째 이미지를 대표로 사용해서.. 2022. 3. 31.

티스토리 이미지 숨기기, 세로 이미지 나란히 넣기 블로그에서 사진을 사용할 때 섬네일용으로 사용하는 이미지 숨기는 방법과 세로로 된 사진을 나란히 나오게 하는 방법입니다. 1. 티스토리 대표 이미지 숨기기 블로그에서 섬네일용 대표 이미지를 본문 내용에서는 노출되지 않기 위해서 제가 사용하는 방법입니다. 사진을 등록한 뒤 상단 메뉴 중 모드 메뉴에서 "HTML" 모드를 선택합니다. 검색이나 타 사이트에서 섬네일을 적용할 때 첫 번째 사진을 섬네일로 등록되는 경우가 많은 것 같으니 이미지 파일이 많을 경우 가능하면 첫 번째로 대표 이미지를 업로드하는 것이 좋아 보입니다. HTML 모드에서 이미지 치환자를 찾아 태그를 태그로 변경하고 display:none 속성도 추가해 줍니다. [＃＃_Image|kage@322Mw/btrlfdFytfK/dFyxtGu7aSV.. 2021. 11. 16.

CSS 텍스트 첫글, 첫줄 강조하기 블로그나 사이트를 운영하면서 제목이나 본문의 첫 글자 또는 첫 줄에 별도의 속성을 부여하여 강조나 디자인적인 효과를 낼 수 있는데요. 웹문서를 작성하면서 해당 문서의 글 색상, 크기 등의 설정을 변경하여 문서 특성을 살릴 수도 있지만 CSS 적용하여 일괄적으로 효과 적용이 가능합니다. :first-line { 속성값 } 글 중에서 첫 글에 별도로 속성을 부여할 수 있습니다. 티스토리의 경우 본문 첫 글자를 강조한 싶으면 스킨마다 다르지만 본문 내용 치환자를 감싸는 태그 클래스가 article일 경우 CSS에 .article:first-line { 속성값 }을 적용하여 첫 글을 강조할 수 있습니다. 첫글 강조하기 첫글 강조하기 보통 제목이나 본문 첫 글에 강조를 위한 폰트 크기와 색상을 변경하는 방식으로 .. 2018. 12. 31.

티스토리 공유 버튼 만들기 티스토리에서 제공하는 포트폴리오 스킨에 SNS 글 보내기 코드를 이용하여 사용 중인 스킨에 적용해 봤습니다. 이미지 처럼 페이스북, 트위터, 카카오 스토리, 카카오톡 공유버튼 만들기가 가능합니다. 공유 버튼 기능에 필수적으로 들어가는 코드들인듯한 것만 추려 봤는데, 적용하는 방법으로는 두 가지가 있는데 기본적으로 스킨의 각 위치에 삽입하는 방법과 티스토리 플러그인을 이용하는 방법입니다. 스킨을 수정하여 적용하는 방법 외부 문서를 불러오는 링크 태그는 HTML 사이에 넣어줍니다. icomoon.css의 역할은 각각의 아이콘을 만들어 주는데 신기하게 아이콘 이미지가 아닌 코드를 이용하여 만들어 표현합니다. 페이스북 트위터 카카오스토리 카카오톡 본문을 공유 버튼을 노출할 코드로 HTML 문서 내에 치환자를 찾.. 2018. 12. 30.

티스토리 Portfolio 스킨 SNS 공유버튼 만들기 티스토리가 제공하는 방응형 포트폴리오 스킨 본문 하단에 SNS 공유 버튼을 타 사이트나 블로그의 등에서 소스코드를 받아 복사할 필요 없이 HTML 편집만 조금 해주면 생성할 수 있습니다. 관리 > 꾸미기 > 스킨 편집 모드에서 상단 오른쪽 프리뷰 이미지 아래 'HTML 편집'을 눌러 코드를 수정할 수 있습니다. HTML 편집 모드에서 'Ctrl + F' 기능으로 'list_share' 문구를 이용하여 찾을 수 있으며 449 라인부터 454 라인까지 공유 코드로 주석 처리되어 있어 기본적으로는 노출이 되지 않습니다. 페이스북 트위터 카카오스토리 카카오톡 처리가 되면 코드가 노출이 되지 않기 때문에 웹상에 노출을 위해서는 제거를 해줘야 합니다. 붙은 것도 지워 주면 코드가 활성화되면서 속성 고유의 색으로 바.. 2018. 12. 28.

티스토리 사이드바 인기글 목록 추가하기 티스토리 블로그 사이드바에 조회 수 높은 순으로 글 목록을 적용할 수 있는 치환자가 추가되었습니다. 적용 방식은 최신 글 목록과 동일한 방식으로 전용 치환자를 사용하여 줍니다. : 인기글을 반복 출력합니다 : 글 주소 : 글 제목 : 글 댓글 갯수 : 작성자 이름 (*팀블로그용 치환자) : 글 발행시간 : 대표 이미지가 있는 경우 치환 : 대표 이미지 : 카테고리 이름 : 카테고리 리스트 url 인기글에 사용할 수 있는 치환자 목록입니다. 썸네일 치환자가 추가되면서 인기글에서도 썸네일 노출이 가능합니다. 이 블로그 인기글 기본 제공되는 샘플 코드로 ... 태그 사이에 추가하여 주면 사이드바에 인기글 목록이 추가 되게 됩니다. 스타일 코드 샘플은 제공을 하지 않기 때문에 직접 짜야 하는데 사용중인 최신 글.. 2018. 12. 21.

티스토리 블로그 사이드바 썸네일 치환자 적용 티스토리가 개편을 하면서 다양한 스킨과 추가적으로 사용가는 한 치환자들이 많이 추가되었는데요. 요즘은 사이드바를 사용하지 않는 1단 형 모바일 최적화된 신규 스킨들이 많이 사용하는데 개인적으로 PC 환경에서는 사이드바를 추구하는 편이라 고수하고 있는데 치환자를 지원하지 않을 때에도 스크립트를 추가하는 방법 등으로 적용은 가능하였지만 자체적으로 최근 글 목록에 섬네일을 사용할 수 있는 치환자가 추가되어 간편하게 적용을 할 수 있게 되었네요. 최근에 올라온 글 [＃＃_rctps_rep_title_＃＃] [＃＃_rctps_rep_rp_cnt_＃＃] [＃＃_rctps_rep_category_＃＃] 매뉴얼에 있는 기본 적용 HTML 코드로 사이드바에서 최근 등록된 글 목록을 보여주는 기능을 하는 기존 코드에 10.. 2018. 12. 14.

티스토리 애드센스 광고 언어 설정 구글 애드센스를 적용 중인 블로그를 운영하면서 영어로 된 광고가 간간이 나오는데 추가 코드를 삽입하여 한글로 된 광고가 노출되도록 설정해줄 수 있습니다. 두 개의 광고가 모두 영어로 나오고 있는데 방문자로 하여금 관심을 끌기 힘들어 보이고 영어를 잘 아는 한국인이라고 하여 저 광고가 관심이 생길까라는 의문이 듭니다. 기본적인 애드센스 코드에 다른 내용은 손댈 필요 없이'data-language=”ko” '만 추가해 주면 언어 설정을 한국어로 지정할 수 있는데 코드를 적용 후에도 한글 우선 적용 방식으로 영어 광고가 비중이 줄어들 뿐?? 차단되어 전혀 나오지 않는 것은 아니었습니다. 포스팅 주제와도 많은 관련이 있겠지만 체험상 인지도 낮은 블로그에서 영어된 광고가 많이 나오는듯하고 양질의 콘텐츠가 많은 블.. 2018. 8. 6.

티스토리 블로그 애드센스 플러그인 사용할 때 주의할 점 티스토리는 애드센스 광고 코드를 삽입하기 편하게 플러그인을 제공하고 있습니다. 이는 스킨에 직접 적용하지 않기 때문에 스킨을 잘못 건드리는 일이 없을뿐더러 스킨을 변경하여도 자동적으로 적용이 되는 등의 적용법을 잘 모르더라도 어려움 없이 사용할 수 있는 편리함을 주는데요. 반응형 코드를 적용할 때 지동으로 적용하지 않고 사이즈별로 크기를 지정하는 스타일 코드를 같이 삽입 하였을 때 코드가 RSS 피드에 그대로 노출이 되는 문제 발생합니다. RSS 받아보면 내용보다는 상단 플러그인에 적용된 미디어 쿼리가 노출되어 본문은 전혀 보여주지 못하고 오른쪽 앱의 경우에는 일부 애드센스 코드까지 포함되어 보이고 있네요. 왼쪽 이미지를 보면 반응형 코드를 모두 제거하고 광고 코드만을 적용하였는데도 일부 코드가 노출되고.. 2018. 7. 31.

티스토리 블로그 이름 변경 티스토리에서 블로그를 개설해서 하다 말다 운영을 반복하면서 6년 정도 지난듯합니다. 처음에 이름도 대충 만들었고 분위기도 바꿀 겸 블로그 이름을 변경하려니 여러 검색, 포털 사이트에 노출에 영향이 있지 않을까 하여 검색을 해봤는데 관련 내용을 찾기 힘들더군요. 어렵게 검색한 몇 안 되는 내용에는 웬만하면 손대지 마라가 대부분이 더라고요. 스킨만 바뀌어도 노출에 영향을 줄 수 있다는 말을 많이 들어 블로그 이름도 스킨에서 정보를 주는듯한데 그나마 오던 방문자 유입도 안될까 겁이 나서 살짝 망설였는데 뭐 일 방문자가 많은 것도 아니고 변경해보기로 했습니다. 티스토리는 PC든 모바일 앱이든 간단하게 이미지, 이름, 정보 변경이 가능하도록 되어 있습니다. 블로그 제목을 변경을 한 후 내용이 적용이 되는 데는 하.. 2018. 7. 19.

티스토리 반응형 스킨 이미지 가로로 나열하기 티스토리 반응형 스킨을 사용하는 블로그에서 이미지 2장 또는 3장을 나란히 배열하는 방법입니다. 잘 만들어진 스킨에서는 자동으로 조절이 될 수도 있으나 스킨에서는 사이즈를 자동 조절해 주지 못하는 경우에 나름 유용할 것 같네요. HTML 모드에서 수정이 필요하기 때문에 이방법을 사용하기 위해서는 약간의 HTML을 사용할 줄 알아야만 적용이 가능합니다. 티스토리에 이미지를 등록하고 HTML 모드로 확인 해보면 [＃＃_1N|cfile7.uf@992E1C425A843D3C3DEB4q.jpg|width="226" height="127" filename="DSCF2490.jpg" filemime="image/jpeg"|_＃＃] 이런 치환자가 생성 되는데 이를 수정하거나 부모 태그 등을 수정하여야 합니다. 티스토리.. 2018. 2. 15.

티스토리 블로그 사이드바에 추천글 목록 추가하기 티스토리 블로그에서 특정 글을 사이드바에 최신 글 목록이 아닌 공지사항처럼 별도로 뽑아서 따로 분리하여 넣는 간단한 방법입니다. 사이드 바 최신 글 목록은 시간이 지나고 글 수가 많아지면서 자연스레 묻히게 되는데 인기글이나 추천하고 싶은 글을 간단하게 따로 모아서 사이드바에 목록을 만드는 방법으로 스킨 수정이 가능하다며 직접 스킨에다가 삽입을 해도 되는데 스킨수정없이 좀 더 간단하게 사이드바 모듈을 이용해서 만드는 방법입니다. 사이드 바 구글 검색 창 아래에 추천글 바로 가기를 만들어 넣으려고 합니다. 글쓰기로 들어와서 적당한 글 박스를 고르고 박스 안에다가 글 제목을 입력합니다. 새 탭을 띄워 추천할 글의 주소를 복사합니다. 글 주소를 알고 있으며 직접 작성이 가능하다면 이과정은 패스합니다. 제목을 드.. 2018. 2. 8.

티스트로 블로그 멀웨어 또는 악성코드로 인한 유해한 사이트 언제부터인가 크롬에서 첨부한 파일을 다운로드하려면 멀웨어 또는 악성코드 어쩌고 하면서 시뻘건 배경이 나오면서 위험한 사이트라더군요.. 티스토리 몇몇 블로그 및 제 블로그가 크롬에서 접속도 못하는 상태가 잠깐 있기도 하였기에 작은 오해 이거니 하며 자연스레 해결될 줄 알고 그간 방치했는데 파이어 폭스에서도 같은 현상이길래 심각성을 깨닫고 불야불야 문제 해결에 나섰네요... 검색해보면 '올블릿'이나 '플러그인' 또는 기타 광고로 인한문제로 저는 해당사항이 없습니다. 몇몇 프로그램 빼고는 레인미터 스킨 및 대부분의 파일을 위와 같은 경고를 하며 다운로드하지 말라고 합니다. 구글 웹마스터(https://www.google.com/webmasters/tools/home?hl=ko) 도구도 오래전부터 사용 중이고 .. 2017. 1. 6.

티스토리 Callback 플러그인 오류 얼마 전 다른 분의 스킨이 폭은 문제가 없는데 가로 스크롤이 자꾸 생겨 고생 끝에 콜백 플러그인을 해제하고 해결됐다는 말을 듣고 스킨과의 충돌 때문인 줄 알았는데 그게 아이었던 모양입니다. 파이어 폭스로 스킨에 문제가 없는지 확인 중 모든 글에 일정한 길이의 세로줄이 생겨 한참 해 멨는데 콜백 플러그인과 Flash Player 간의 문제였나 봅니다. 위처럼 본문 우측에 시커먼 세로줄이 생깁니다. 박스 문제인 줄 알았는데 일정한 위치도 아니고 모든 페이지에 위와 같은 줄이 생기는데 자주 사용하는 크롬에서는 안 보이니 낯선 파이어폭스로 요소 검사 일일이 찍어가며 border 때문일 거라는 확신을 가지고 아무리 찾아봐도 없어 엄청 고생했네요. 본문에 'overflow: hidden' 속성을 제거 하는순간 넓적.. 2016. 12. 28.

티스토리 블로그 꾸미기 (사이드바 모듈 접기,펼치기 제이쿼리) 블로그를 하면서 글 작성 시 내용을 그리 길게 적기 않기에 본문에 비해 사이드바가 상당히 길어 사이드 바를 깔끔하게 보고자 오랜 시행착오 끝에 제이쿼리를 이용해 제목을 클릭 해면 열리고 그 외 다른 모듈들은 닫히는 방식으로 완성한 소스를 공유합니다. 정식으로 배운 적이 없기에 여러 메뉴를 만들어 주는 사이트나 지식을 공유하는 블로그 등지를 돌아 봤지만 티스토리 사이드바와 비슷한 환경의 소스가 없어 매우 고생하며 만들었네요.. Category Recent Post . 제가 사용하는 스킨의 사이드바 환경입니다. 위와 같은 방식에 클래스명이 다를 경우 제이쿼리에서 그에 맞게 클래스명을 부여해주면 되지만 구성이 다를 경우 HTML을 수정하던지 적용이 어려울 수 있겠습니다. H3를 클릭하면 'ul' 태크를 펼치거.. 2016. 12. 26.

CSS 마우스 오버 효과 (이미지 확대) CSS 속성으로 이미지에 마우스를 올렸을 때 이미지가 확대되는 효과로 여러 사이트나 블로그 등지에서 링크 걸린 썸네일 이미지에 많이 사용되고 있는 방법입니다. transform:scale 값을 hover 와 다른 값을 적용하여 마우스를 올렸을대 크기를 변경하고 transition으로 변경되는 속도를 조절하여 효과를 극대화합니다. 아래 이미지에 마우스를 올리면 효과를 확인할 수 있습니다. .sample_image img { -webkit-transform:scale(1); -moz-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); transform:scale(1); -webkit-transition:.3s; -moz-transition:.. 2016. 12. 25.

제이쿼리 탑버튼 여기 저기서 이런 저런 방법들을 모아 짜집기해서 만들어 본 탑 버튼 소스입니다. css편집이나 HTML에 태그 추가등의 작업 없이 사이나 위에 스크립트 소스만 추가하면 되는 방법입니다. 많은 스킨에 적용해보진 않았지만 대부분의 스킨에서 잘 작동할것 같습니다. 123456789101112131415161718192021222324252627282930 $(document).ready(function() { $("body").append("▲ TOP"); var top = $(".return_top"); $(window).scroll(function () { if ($(this).scrollTop() > 120) { top.slideDown(); }else { top.slideUp(); } }); top.c.. 2016. 12. 24.

티스토리 첫 페이지 꾸미기 - 인덱스 페이지 티스토리에 소흘한 동안 새로운 치환자가 생겨 티에디션이나 제이쿼리등의 도구없이 첫페이지를 썸네일과 함께 목록을 만들 수 있는 인덱스 페이지를 꾸밀수가 있게 되어 한 보름정도 정신없이 주물러 봤습니다. 2-8-7. 퍼머링크 페이지 / 인덱스 페이지 링크를 따라 가시면 가이드를 확인할수 있습니다. 미력하나마 제가 꾸며본 속성이 도움이 되어볼까 하고 공유합니다. 사이이드바, 헤더, 풋터를 제외한 본문을 구성하는 내부 최상단에 ... 인덱스 영역을 지정합니다. 바로 붙여서 그 외 나머지 부분을 전부를 ... 퍼머링크로 지정하여 본문 고유영역을 만들면 http://speedinkland.com/327 와 같이 글 주소가 붙지 않은 http://speedinkland.com 같은 카테고리, 검색 등의 주소에서는 본.. 2016. 12. 22.

Color Scripter 소스코드 강조하기 HTML, CSS, Java Script, Php 등의 소스 등을 블로그 등에 게시할 때 여러 편집기들처럼 코드에 컬러를 부여해 가독성을 높여주는 아주 유용한 도구입니다. 소스 등을 보여줄 때 기존에는 SyntaxHighlighter 라는 도구를 설치하여 사용하였지만 Color Scripter를 이용하면 설치 등의 불편함이 없이 HTML 수정이 가능한 게시물이라면 어디에서나 사용 가능해 보입니다. 인터넷 브라우저에서 바로 사용 가능한 웹 버전과 PC에 프로그램을 다운로드하여 사용하는 PC 버전 두 가지고 사용 제한 없는 무료이며 기부를 받고 있습니다. 컬러 스크립터로 코드를 작성한 뒤 우측 하단의 복사 버튼을 클릭 후 작성 중인 문서에 붙여 넣기만 하면 깔끔하게 적용되고 3가지 스타일과 간단한 설정 기능.. 2016. 12. 19.

반응형 블로그 동영상 자동 크기 조절 방법 반응형 블로그에서 유튜브 등의 사이트에서 링크가 아닌 바로 시청이 가능한 소스를 가져올 때 동영상 크기가 맞지 안아 본문 범위를 벗어나 잘리거나 다른 영역을 침법 하는 경우가 있는데 유동적인 넓이에 따라 동영상의 사이즈도 같이 가로, 세로 조절되게 하는 제가 아는 두가지 방법입니다. 1. CSS 속성 예전에 외국 어느 사이트에서 퍼온 방식으로 작성중인 글에 동영상을 삽일 할때 동영상 소스를 동영상 코드 태그로 감싸줍니다. .video { position: relative; padding-bottom: 56.25%; height:0; overflow:hidden; } .video iframe, .video object, .video embed { position: absolute; top: 0; left:.. 2016. 12. 19.

티스토리 섬네일 카테고리 글 더보기 기존 카테고리 더 보기 기능은 플러그인으로 이미지 없이 단순 목록으로만 지원하여 섬네일 기능을 지원 사이트등을 돌며 제공하는 코드를 적용해봤지만 로딩 속도도 느리고 광고도 나오고 관계없는 이미지들이 링크되어 포기하고 있었는데 여러 블로그를 돌면서 썸네일 방식의 카테고리 글 더 보기를 사용하는 걸 보고 티스토리에서 기본 제공하는 반응형 스킨 #2 새로운 치환자를 사용하는 부분을 가져와 약간을 수정을 거처 섬네일을 지원하는 카테고리 글 더 보기를 적용해봤습니다. '' 카테고리의 다른 글 : more .tit_related { font-size: 12px; color: #222; margin-left: 3px; } .link_more { float: right; font-size: 13px; color: #a.. 2016. 12. 2.

티스토리 블로그 네이버 검색 RSS 피드 등록 티스토리 블로그는 다음에는 RSS 자동 등록되어 노출이 되지만 네이버의 경우 글을 10개 정도 작성하고 운영 중이면 짧게는 1주일 길게는 한 달 정도 기다리면 자동으로 검색 피드 등록되어 유입이 발생하더군요. 하지만 자동 등록되지 않는 경우도 많고 자동 등록되기 만을 마냥 기다릴 수도 없기에 수동으로 검색 등록하여 노출되게 하는 방법입니다. 신청을 하여도 블로그 내용이 불건전하거나 하는 등의 이유로 검색 노출이 되지 않거나 등록 거부 당할 수도 있습니다. 네이버 메인 페이지 하단에 "고객센터" 또는 검색 중 블로그 더 보기를 선택하면 "외부블로그 RSS 등록"이 나오는 등록을 클릭하여 고객센터로 접근합니다. https://help.naver.com 고객센터에서 "검색 등록" 항목이 아닌 "블로그"를 선택.. 2014. 11. 10.

티스토리 블로그 2차 주소(독립 도메인) 연결 티스토리 2차 주소를 연결하면 블로그의 브랜드 화 등의 장점과 기존 검색에 노출되던 1차 주소 와 중복 처리되어 유사 문서, 검색 누락 등의 네이버 노출 문제로 인한 방문객 감소라는 큰 불안감으로 인해 오랜 시간 독립 도메인을 같고 싶어 갈등하였는데 저품질 블로그 걸려 검색하면 글들이 최소 3페이지 레인 미터 관련 글은 7폐지로 밀려 방문자가 어마 무시하게 줄어 이번 기회에 도메인을 구입하였습니다. 방문객 감소라는 불안감은 없으니까요....; 1차 주소 speedink.tistory.com을 줄여 speedink.com로 하고 싶었지만 이미 사용 중이라 speedinkland.com를 구매하고 연결하였는데 티스토리 연결을 지원하지 않아 "2차 블로그 주소가 티스토리를 가르치고 있지 않습니다." 메시지로 .. 2014. 11. 3.

블로그 영어 한글 폰트 따로 지정하기 블로그를 운영하다 보면 영어를 종종 사용하는데 한글 폰트를 사용하면 영어 표현이 조금 아쉽고 영어 폰트를 사용하면 한글이 아쉽고 영어 폰트를 사용하면 한글은 굴림으로 표현되는 것 같은데 굴림 폰트가 마음에 든다면 문제가 없지만 나눔 고딕을 좋아하는 저로선 나눔 고딕의 영어체가 영 마음에 들지 않아 검색을 해봐도 영어와 한글 폰트를 별도로 지정하는 방법은 없다는 결론이더군요. 낙심하고 있던 중 블로그 스킨을 보면 여러 폰트를 지정하고 사용하는 것을 보고 힌트를 얻어 적용해 보았습니다. font:12px/1.5 '돋움', 'dotum', 'Tahoma', 'AppleGothic', Sans-serif; 티스토리 기본 스킨중 하나의 스킨에 적용된 폰트 속성입니다. 폰트가 순서대로 나열되어 있는데 방문객이 "돋.. 2014. 10. 22.

티스토리 블로그 갤러리형 목록/썸네일 목록/사이드바 썸네일 티스토리 블로그는 티에디션 이외에는 공식적으로 썸네일 이미지를 지원하지 않기에 첫 페이지를 제외하고 검색이나 카테고리 목록 등에는 글 제목만으로 표현할 수 밖에 없습니다. 하지만 요즘은 티스토리용 반응형 스킨도 잘 만들어져 티에디션을 사용하지 않고도 블록으로 된 이미지 목록도 표현하고 사이드 바에도 썸네일과 함께 글 목록이 나오고 하여 방법을 찾다가 yongzz 사이트를 발견하고 공개된 jQuery 소스 사용하여 블로그 디자인에 맞게 이리저리 수정 적용한 결과 매우 만족하게 사용 중입니다. 현재 블로그에 검색 또는 카테고리 선택시 보여지는 목록입니다. 글 작성시 지정한 대표 이미지가 보여지고 이미지가 없을 때 카테고리의 블로그 이미지가 노출되는 등 약간의 문제가 있으나 뭐 매우 만족하고 사용 중입니다. .. 2014. 10. 16.

티스토리 SyntaxHighlighter 오류 <span> 블로그에서 소스코드를 깔끔하게 표현해주는 SyntaxHighlighter 사용하다 보면 스킨의 문제인지 가끔 위 이미지처럼 span 태그가 생겨 의도치 않은 코드를 보여 주더군요. 문서 편집기 HTML 모드에서 SyntaxHighlighter 소스코드에서 태그로 줄 바꿈 하는 것을 태그 지우고 엔터키로 직접 줄 바꿈을 해주니 span 태그가 생기는 문제가 사라 지더군요 위 이미지 처럼 태그를 빼고 직접 줄 바꿈 합니다. 속썩이던 span 태그가 사라졌습니다. 2014. 9. 30.

이전 1 2 다음

티스토리툴바