구글 블로그 라벨 자세히 보기 펼치기, 기본값 확장하여 보이도록 하는 방법 (Contempo Theme)

구글 블로그 라벨 '자세히 보기'를 펼치는 방법에 대한 안내입니다~ 😘 기본 값을 확장하도록 진행하였는데요, 라벨에 대한 텍스트는 따로 변경하지 않았기에 여전히 '자세히 보기'로 보일 것입니다. 크게 중요하게 생각하지 않기에 간단히 끝내려고 그대로 놓아두었는데, 필요 시 보완 작업을 해주세요.

구글 블로그 라벨 자세히 보기 펼치기

특히, Contempo 테마를 사용하고 있는 경우에 유용한 방법입니다. 이 과정에서는 CSS를 수정하여 라벨 목록이 기본적으로 확장되도록 설정을 할 것이니 간단히 따라해 보세요~

블로그 관리 페이지에 로그인

먼저, 구글 블로그 관리 페이지에 로그인하세요.

테마, HTML 하기

블로그 관리 페이지에서 좌측 메뉴에서 '테마'를 선택한 후, 상단의 'HTML 편집' 버튼을 클릭해 주세요. 이 부분에서 블로그의 HTML 및 CSS 코드를 수정할 수 있답니다.

CSS 코드 찾기

HTML 편집 페이지에서 Ctrl + F (Windows) 또는 Command+ F (Mac)을 눌러 아래의 CSS 코드를 찾습니다. (.remaining-items 부분을 찾아야 해요)

.extendable .remaining-items{
height:0;
overflow:hidden;
-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);
transition:height .3s cubic-bezier(.4,0,.2,1)
}
.extendable .remaining-items.expanded{
height:auto
}

CSS 코드 수정

찾은 CSS 코드의 height: 0; 부분을 height: auto;로 변경합니다. 변경 후 코드는 아래와 같이 보일 것입니다.

.extendable .remaining-items{
height:auto;
overflow:hidden;
-webkit-transition:height .3s cubic-bezier(.4,0,.2,1);
transition:height .3s cubic-bezier(.4,0,.2,1)
}
.extendable .remaining-items.expanded{
height:auto
}