190603 티스토리 스킨 #12 제작일지

190603 티스토리 스킨 #12 제작일지

제일 큰 변화입니다. css 변수를 사용하다, 간단하게 스킨 설정에서 테마를 변경할 수 있도록 html의 class를 건드려서 테마가 변경되도록 했습니다. .element {color:#fff}.theme-something {color:#000} 뭐 이런 방식을 사용했는데, 이 방식을 사용하니 테마 하나 추가하자니 수정할 css가 산더미라 새로운 방식을 사용하게 됐습니다. 테마를 변경하면 html에 선언해둔 변수들의 내용만 달라지며, css는 이 포스트에 작성했던 방식처럼 한 줄만 써두면 됩니다. 모바일에서 imgur 이미지를 첨부하려니 힘들더라고요.그냥 imgur의 링크를 첨부하면 알아서 이미지로 변환해서 보여주도록 했습니다. 다음 페이지를 로딩할 때 나오는 이미지를 이 포스트에 작성한 이미지로 변경했..
티스토리 반응형 스킨 #13 Kiss Me

티스토리 반응형 스킨 #13 Kiss Me

주소 : https://kissme2145.tistory.com/ 아래 이미지들은 제 테스트 블로그에서 찍은 스크린샷입니다. 세분화된 색상 설정으로 간단하게 색상을 변경할 수 있습니다. 커버 화면의 모습입니다. - 썸네일을 작게 4개씩 보여주는 리스트- 썸네일을 1:1 비로 보여주는 리스트- 배경에 썸네일이 들어간 리스트- 갤러리형 리스트 총 4가지로 구성되어 있습니다. 좌측 드로워엔 - 관리자 프로필- 구독, 이웃 추가, RSS 링크- 링크 목록- 방문자 수- 티스토리 메뉴바 로 구성되어 있고 우측 드로워엔 - 홈, 방명록, 공지사항 바로 가기- 카테고리 목록- 최근 글- 최근 댓글 로 구성되어 있습니다. 각 드로워의 배경엔 이미지가 3개씩 슬라이드쇼로 표시됩니다. 글 목록에선 썸네일을 1:1 비로 보..
190530 티스토리 스킨 제작일지

190530 티스토리 스킨 제작일지

BGM 플레이어 비디오를 클릭하면 비디오를 전체 화면으로 보여줍니다.다시 한 번 클릭하면 전체 화면이 취소됩니다. 키보드 이벤트도 추가했습니다.O - 랜덤 영상 재생P - 비디오 일시 정지 / 재생[ - 볼륨 업] - 볼륨 다운 새 글 알림 변경 기존엔 Masonry 리스트에서만 1px짜리 테두리로 새 글을 표시했는데, 이젠 모든 리스트에서 딸기로 새 글을 표시합니다. 자동 다크 모드 오후 6시부터 오전 7시까지 자동으로 블로그에 다크 모드가 적용됩니다.
스킨 변경

스킨 변경

뭐 예전처럼 스킨을 변경하며 엄청나게 큰 변화를 준 건 아니라서, 얼핏 보면 바꾸긴 바꾼 건가 싶을 수도 있긴 합니다.어제 만들기 시작해서 오늘 완성한 스킨이라, 뭘 많이 바꿀 시간도 없었긴 합니다..ㅋㅋㅋ 가장 큰 변화는 - 각종 디자인 변경- 스크립트 최적화 이 두 가지를 꼽을 수 있겠네요. 디자인 변경점 글 화면도 그렇고, 전반적인 페이지에 배경 그래디언트를 제거했습니다.큰 의미가 있는 건 아니고, 거의 항상 배경에 사진을 넣건 그래디언트를 넣건 해왔던 것 같아서 이번엔 다른 느낌을 주고자 제거해봤습니다. 배경에 뭔가 특별한 게 없으니 예전처럼 이렇게 배경과 컨텐츠가 들어가는 부분이 분리되지도 않습니다. 배경 그레디언트를 제거하고 배경과 컨텐츠 경계를 없앤 원인 중 하나입니다.예전엔 배경 이미지가 ..
190403 티스토리 스킨 #11 제작 일지

190403 티스토리 스킨 #11 제작 일지

아무래도 티스토리 메뉴바를 그냥 보여주는 건 영 별로인 것 같아 수정했습니다. 프로필 메뉴예전엔 드랍다운 메뉴로 보여줬지만, 이젠 왼쪽 드로워와 같은 방식으로 표시됩니다.마찬가지로 뒤로 가기 버튼을 누르면 사라집니다. 기타- 페이지를 최초로 불러올 때 잠깐 페이지가 버벅인단 느낌을 받았는데, 원인이 유튜브 썸네일을 불러오는 스크립트였습니다. 일단 해당 스크립트를 껐다 켤 수 있는 방향으로 수정했습니다.- 커버에 나오는 유튜브 영상을 조금 더 편하게 수정할 수 있도록 수정했습니다.- 드로워를 여는 버튼에 애니메이션을 적용했습니다.- 기타 잡다한 오류를 수정했습니다.
190327 티스토리 스킨 #11 제작 일지

190327 티스토리 스킨 #11 제작 일지

글, 카테고리마다 테마를 따로 지정할 수 있도록 업데이트했습니다. 먼저, 지금 블로그에 적용된 테마는 Lovely Heart지만 이 글엔 Cool Summer로 표시되고 있습니다. 또, 갤러리 카테고리로 가보시면 카테고리의 글 목록이나, 카테고리에 포함된 글에 모두 Dark 테마가 적용되어 있습니다. 예전에 작업한 카테고리마다 글 목록의 모양을 다르게 표시하는 것과 더불어 각 카테고리에 조금 더 생동감을 불어넣을 수 있게 됐네요. 아마 어두운 테마로 적용되게 하는 건 자주 사용하지 않을까 싶습니다 ㅋㅋㅋ
티스토리 반응형 스킨 Lovely Pink 2.0 배포

티스토리 반응형 스킨 Lovely Pink 2.0 배포

최신 버전 : 2.0.2 스킨 미리 보기 스킨 소개 사랑스러움이 묻어나는 분홍빛 스킨입니다. 반응형 스킨이며, 커버를 지원합니다. 방명록에도 사용자의 프로필 사진을 표시하며, 댓글에 유튜브 비디오, 이미지 등을 첨부할 수 있습니다. 또, 별다른 썸네일을 추가하지 않아도 본문에 유튜브 비디오가 있으면 자동으로 썸네일로 불러옵니다. 1.0 버전에선 댓글이나 방명록을 남기면 페이지가 새로 고침 됐지만, 이제는 새로 고침 없이 모든 스크립트가 작동합니다. 외에도 다양한 기능들을 지원하며, '스킨 옵션'을 통해 html / css / js에 대한 지식이 없더라도 간단히 수정하실 수 있습니다. 스크린샷 커버 아이템 총 4가지 입니다. 구매 국외 결제가 가능한 카드로 구매하실 수 있습니다. 아래 버튼을 클릭하시면 구..
190314 - 티스토리 스킨 #5 제작 일지

190314 - 티스토리 스킨 #5 제작 일지

꽤 오랫동안 안고 오던 문제를 해결해서 기분이 좋네요. 아직 완벽히 완성된 스크립트는 아닙니다만, 이제 더는 댓글에 변경이 생겨도 창을 새로 고침 하지 않습니다. 예전에 사용하던 스크립트에는 문제가 하나 있었는데, 이전 댓글을 불러오면 이전 댓글엔 스크립트가 작동하지 않거나(답글 버튼 복사 X, 시간 표시 변경 X, 이미지 / 비디오 등 자동 변경 X), 이전 댓글을 불러오자마자 페이지를 새로 고쳐버리거나 둘 중 하나를 택해야 했습니다. 이젠 그럴 필요 없이 이전 댓글을 불러와도 스크립트가 똑같이 작동합니다. 덤으로 인터넷 익스플로러에서 무한 새로 고침 되던 오류도 해결됐습니다. 완성되지 않은 스크립트라 기록한 이유는, 지금은 이 스크립트가 백그라운드에서 500ms마다 1회씩 작동합니다. 물론 스크립트가..
190307 티스토리 스킨 #5 제작일지

190307 티스토리 스킨 #5 제작일지

오류 수정 및 간단한 최적화가 대부분입니다. 댓글 디자인 변경 댓글 디자인을 살짝 변경했습니다.눈썰미가 굉장히 좋지 않고서야 발견하기 힘들긴 할 텐데, 예전엔 말풍선 꼬리가 직선으로 이뤄져 있었으나, 이젠 부드러운 곡선으로 이뤄져 있습니다. 유튜브 영상 일시정지이젠 인덱스 화면의 유튜브 영상의 소리가 꺼져 있다면, 영상이 스크롤 밖으로 나가는 순간 일시 정지됩니다. 오류 수정 인터넷 익스플로러에서 고정된(fixed) 요소들의 움직임이 부자연스러운 것을 해결했습니다. 아직 모든 요소엔 작업하지 않았고, 배너와 헤더에만 시범적으로 적용했습니다.유튜브 썸네일을 불러온 후에 간헐적으로 masonry가 재정렬되지 않던 오류를 해결했습니다.커버 슬라이더에 유튜브 썸네일을 불러오지 못하던 오류를 해결했습니다.간헐적으..
블로그 이사갔습니다 (클릭)