워드프레스에 .webp 업로드 방법

구글[ PageSpeed Insights (google.com) ]에서 워드프레스 로딩 속도를 높이기 위해 사용을 권하는 .webp 파일을 워드프레스 ‘미디어 라이브러리’에 올려 사용할려니 사용할 수 없다는 오류 메시지가 나타나 인터넷을 검색해서 아래 순서로 작업하니 .webp 파일을 사용할 수 있었다.

※ .webp 파일은 ‘PhotoScape X’ 무료 버전으로 만듦.

1. 사용하고 있는 테마 확인
   • 워드프레스 관리자 페이지(wp-admin) 접속
   • Appearance / Themes에서 Active 테마 확인
2. functions.php 수정
   • functions.php는 wp-content / themes 폴더 아래에 위( ‘1’)에서 확인 한 테마 이름 아래에 있음
   • functions.php 파일을 열고 마지막 ‘add_filter’를 찾고 그 아래에 다음 코드를 복사 후 붙여넣고 저장. 끝.

//.webp 업로드 함수
function webp_upload_mimes($existing_mimes) {
    $existing_mimes['webp'] = 'image/webp';
    return $existing_mimes;
}
add_filter('mime_types', 'webp_upload_mimes');

//.webp 미리보기 함수
function webp_is_displayable($result, $path) {
    if ($result === false) {
        $displayable_image_types = array( IMAGETYPE_WEBP );
        $info = @getimagesize( $path );
        if (empty($info)) {
            $result = false;
        } elseif (!in_array($info[2], $displayable_image_types)) {
            $result = false;
        } else {
            $result = true;
        }
    }
    return $result;
}
add_filter('file_is_displayable_image', 'webp_is_displayable', 10, 2);