블로그스팟 푸터 꾸미기: 블로그에 마지막 한 줄을 수정해보자
블로그를 오래 운영하다 보면 콘텐츠만큼이나 눈에 띄는 것이 바로 ‘디자인 완성도’입니다. 특히, 페이지의 맨 아래에 위치한 푸터(Footer)는 단순히 끝맺음이 아니라 방문자에게 신뢰와 전문성을 남기는 자리죠. 저는 처음 블로그스팟을 사용할 때, “푸터는 어떤 역할을 하지? 어떻게 꾸며야 하지?”라는 고민을 꽤 했던 기억이 있습니다. 알고 보면 어렵지 않지만, 막상 시작하려면 구조가 낯설 수 있습니다.
이번 글에서는 초보자도 쉽게 따라 할 수 있도록 블로그스팟 푸터에 글자, 이미지, 위젯(가젯)을 추가하는 구체적인 방법을 단계별로 정리했습니다. HTML을 몰라도 충분히 가능합니다. 다만 조금 더 개성 있게 꾸미고 싶다면, 약간의 코드 이해가 도움이 되죠.
푸터 영역이 중요한 이유
대부분의 방문자는 글을 다 읽고 나면 자연스럽게 화면을 아래로 스크롤합니다. 이때 마주치는 푸터는 ‘마지막 인사’ 같은 역할을 하죠. 깔끔하게 정리된 푸터는 방문자에게 좋은 인상을 남기고, 재방문을 유도합니다.
- 신뢰감 형성: 저작권 표시나 연락처가 깔끔히 정리된 푸터는 ‘운영자가 신경 쓰는 블로그’라는 인상을 줍니다.
- 편의성 제공: SNS 링크, 이메일, 사이트맵 등을 모아두면 방문자가 쉽게 다른 콘텐츠로 이동할 수 있습니다.
- 브랜딩 효과: 로고나 슬로건을 삽입하면 블로그의 정체성을 강화할 수 있습니다.
즉, 푸터는 단순한 장식이 아니라 ‘기능 + 디자인 + 신뢰’를 모두 잡을 수 있는 숨은 명당인 셈이죠.
푸터에 글자, 이미지, 가젯을 추가하는 쉬운 방법
가장 안전하고 간단한 방법은 Blogger의 레이아웃 메뉴를 이용하는 것입니다. 대부분의 테마는 푸터에 1~4개의 가젯 영역을 제공합니다. 이 영역에 HTML/JavaScript 가젯을 추가해 자유롭게 콘텐츠를 넣을 수 있습니다.
① Blogger 대시보드 로그인
Blogger에 로그인 후, 수정할 블로그를 선택합니다. 여러 개의 블로그를 운영한다면 실수로 다른 곳을 수정하지 않도록 주의하세요.
② ‘레이아웃(Layout)’ 메뉴로 이동
왼쪽 메뉴에서 ‘레이아웃’을 클릭합니다. 블로그의 구조가 시각적으로 표시된 화면이 열립니다.
③ 푸터 위젯 영역 찾기
‘푸터(Footer)’ 또는 ‘꼬리말’이라는 이름의 영역을 찾습니다. 테마마다 다르지만 대부분 맨 아래쪽에 위치해 있습니다. ‘+ 가젯 추가’ 버튼을 클릭하세요.
만약 푸터 영역에 가젯 추가 버튼이 없다면, 다른 영역에서 가젯을 추가하고 드래그해서 옮길 수 있습니다.
제가 쓰는 블로그스팟의 테마는 아래와 같은 두개의 푸터영역을 정의하고 있습니다.
저는 페이지 링크와 소셜미디어, 그리고 저작권에 대한 정의를 푸터에 넣고 있습니다.
 |
