본문으로 바로가기

티스토리 스킨

해당되는 글 34
  • thumbnail
    IT & 기타/티스토리 (2)

    티스토리 스피드 스타 스킨: 유튜브 영상 아래 여백 제거하기

    이 티스토리 블로그에는 현재 스피드 스타(Speed Star)라는 스킨이 사용되고 있습니다. 얼마 전부터 유튜브 영상 링크로 유튜브 동영상을 삽입하면 영상 아래에 여백이 표시되는 문제가 발생했습니다. 이전에는 발생하지 않았는데, 카카오 데이터센터 화재 사건 이후에 티스토리가 업데이트되면서 이런 문제가 발생하는 것 같습니다. 티스토리 스피드 스타 스킨: 유튜브 영상 아래 여백 제거하기 스피드 스타 스킨에서 유튜브 영상 삽입 시 위의 그림과 같이 아래에 여백이 표시된다면 꾸미기 » 스킨 편집 » HTML 편집 » HTML 섹션에서 [****]을 검색하여 바로 위에 다음 코드를 추가하면 문제가 해결될 것입니다. .resvid {padding-bottom:0;} 다음 그림과 같이 추가하시면 됩니다. 스피드 스타..
  • thumbnail
    IT & 기타/티스토리 (2)

    스피드스타 스킨: 본문 제목 드래그 방지 해제

    이 블로그에는 스피드스타라는 티스토리 스킨이 적용되어 있습니다. 지난달 카카오 데이터센터 화재 사건 이후 일부 기능이 작동하지 않는 문제가 발생했지만 최근 스피드스타 개발자께서 버그를 패치한 업데이트를 내놓았습니다. 스피드스타 스킨에서 글 제목에 드래그 방지 코드가 적용되어 있어 제목을 선택하여 복사할 수 없습니다. 이 점이 불편한 경우 드래그 방지 코드를 제거하여 본문 제목이 선택 가능하도록 설정할 수 있습니다. 스피드스타 스킨: 본문 제목 드래그 방지 해제 스피드스타 스킨에서 본문 제목을 선택할 수 있도록 변경하려면 스킨 편집 » html 편집 » HTML 탭에서 다음 코드 부분을 검색합니다. title{font-weight:700;word-break:break-all;margin:25px 0;lin..
  • thumbnail
    IT & 기타/CSS (6)

    text-decoration-color를 사용하여 링크 밑줄 색상 변경하기

    링크의 밑줄 색상은 text-decoration-color라는 CSS 속성을 사용하여 설정할 수 있습니다. 그러면 밑줄 색상을 텍스트 컬러와 다르게 설정하는 것이 가능합니다. text-decoration-color를 사용하여 링크 밑줄 색상 변경하기 기본적으로 밑줄(underline) 컬러는 링크의 텍스트 컬러와 동일하게 설정됩니다. 그러나 링크의 텍스트 색상과 다르게 밑줄 색상을 변경하고 싶은 경우가 있습니다. 이를 위해 대부분 border-bottom 속성을 사용하여 밑줄과 비슷하게 설정해왔습니다. 그러나 border 방법을 사용하지 않고 직접 밑줄 색상을 변경하는 방법이 있습니다. 바로 text-decoration-color 속성을 사용하여 텍스트 데코레이션(이 경우 밑줄)의 컬러를 변경할 수 있습..
  • thumbnail
    IT & 기타/티스토리 (2)

    티스토리 스피드스타 스킨에서 다크모드 전환 버튼을 상단으로 이동시키기

    스피드스타 스킨에서는 다크모드로 전환하는 기능이 제공됩니다. 이 블로그에서는 눈 피로를 줄이는 데 도움이 되도록 다크모드 강제 선택 모드를 활성화했습니다. 다크모드가 부담이 되거나 마음에 들지 않으면 상단의 라이트모드-다크모드 전환 버튼을 사용하여 라이트모드로 바꿀 수 있습니다. 티스토리 스피드스타 스킨에서 다크모드 전환 버튼을 상단으로 이동시키기 스피드스타 스킨에서는 라이트모드-다크모드 전환 버튼이 글 제목 아래에 표시됩니다. 다크모드 전환 버튼을 상단으로 이동하는 것도 고려해볼 수 있습니다. 라이트모드가 활성화된 상태에서 전환 버튼을 클릭하면 다크모드가 활성화됩니다. 라이트모드-다크모드 전환 버튼을 상단에 표시하는 방법으로 크게 두 가지를 생각할 수 있습니다. HTML 편집에서 전환 버튼 관련 코드를..
  • thumbnail
    IT & 기타/티스토리 (4)

    티스토리 스킨: 다크모드가 강제로 표시되도록 설정했습니다

    이 티스토리 블로그에 적용된 스킨에는 다크모드로 강제적으로 설정하는 옵션이 있습니다. 처음 접속하시면 다크모드로 기본적으로 표시되도록 설정했습니다. 원하시는 경우 "라이트모드"로 전환하실 수 있습니다. 티스토리 스킨: 다크모드가 강제로 표시되도록 설정했습니다 이 블로그에는 속도가 비교적 빠른 스피드스타(Speed Star)라는 스킨이 적용되어 있습니다. 스피드스타에는 티스토리 스킨 중에서는 비교적 많은 옵션을 제공합니다. 이 스킨은 다크모드도 지원하는데요. 스킨 편집에서 '강제 다크모드 선택'을 활성화했습니다. 이 때문에 처음 이 블로그에 접속하시면 '다크모드'가 기본적으로 표시됩니다. 하지만 제목 아래의 라이트모드/다크모드 전환 표시줄에서 라이트모드로 전환이 가능합니다. 시력 보호를 위해서는 '다크모드..
  • thumbnail
    IT & 기타/티스토리

    티스토리 스피드스타 스킨 커스텀 (자체 정리용)

    이 블로그에 스피드스타 스킨을 적용한 후에 몇 가지 커스텀을 적용했습니다. 티스토리 스킨의 경우 스킨 파일을 수정하면 추후 업데이트 시 수정된 부분을 다시 적용해주어야 하는 번거로움이 있습니다. 워드프레스는 차일드 테마를 설치하여 수정하면 테마가 업데이트되어도 수정 사항이 유지되는데, 티스토리에는 이러한 기능이 없어 불편한 것 같습니다. 이 때문에 업데이트가 나와도 다시 수정 사항을 적용해야 하기 때문에 업데이트된 스킨을 설치하는 것이 엄두가 나지 않는 경우가 많은 것 같습니다. 추후 스피드스타 스킨 업데이트 시에 참조할 수 있도록 여기에 정리해보았습니다. 티스토리 스피드스타 스킨 커스텀 공감 버튼 및 구독하기 버튼 스타일 변경 다음 CSS 코드로 스타일 변경 가능. .Please2,.urlurl2{di..
  • thumbnail
    IT & 기타/티스토리 (1)

    티스토리 블로그 코어 웹 바이탈 개선하여 검색엔진 유입 늘리기

    구글 서치 콘솔의 코어 웹 바이탈 보고서는 실제 사용 데이터(필드 데이터라고도 함)에 따라 페이지의 성능을 보여 것으로, 사이트 속도가 느릴 경우 방문자 이탈률에 심각한 영향을 미치게 되어 SEO에 불리하게 됩니다. 이 블로그의 코어 웹 바이탈 보고서를 체크해보니 다행히 모바일과 데스크톱 모두 느린 URL과 개선이 필요한 URL이 없는 것으로 나오네요. 티스토리 블로그 코어 웹 바이탈 보고서 구글의 코어 웹 바이탈 점수를 높이기 위해서는 사이트 속도 최적화가 필요합니다. 티스토리의 경우 속도와 관련하여 최종 사용자가 건드릴 수 있는 것이 제한적이어서 사이트 속도를 높이는 데 한계가 있을 수 있습니다. 사용자 입장에서는 이미지를 압축하여 이미지 크기를 줄이는 등의 노력을 할 수 있습니다. 그리고 무엇보다 ..
  • thumbnail
    IT & 기타/티스토리 (2)

    티스토리 스피드스타 스킨 적용(+이미지 자동 워터마크 기능 등)

    이 블로그에는 미니멀스타라는 유료 티스토리 스킨이 적용되어 있었습니다. 스킨 판매자께서 스피드스타 스킨 업데이트를 보내주셔서 미니멀스타에 추가한 커스텀 코드와 CSS를 스피드스타 스킨에 적용했습니다. 별다른 이상 없이 작동하는 것 같으므로 이제부터는 스피드스타 스킨을 사용해야 할 것 같습니다. 티스토리 스킨 업데이트 vs. 워드프레스 테마 업데이트 워드프레스에서는 차일드 테마(자식 테마)를 만들어서 커스텀하면 테마가 업데이트되더라도 추가로 할 작업은 없습니다. 초기에 이러한 점을 이해하지 못한 개발자나 사용자들이 부모 테마 파일을 직접 수정하는 바람에 업데이트를 하지 못하는 문제가 발생하기도 했습니다. 자식 테마를 만들어서 제대로 작업하면 워드프레스 테마가 업데이트되더라도 문제가 발생하지 않습니다. 하지..
  • thumbnail
    IT & 기타/티스토리 (3)

    티스토리 미니멀스타 스킨 커스텀 (개인 정리용)

    지난주 월요일에 티스토리 스킨을 미니멀스타로 변경하여 약 일주일 동안 세팅을 하였습니다. 미니멀스타는 많은 옵션을 제공하기 때문에 세부 옵션을 살펴보면서 세팅해야 하지만 저는 필수 설정을 한 후에 마음에 들지 않는 부분을 조금씩 수정했습니다. 추후에 미니멀스타 스킨이 업데이트되어 다시 수정해야 하는 경우를 대비하여 이 블로그를 커스텀하면서 수정이 필요한 부분을 정리해보았습니다. 워드프레스의 경우 차일드 테마를 만들어 작업하면 추후에 테마가 업데이트되더라도 수정 부분을 다시 추가할 필요가 없지만 티스토리의 경우 그런 시스템이 안 되어 있어 조금 불편한 것 같습니다. 티스토리 미니멀스타 스킨 커스텀 (개인 정리용) 1년 이상 무료 티스토리 스킨인 고래스킨을 사용하다 미니멀스타 스킨으로 변경했습니다. Mini..
  • thumbnail
    IT & 기타/티스토리

    티스토리 Square 스킨에 자동 목차 표시하는 방법

    티스토리 블로그의 모든 글에 자동으로 목차를 표시하는 방법을 이 블로그에서 설명한 적이 있었습니다. 해당 방법대로 해보면 Square 스킨에서는 클래스를 제대로 변경해도 목차가 제대로 표시되지 않습니다. Square 목차를 사용하는 경우 아래 내용대로 하면 목차가 자동으로 표시될 것입니다. 티스토리 Square 스킨에 자동 목차 표시하는 방법 티스토리 스킨에 목차를 자동으로 표시하는 기본적인 방법은 다음 글을 참고할 수 있습니다. 티스토리 블로그의 모든 글에 자동으로 목차 표시하는 방법 티스토리 블로그에 목차를 표시하려는 경우 목차 스크립트 파일을 이용하여 목차를 추가할 수 있습니다. 보통의 경우 목차를 표시할 자리에 수동으로 HTML 코드를 추가해야 하는데, 그러면 번거 avada.tistory.com..

    가성비가 뛰어난 웹호스팅

    저렴하고 가성비 좋은 웹호스팅

    [승인대기]

    💬sexwow18

    필요로 하시는 분들은 참고하시면 되실 듯 합니다^^

    💬空空(공공)

    정보 잘보고갑니다😄 워드프레스 저도 나중에 해봐야겠어요⋯

    💬짱짱맘s

    감사합니다~

    💬워드프레스, 웹호스팅 정보를 제공하는 블로그 Avada

    유용한 정보 감사합니다^^

    💬꿀복파파

    워드프레스 시작 가이드

    워드프레스 시작하기
    이모티콘창 닫기
    울음
    안녕
    감사해요
    당황
    피폐

    이모티콘을 클릭하면 댓글창에 입력됩니다.

    프리미엄 테마 그래픽 동영상 템플릿 무료 다운로드