본문 바로가기

Project <정리중>/Redesign the blog7

블로그 리모델링 - 7. 치환자는 두렵지않다 첫 시작에서 가장 막히다 못해 모든 작업을 일시 중단하고 처음부터 시작하게 만든 원흉이었습니다. 치환자. 정말 치가 떨리지만, 다시 한번 용기를 내어 접해보았습니다. 분명, 개념으로는 타 문서와 링크 시켜주는 import, src 를 통해서 하는 일종의 하이퍼링크 라는 건 알겠지만...장고의 악몽이 떠올라서 무섭네요. 티스토리 치환자 링크 는 처음 보면 공포 그 자체인데, 사실 정말 다행스럽게도 예시가 있습니다. 그리고 다른 선구자들이 일궈 놓은 작업 물의 흔적을 이리저리 참고해보며 계설을 해본 결과... 이런 코드가 나왔습니다. () | 는 티스토리 에서 작동하기 위해 필요한 필수 자바스크립트(이하 JS) 라고 합니다. 아래의 두 코드도 마찬가지이고요. 일단 다른 선구자가 해둔 뼈대를 빌려와서 옮겨 적.. 2021. 3. 10.
블로그 리모델링 - 6. 설계하고 시작해보기 아무리 머리 속으로는 훤해도 그걸 매번 한게 아닌 이상, 점검대(checklist board) 가 필요한 법 입니다. 정말 계획대로 밀고 나가고 싶다면 더더욱 그렇습니다. 그래서 이리저리 알아보던 중, 공통된 사항을 발견했습니다. 바로 티스토리 블로그의 '스킨 파일 구조'. SKIN ─┬─ index.xml ├─ skin.html ├─ style.css ├─ preview.gif ├─ preview256.jpg ├─ preview560.jpg ├─ preview1600.jpg └─ images ─┬─ script.js ├─ background.jpg ├─ background.jpg └─ background.jpg 이것이 티스토리 스킨 적용을 위해 요구되는 '파일 구조' 이다. index.xml 은 위 '.. 2021. 3. 10.
블로그 리모델링 - 5. 일시 중단, 중간 점검 기존의 vscode 에서 미리 테스트 한 것과는 달리, 티스토리 서비스에 맞게 적용이 안되니 매우 답답한 심정이었습니다. 그래서 진행하던 걸 중단하고, 과감하게 처음으로 되돌아갔습니다. 이건 시간을 두고 연구 해 봐야 할 내용인 것 같네요. 우선 타인이 어떻게 한 건지를 좀 더 참고 하면서, 블로그 재 개장은 천천히 해 나가고자 합니다. 이번에는 미리 레이아웃을 구상 해 두고, 저녁 까지만 해보기로 했습니다. 오후 4시에도 아무런 진척이 없다면, 리엑트를 배우면서 블로그 스킨은 연구하는게 좋을 듯 하네요. 지금은 뭐든 안 배우면 제일 아쉬운 순간이라는 생각이 듭니다. 2021. 3. 10.
블로그 리모델링 4. 현재 작업중 그럼 지금의 최우선. 1. 기존에 존재하는 것의 효과 변경 (CSS) - 반짝이는 효과? 2. 기존의 레이아웃 에다가 새 container 를 삽입. 대표 화면 전환 or 비디오 재생 삽입. (html) - 일단 gif 고려. 3. 새로고침 하면 어느 화면의 스크롤 위치에 있던, 맨위로 자연스럽게 올려버리는 애니메이션 적용. (JS) 당장 가능한 것. 1. 웹폰트 변경 (당장 가능한 것) A. 구글 폰트 2. 메뉴 및 카테고리에 마우스 커서를 올리면 변화하는 애니메이션 삽입. (CSS) [* 네온 이펙트] 3. Pregress bar 애니메이션 표시. A. pace.min.js 파일 업로드 이후, progress bar 색상 및 bar의 차오르는 속도를 조절하는 것에 대한 설계 및 점검. (아쉬운 점: .. 2021. 3. 9.