들어가며
계속되는 취업 실패로 인해 자존감이 바닥으로 떨어졌습니다...
그래도 포기하지 않고 꼭 데이터 분석가가 되고자 하는 바람으로 객관적으로 나를 파악해 보고자 생각하였습니다.
'나'라는 사람과 내가 만든 결과물들이 인사 담당자들이나 다른 사람들에게 매력적으로 보이는지 파악하기 위해 블로그에 저에 대한 모든 것을 기록하고 블로그를 방문한 사람들의 데이터를 수집하여 분석을 해보고자 합니다!
그렇게 하기 위해선 블로그를 깔끔하게 꾸미는 것부터 시작해야 한다고 생각했습니다.
이전에 네이버 블로그도 해보았지만 내가 원하는 대로 편집하기에도 불편하고 무엇보다 GA4에 연결하기 힘들었습니다. 그래서 GPT에게 HTML 구조를 짜달라고 부탁하여 Github로 나만의 블로그를 배포해 보려고 시도하였지만, 프론트엔드에 무지한 저로서는 굉장히 힘든 작업이었습니다...
티스토리 블로그는 HTML 구조를 자유롭게 변경 가능하고 GA4 코드를 심기에도 편리하다는 것을 알고 티스토리 블로그를 통해 나만의 블로그를 만들기로 결정하였습니다.
저는 사이드바를 통해 방문자들이 모든 글을 자유롭게 볼 수 있는 블로그를 만들고 싶었기에 hELLO님 블로그에서 스킨을 하나 다운로드하여 적용하였습니다.
hELLO 티스토리 스킨을 소개합니다.
hELLO는 2020년 3월 첫 공개 이후 지금에 이르기까지 티스토리에서 많은 블로거분들께 사랑받은 스킨이 되었습니다. 그 결과 가장 영향력 있는 개발자 커뮤니티인 깃허브에서 약 천 개에 달하는 티
pronist.tistory.com
스킨 적용법은 링크에 자세히 나와있으니 스킨 적용법이 필요하신 분들은 해당 링크를 이용해 주시기 바랍니다.
스킨 적용이 완료되었다면 블로그 관리 페이지로 이동하여 꾸미기 탭에 있는 스킨 편집으로 이동해 줍니다!
해당 화면으로 이동하면 적용 중인 스킨과 스킨 편집 기능이 몇 가지 있습니다.
대부분의 블로그 꾸미기는 티스토리에서 제공하는 스킨 편집 기능으로 가능했지만, 사용 중인 스킨에서는 *푸터 편집 기능이 제공되지 않아 제가 원하는 분위기의 블로그를 구현하는 데에는 한계가 있었습니다. 그래서 HTML 편집을 통해 푸터를 직접 만들었습니다!
푸터(Footer)란?
푸터(Footer)란?푸터는 ‘Foot(발)’이라는 단어에서 알 수 있듯이, 웹페이지의 가장 하단 영역을 의미합니다. 저는 블로그나 글에 관심이 있는 방문자라면 끝까지 스크롤해 푸터까지 도달할 것이라고 생각했습니다. 그래서 이 공간에 제 프로젝트 결과물들의 링크를 배치하기로 결정했습니다.
해당 스킨에 HTML 구조에서 ctrl + F를 누르고 footer를 찾아보았을 때, 글을 작성했을 때 생기는 블로거 프로필을 표시하는 footer 공간만 존재했습니다.
그래서 블로그 전체에 푸터 영역을 추가할 수 있도록 <body> 클래스 안쪽에 새로운 <footer> 영역을 추가하여 원하는 기능을 넣어주었습니다.
<body> --- 기존의 body 클래스
...
<footer class="my-footer" id="my-footer">
<div class="wrap">
...
</div>
</footer>
...
</body>이처럼 티스토리의 HTML 편집 기능을 이용한다면 푸터 뿐만 아니라 사진이나 글씨를 원하는 곳에 배치하거나 블로그를 전체적으로 수정이 가능합니다.
저는 GPT를 이용해 푸터에 hover 기능 뿐만 아니라, 기존의 사이드바에서 정렬이 되지 않던 글씨의 위치를 조정하기도 하였습니다!
지속적으로 블로그에 기능을 추가하고 꾸며나갈 계획입니다. 많은 관심과 구독 부탁드립니다.
질문 사항이나 코드가 궁금하시다면 푸터에 있는 연락처로 연락 바랍니다!
'STUDY' 카테고리의 다른 글
| <SQL> IN vs EXISTS - [Programmers] 특정 기간동안 대여 가능한 자동차들의 대여비용 구하기 (0) | 2025.10.09 |
|---|---|
| <SQL> MAX 함수 이해하기 - [Programmers] 자동차 대여 기록에서 대여중 / 대여 가능 여부 구분하기 (0) | 2025.10.08 |
| 티스토리 글 검색 포털에 노출시키기 (0) | 2025.09.25 |
| <Tableau> 커스텀 도형 사용하기 (0) | 2025.09.24 |
| 티스토리 블로그에 GA4, GTM 연결하기! (0) | 2025.09.15 |