| Igniel님 테마의 푸터 위젯 영역 |
④ HTML/JavaScript 가젯 추가
팝업창이 뜨면 ‘HTML/JavaScript’ 가젯을 선택합니다. 이 가젯은 거의 ‘만능 상자’라고 할 수 있습니다. 텍스트, 이미지, 외부 위젯까지 모두 넣을 수 있거든요.
- 글자(텍스트): 일반 텍스트를 입력하면 됩니다. 줄바꿈은
<br>태그로 표현할 수 있습니다. - 이미지: 이미지를 표시하려면 HTML의
<img>태그를 사용합니다.
예시:
<img src="https://example.com/logo.png" alt="블로그 로고" style="width:120px;height:auto;"> - 외부 위젯: 인스타그램, 유튜브, 네이버 이웃 추가 버튼 등 외부 코드도 그대로 붙여넣을 수 있습니다.
모든 내용을 입력한 후 ‘저장’을 클릭하세요. 제목은 비워두거나, ‘Footer Info’처럼 간단히 넣을 수 있습니다.
⑤ 레이아웃 저장
변경이 끝났다면, 오른쪽 상단의 ‘저장’ 버튼을 꼭 눌러야 합니다. 실수로 페이지를 닫으면 지금까지의 수정이 사라질 수 있습니다. (저도 몇 번이나 그랬어요...)
푸터를 더 멋지게 만드는 팁
단순히 글자만 있는 푸터보다, 시각적인 밸런스가 잡힌 푸터는 방문자의 머릿속에 오래 남습니다. 예를 들어 로고 옆에 블로그 슬로건을 넣거나, SNS 아이콘을 가로로 정렬하면 훨씬 세련되어 보입니다.
- 배경색 변경: 테마 HTML에서
.footer클래스를 찾아 배경색을 수정할 수 있습니다. - 텍스트 색상 조정: 흰 배경에는 진한 회색(#333), 어두운 배경에는 밝은 회색(#f0f0f0)이 눈에 편합니다.
- 링크 아이콘 추가: Font Awesome 같은 무료 아이콘 서비스를 사용하면 SNS 버튼을 쉽게 넣을 수 있습니다.
한 번 수정한 뒤에는 모바일 화면에서도 레이아웃이 깨지지 않는지 꼭 미리보기로 확인해보세요.
저작권 표시(Attribution) 수정 또는 제거하기
일부 테마에는 ‘Powered by Blogger’라는 저작권 표시가 기본으로 들어 있습니다. 이 가젯은 잠금 상태로 되어 있어서 레이아웃 화면에서 바로 삭제할 수 없을 때가 많습니다.
HTML 편집을 통한 수정 방법
- ‘테마(Theme)’ 메뉴로 이동한 뒤, ‘HTML 편집’을 클릭합니다.
- Ctrl + F로 ‘Attribution1’을 검색합니다.
locked='true'를locked='false'로 변경합니다.- 변경 후 저장하고 레이아웃으로 돌아가면 삭제 버튼이 활성화됩니다.
이 과정은 테마에 따라 조금씩 다르며, 코드 편집 시 실수가 생길 수 있으니 꼭 테마 백업을 먼저 해두세요.
푸터에 넣으면 좋은 구성 요소 예시
- ⓒ 연도 + 블로그 이름 + 간단한 문구 (예: “All rights reserved.”)
- 이메일 주소 또는 문의 폼 링크
- SNS 아이콘 (Instagram, YouTube, X 등)
- ‘맨 위로 가기’ 버튼 코드
- 작은 배너 광고 또는 협력사 로고
이런 구성만으로도 ‘프로 블로그’ 같은 인상을 줄 수 있습니다. 저는 블로그를 처음 만들 때, 푸터에 제 이름과 이메일을 넣어 두었는데, 덕분에 몇몇 브랜드 제안 메일을 받기도 했습니다. 푸터는 진짜 ‘열린 문’이 될 수도 있더라고요.
마무리
정리하자면, 블로그스팟 푸터는 단순한 장식이 아닙니다. 정보 제공, 브랜딩, 네비게이션이라는 세 가지 역할을 동시에 해내는 ‘작은 종합 안내판’이죠. 특히 HTML/JavaScript 가젯을 활용하면 초보자도 쉽게 원하는 형태로 꾸밀 수 있습니다.
오늘 소개한 방법으로 여러분의 블로그도 한층 완성도 있게 다듬어보세요. 마지막 한 줄이 달라지는 순간, 방문자의 시선도 달라집니다.
댓글 쓰기