wordpress로 이사 고민 중

wordpress로 이사 고민 중

서버 쪽도 공부하고, 이것저것 파면 팔수록 저만의 사이트를 갖고 싶단 생각이 커지고, 티스토리 같은 서비스형 블로그가 갖는 본질적 한계 때문에 티스토리를 떠나고 싶단 생각이 미약하게 피어오르기 시작하네요.물론 무료로 이만한 서비스를 제공해주는 업체가 또 있을까 싶을 정도로 훌륭한 편이라 선뜻 떠나진 못하는 중입니다. 단점 중 가장 거슬리는 부분입니다. 수정할 수 있는 범위가 좁아 억지로 자바스크립트로 페이지를 뜯어 고쳐가며 사용하는 건 사실 크게 불만족스럽지 않지만, 제가 넣지도 않은 스크립트나 css가 페이지 곳곳을 채우고 있는 건 굉장히 거슬립니다.아무런 광고를 기재하지 않았음에도 페이지를 불러오면 Adguard가 요소를 차단했다고 표시되는 것도 썩 마음에 들지만은 않습니다.(지금은 유튜브 영상을 b..
티스토리 이미지 새 탭에서 열기

티스토리 이미지 새 탭에서 열기

위 사진처럼 클릭했을 때 이미지를 새 탭에서 열어줍니다.티스토리의 플러그인처럼 특정 크기 이상인 이미지에만 적용되지 않고 모든 이미지에 적용됩니다. 블로그에 우클릭을 막아뒀지만, 이미지의 다운로드를 막으려는 건 아닐 때도 쓸 수 있고, 다양한 경우에 쓸 수 있습니다. Vanilla JSArray.from(document.querySelectorAll(".imageblock>img")).forEach(a => { // 첨부파일 선택 방지 const d = document.createElement("a"), // 새 a 태그 생성 c = a.parentNode.parentNode; // .imageblock 부모인 p d.href = `${a.src}?original`, a.removeAttribute("o..
티스토리 에디터 없데이트

티스토리 에디터 없데이트

에디터가 없데이트되며 신규 에디터가 자동으로 선택되도록 했는데, 이 정도면 구 버전이 자동으로 선택되고 신규 에디터 사용 여부를 선택해야 맞는 게 아닐까 싶다. 장점이 적을 게 훨씬 적으니 장점부터 적자면 구 버전은 이미지를 이렇게 배열하면 css로 손을 봐줘야 반응형으로 작동했으나, 이젠 알아서 반응형으로 작동하도록 했다. 이미지 아래에 설명도 넣을 수 있도록 했다. 글에 슬라이드쇼를 추가할 수 있다. 슬라이드쇼는 장점에 적긴 했지만, css로 손보지 않으면 쓸데없는 여백이 생긴다. 보기 굉장히 불편하다. 단점 반응형 이미지의 부재 구 버전의 에디터로 첨부한 사진은 '반응형 웹스킨 이미지 최적화'라는 플러그인을 통해 사용자의 디바이스 크기에 따라 이미지의 크기도 유동적으로 변경됐다. 너비가 2000px..
티스토리 반응형 스킨 Summer Nights 2.0 배포

티스토리 반응형 스킨 Summer Nights 2.0 배포

드디어 배포하게 됐습니다.배포 준비하고 배포하기 1시간 전에 티스토리 툴바가 업데이트돼서 다시 작업하는 등 우여곡절이 많았네요 ㅠㅠ 소개상당히 많은 기능을 구겨 넣되 커스터마이징은 간단하게 할 수 있게 한 스킨입니다.다양한 기능 덕에 스킨에 생동감도 넘치는 편입니다. 자세한 기능 소개는 여기다운로드는 여기데모 블로그는 여기 1 버전에선 없던 기능인 커버를 사용해 홈 화면을 꾸밀 수 있습니다.커버 기능의 업데이트로 1 버전의 특색이던 홈 화면은 사라졌지만, 수정이 훨씬 쉬워지고 기능은 다양해졌습니다. 2단형에서 1단형으로 변경된 글 화면 한층 동글동글해진 댓글 목록.더는 이미지나 비디오 등을 위해 새로 고침 할 필요도 없어졌습니다. 3가지로 늘어난 글 목록의 디자인 2018년 8월에 처음 선보인 뒤로 엄청..
티스토리 반응형 스킨 #8 nekodev

티스토리 반응형 스킨 #8 nekodev

미니멀리즘 지향을 위해 오만 기능을 다 뺀 스킨.그 결과 압축 전 폴더 크기 69.8kb란 기염을 토했습니다. PC에서 사이드바가 좌측에 고정되도록 하고, 어두운 배경을 사용했습니다.
티스토리 반응형 스킨 #7 묘한 스킨

티스토리 반응형 스킨 #7 묘한 스킨

묘한 오빠님의 주문으로 제작된 스킨입니다. 글에는 summer nights 2.0을 많이 차용하되, 이곳저곳 요청대로 많이 뜯어고쳤습니다. 글 목록입니다.여백 없이 20개의 글이 화면을 꽉 채웁니다. 로딩이 완료되면 이런 식으로 이미지들이 드러납니다. 검은색을 바탕으로 무채색 계열의 색을 사용했으며, 헤더 카테고리를 중앙에 배치했습니다.배너의 이미지는 화면을 꽉 채우도록 했습니다. 1단형 스킨으로 만들며, 기존에 사이드바에 들어가던 요소들은 모조리 내비게이션으로 옮겨왔습니다.
티스토리 svg 아이콘

티스토리 svg 아이콘

티스토리의 업데이트된 로고입니다. 예전에 작업했던 자료랑 좀 안 맞아서 처음부터 했네요 ㅠㅠ아이콘 폰트용으로 작업해서 색상이 들어있지 않습니다. svg로 사용하시려면 fill을 이용해주세요.
티스토리 모바일 경로(/m)에서 강제로 원래 경로로 리다이렉트

티스토리 모바일 경로(/m)에서 강제로 원래 경로로 리다이렉트

들어가기에 앞서, 적용이 꽤 귀찮은 스크립트라 블로그 모든 글에 적용하기보다 특정 글들에만 사용하는 게 좋지 않을까 생각합니다. 모바일 페이지를 사용하지 않는다고 설정해둬도 페이지 생성 자체가 막히는 게 아니라서, 접근은 잘만 됩니다. 네이버 블로그는 구글에 검색하면 모바일 페이지로 노출되는 것도 엄청나게 많던데, 티스토리 블로그는 잘 모르겠네요. 여튼, 블로그에 적용한 스크립트 등 때문에 모바일 화면에서 보면 안 되는 글들에 설정해주면 꽤 유용하게 쓸 수 있지 않나 싶습니다. * 주의사항 글 목록 창에 나오는 글 미리 보기가 짧아서 스크립트가 미리 보기에 보이면 화면 전체가 이상하게 표시됩니다. 인덱스 ~ 귀찮아서 가 미리 보기입니다. 10 1시 방향에 html 클릭 > 글 제일 아래에 script 태..
티스토리 404 페이지에서 메인 화면으로 리다이렉트

티스토리 404 페이지에서 메인 화면으로 리다이렉트

404 페이지 확인 이 글 뒤에 이어서 작성하는 글입니다. 404 페이지를 꾸미는 방법은 여기서 확인해주세요. 12345678$(function() { var b = $(".article_container"), f = $(".absent_post").length, h = $(".article_container div"); 0 0) { setTimeout(function() { location.href = "/" }, 5000)}Colored by Color Scriptercs 핵심은 여기입니다. .absent_post의 개수가 0개를 초과하면, 5초 뒤에 "/" 경로로 이동하게 하는 스크립트입니다.5000을 수정하시면 리다이렉션되는 시간을 조절하실 수 있습니다.
1 2 3
블로그 이사갔습니다 (클릭)