워드프레스 미디어, 이미지 생성 제어, 포스트 섬네일

워드프레스 미디어는 파일과 같습니다. 이미지, 오디오, 동영상, 압축 파일 등. 세부 정의로 보면 결국 MIME Types와 같은 뜻이 됩니다. 다음 링크에서 MIME Types 목록을 참고할 수 있습니다.

The Complete List of MIME Types

미디어 유형 중 가장 많이 사용하는 것이 이미지임은 밤새 그린 막대 그래프로 증명할 필요가 없습니다. 그에 따라 많은 워드프레스 사용자가 이미지 제어를 통해 사이트 트래픽과 호스팅 용량 절약을 위해 애쓰고 있습니다. 물론 신경 쓰지 않는 사용자도 많습니다. 워드프레스 관리페이지의 미디어 설정 페이지도 몇 안되는 옵션이지만, 이미지 생성 크기(Image sizes)에 대한 것이 전부라 해도 됩니다.

워드프레스 포스트 섬네일

설정과 원본 이미지의 크기에 따라 생성하는 이미지 개수가 다르지만, 워드프레스에서 이미지 하나를 올릴 때 특정 이미지의 한 축이 Large size 설정 크기 이상이면 기본으로 3개의 이미지를 생성합니다. 미디어 설정 페이지에는 나오지 않지만, 워드프레스 4.4 버전에서 새롭게 추가된 기본 이미지 크기로 medium_large 이미지도 생성됩니다. 원본 이미지를 포함하면 하나가 5개의 이미지로 구분(Resized, 원본 제외)된다고 볼 수 있습니다.

거의 모든 아니면 일부 테마는 제작자의 의도에 따라 특정 이미지가 하나 더 생성되도록 정의합니다. 포스트 섬네일(post-thumbnail)을 위한 정의로 생각할 수 있습니다. 테마에 맞도록 크기를 정의하며, Featured Image(post-thumbnails)에 등록하면 해당 이미지를 출력할 수 있습니다. 테마에서 Featured Image 사용을 정의하지 않는다면 불필요한 이미지 크기 정의입니다. 다음 코드는 워드프레스 2015(twentyfifteen) 테마의 functions.php 파일에 정의된 Featured Image 사용과 포스트 섬네일 이미지 크기를 정의한 것입니다.

// Featured Image 사용을 위한 정의, post-thumbnails
add_theme_support( 'post-thumbnails' );

// 포스트 섬네일(post-thumbnail) 크기 정의
set_post_thumbnail_size( 825, 510, true );

구분할 것은 Featured Image 사용을 정의한 post-thumbnails 파라미터 맨 끝 s이며, 이것은 이미지 크기가 아니라 테마에서 자유롭게 정의할 수 있는 Theme Features 중 하나라는 것만 유의하면 됩니다.

포스트 섬네일 표현을 위해 테마 템플릿 파일에 보통 the_post_thumbnail() 함수를 사용합니다. 앞의 코드처럼 포스트 섬네일 크기를 정의하고, 함수에 특정 이미지 크기(파라미터)를 추가하지 않으면 정의한 크기의 이미지를 출력할 수 있습니다. 다른 이미지 크기를 출력한다면 아래 코드를 참고하면 됩니다.

the_post_thumbnail(); // post-thumbnail

the_post_thumbnail( 'thumbnail' );
the_post_thumbnail( 'medium' );
the_post_thumbnail( 'medium_large' );
the_post_thumbnail( 'large' );
the_post_thumbnail( 'full' );

// 파일 생성은 아니며, 출력 시 이미지 크기 제어
the_post_thumbnail( array(100, 100) );

기본 이미지 크기와 포스트 섬네일 이미지 크기 외에 사용자가 새로운 이미지 크기를 정의해야 할 경우가 있습니다. 앞의 set_post_thumbnail_size() 함수는 thumbnail, medium처럼 이미지 크기에 대한 명칭을 추가(Register)하지 않습니다. 포스트 섬네일을 사용할 것이며, 그 크기를 정의하는 것이 전부입니다. 이미지 크기 이름을 등록하고 크기를 정의할 때 다음처럼 add_image_size() 함수를 사용할 수 있습니다.

