본문에서 특성 이미지 숨기기 – Twenty Fifteen 테마

Hide featured image on specific post.

최근들어 상단에 크게 특성 이미지 _{Featured Image}를 보이도록 하는 워드프레스 테마들이 많이 나오고 있다.

이미지가 아주 예쁘거나 하면 저렇게 크게 들어가도 괜찮지만, 목록용으로 작게 봤을 때만 예쁜 이미지를 넣거나 했을때는 조금 곤란하다.

나도 기존에는 작은 특성 이미지를 사용하고 있던 사람 중 한명이다.
그래서 이번에 새로나온 Twenty Fifeen 테마를 새로 적용하면서, 특성 이미지를 글에 따라서 숨기기/보이기를 선택할 수 있도록 적용해보았다.

특성 이미지 자체를 삭제해도 되지만, Twenty Fifeen 테마는 본문 하단에 ‘이전 글, 다음 글’ 부분에 특성 이미지가 백그라운드로 들어가서 좀 예쁘게(?) 보이기 때문에 특성 이미지 자체를 빼고 싶진 않았다.
그래서 사용자 정의 필드Custom Field를 이용해서 본문에서 특성 이미지를 숨길지 보일지 선택할 수 있도록 작업했다.

테마 수정하기

본문 파일 중 특성 이미지를 표출하는 곳의 코드를 수정한다.

본문 파일 : content.php
수정할 곳 : 아래 참고

<?php
	// Post thumbnail.
	twentyfifteen_post_thumbnail(); // 이 부분을 삭제
?>

그리고 아래 코드를 넣어준다.

<?php
$shouldHideFeaturedImage = get_post_meta($post->ID, 'hide_featured_image', true);
if ( $shouldHideFeaturedImage != 'yes' ) {
 if ( has_post_thumbnail() ) {
    the_post_thumbnail('medium');
    }
}
?>

• line 3 – hide_featured_image 는 본인이 원하는 이름으로 넣어도 된다.
• line 7 – medium은 특성 이미지로 나오는 이미지 사이즈이다. 나는 large로 해도 본문 가로 사이즈보다 약간 작기 때문에 ‘orginal’로 설정했다.

적용법

글을 작성할 때 ‘사용자 정의 필드‘에 위에서 지정한 항목을 넣어주면 된다.

• 이름 : hide_featured_image
• 값 : yes (Hide) or no (Show)

yes로 지정하고 글을 저장하면 본문에서 특성 이미지가 보이지 않게 된 걸 확인할 수 있다.

참고) 저렇게만 수정하면 포스트 목록과 페이지에는 여전히 특성 이미지가 나온다.
그 부분도 동일하게 하려면 해당 파일을 찾아서 위와 동일하게 수정해주면 된다.

플러그인으로 조금 편하게 적용

글을 쓸 때, 혹은 수정할 때 사용자 정의 필드를 일일히 손대려면 귀찮은 일이다.
그래서 Custom field를 관리/적용할 수 있는 플러그인을 통해 나름 GUI로 접근할 수 있도록 해두면 편리하다.

Plugin – Custom Field Suite

다른 플러그인도 써봤는데, 비주얼 컴포저와 충돌이 나서 본문 수정이 불가능했다.
이 플러그인은 문제 없이 작동했다.
요래조래 옵션을 만지고 나면 사이드바에 넣어서 편리하게 사용할 수 있다.

임시 방편 : CSS로 숨기기

야메(?)로 아래처럼 CSS를 이용해서 그냥 숨기는 방법도 있다. ^^;

.attachment-post-thumbnail {
    display:none;
}

– 끝 –