구글블로그 사용법: 포스트 푸터 (post footer) 꾸미기 - 항목설정, 순서 정렬, 여백, 폰트, 테두리 등

구글 블로그의 포스터 푸터(post footer)에 표시할 수 있는 항목들은 다양하고 또 표시하거나 숨기는 것도 쉽게 잘 되어 있다. 포스터 푸트가 페이지에 잘 어울리게 꾸미는 방법을 정리해 본다.

[1. 표시하거나 숨길 항목 선택과 순서 지정]

어떤 항목을 표시하고 숨길 것인지 그리고 순서를 어떻게 할 것인지는 블로그 설정에서 할 수 있고, 클릭만으로 할 수 있게 잘 되어 있다.

> 블로그 대시보드 > 레이아웃(Layout) > 블로그 포스트 가젯 (Blog Posts gadget)의 오른쪽 아래에 있는 편집(Edit)을 클릭한다. 그러면 아래 그림과 같은 '블로그 글 설정 (Configure Blog Posts)' 창이 열린다.
> 설정창에서 표시하고자 하는 항목을 클릭하여 체크(v)를 한다
> 창의 아래 쪽에 있는 '항목 정렬 Arrange Items'에서  항목을 마우스로 끌어서 순서나 위치를 조절한다
> 그 아래에 있는 [저장 Save] 버튼을 눌러 저장을 한다
구글블로그 사용법: 포스트 푸터 (post footer) 꾸미기와 순서 정렬, 여백 등 조절하는 방법

[2. 포스터 푸트 색상 설정하기]

포스터 푸터의 글자색, 배경색, 테두리색은 템플릿디자이너에서 간단히 할 수 있다. 아래의 그림을 보면 금방 이해가 될 것이므로 설명은 생략하기로 한다.
> 블로그 대시보드 > 템플릿(Template) > 사용자 설정(Customise)을 누르면 아래 그림과 같은 템플릿 디자이너 창이 열린다.
구글블로그 사용법: 포스트 푸터 (post footer) 꾸미기와 순서 정렬, 여백 등 조절하는 방법

[3. 포스터 푸트 꾸미기: 글자크기와 종류, 여백, 테두리선 등]
포스터 푸트의 글자 종류, 글자 크기, 여백 등을 세부적으로 꾸미려면 아래의 CSS코드를 넣어주면 된다.

[포스터 푸트 꾸미는 CSS 코드 예]
.post-footer {margin-left: 10px;}
.post-footer-line-1 {padding: 7px;}
.post-footer-line-2 {color: green;}
.post-footer-line-3 {text-decoration;}

위 첫번째 그림의 아래쪽에 있는 포스터 푸트 영역을 보면 세 줄로 영역이 나뉘어 있음을 알 수 있다. 위 CSS코드의
첫번째는 포스터 푸트 영역 전체에 적용되는 코드이고
~~ -1 은 포스터 푸트영역 가운데 첫번째 줄에 적용되고
~~ -2 는 두번째 줄에 적용이 되고
~~ -3 은 세번째 줄에 적용이 된다.

꾸미고자 하는 영역에 맞는 코드에 폰트 여백 테두리 등의 속성인자를 추가하고 알맞게 설정하여 넣어 주면 된다. (CSS코드를 추가하는 방법은 별도로 설명해 놓은 페이지 참초)