add_image_size( 'my-img-size', 147, 149 ); // 추가
the_post_thumbnail( 'my-img-size' ); // 출력

이미지 생성 제어

사용자가 새로 추가한 이미지는 제외하고, 앞의 내용에 따라 워드프레스 이미지 하나는 다음처럼 6가지로 구분할 수 있습니다. 다르게 말하면 이미지 하나를 올리면 5개가 늘어난다는 뜻입니다.

  • thumbnail (워드프레스 갤러리 섬네일 기본 이미지 크기)
  • medium
  • medium_large (4.4 버전 이상)
  • large
  • full (원본 이미지)
  • post-thumbnail (Featured Image)

사용자 마음이나, 생성되는 이미지 크기 중 사용하지 않는 것은 처음부터 생성되지 않도록 하는 것이 좋다는 것에 이견이 있을 수 없습니다. 보통 특정 이미지 크기를 생성하지 않기 위해 intermediate_image_sizes_advanced 훅을 사용하여 다음처럼 정의할 수 있습니다.

// 모든 이미지 크기 생성 제한
function remove_default_image_sizes( $sizes ) {
    unset( $sizes['thumbnail'] );
    unset( $sizes['medium'] );
    unset( $sizes['medium_large'] );
    unset( $sizes['large'] );
    unset( $sizes['post-thumbnail'] );

    return $sizes;
}
add_filter('intermediate_image_sizes_advanced', 'remove_default_image_sizes');

이 코드는 사용하는 테마의 functions.php, 플러그인, Must Use Plugins 방식으로 추가하여 사용하면 됩니다. 관리페이지 미디어 설정 페이지에서 다음 그림처럼 설정하여 원하는 결과를 얻을 수도 있습니다. 미디어 설정 페이지를 통한 처리는 3개의 이미지 크기 생성 제어만 가능합니다.

관리페이지 이미지 크기 설정

앞의 그림은 결국 다음 코드와 같습니다.

update_option( 'thumbnail_size_h', 0 );
update_option( 'thumbnail_size_w', 0 );
update_option( 'medium_size_h', 0 );
update_option( 'medium_size_w', 0 );
update_option( 'large_size_h', 0 );
update_option( 'large_size_w', 0 );

포스트 섬네일 이미지를 사용하지 않으면 Featured Image 메타박스도 제거하는 동시에 사용하는 테마에서 포스트 섬네일 출력을 정의한 함수도 리셋하는 것이 좋습니다. 테마 2015 기준으로 예를 들면, functions.php, template-tags.php 파일에는 각각 다음 코드가 있습니다.

// ...............

// functions.php
add_theme_support( 'post-thumbnails' );

// template-tags.php
function twentyfifteen_post_thumbnail() {

    // ..........

    <?php the_post_thumbnail(); ?>

    // ..........
}
endif;

테마 2015를 사용하며, 하위테마(Child Theme)를 사용하지 않는다는 가정으로 다음 코드를 사용하여 간단하게 처리할 수 있습니다. 코드는 CSS 추가 정의로 숨겨도 되지만, 사용하지 않는 이미지라면 생성 뿐 아니라 등록도 제한하는 것이 좋습니다.

function remove_featured_images() {
    remove_theme_support( 'post-thumbnails' );
}
add_action( 'after_setup_theme', 'remove_featured_images', 11 ); 

// template-tags.php 파일의 함수
if ( ! function_exists('twentyfifteen_post_thumbnail' ) ) {
    function twentyfifteen_post_thumbnail() {
    // Nothing
  }
}

코드 추가가 어렵다면 관리페이지 설정만으로도 생성 이미지를 제어할 수 있으므로 필요하다면 즉시 처리하세요. 가끔 갤러리를 사용한다면 그때 섬네일(thumbnail) 크기만 지정하고 포스팅하면 걱정 없습니다.