외부 이미지 URL로 추천 이미지를 설정할 수 있습니까?

원격 URL에서 이미지를 가져 와서 로컬로 저장하는 플러그인이 있다는 것을 알고 있습니다. 미디어 라이브러리에 이미지를 저장 하지 않고 추천 이미지 로 사용할 수 있는지 여부를 알고 싶습니다 .

예, 가능하고 아주 쉽습니다.

이것이 내가 제안하는 워크 플로우입니다.

1. 추천 이미지의 URL을 삽입 할 수있는 UI를 배치하십시오. 아마도 가장 좋은 선택은 'admin_post_thumbnail_html'필터 후크 를 사용하는 것입니다
2. 'save_post'조치 후크를 사용 하여 사용자 정의 사후 메타에 URL (보안 및 유효성 검증 루틴 후)을 저장하십시오.
3. 추천 이미지가 필요한 게시물에 외부 추천 이미지가 포함 된 게시물 메타가있는 경우 'post_thumbnail_html'필터 후크를 사용 하여 적절한 <img>마크 업 을 출력 하고 기본값을 재정의합니다.

이 워크 플로를 사용하려면 get_the_post_thumnbail()또는 the_post_thumbnail()기능을 사용하여 템플릿에 추천 이미지를 표시해야합니다 .

또한 '_thumbnail_id'외부 URL에 메타를 설정할 때 메타 값이 비어 있지 않은지 확인해야합니다 . 그렇지 않으면 has_post_thumbnail()외부 추천 이미지 만있는 게시물에 대해서는 false를 반환합니다.

실제로 게시물에는 표준 로컬 추천 이미지와 워크 플로를 통해 하나의 세트 가 모두 있을 수 있으며이 경우 외부가 사용됩니다.

워크 플로를 구현하려면 유효한 이미지 URL인지 확인해야하기 때문에 외부 추천 이미지로 사용 된 URL의 유효성을 검사하는 기능이 필요합니다.

이 작업을 수행하는 방법에는 여러 가지가 있습니다. 여기에서는 이미지를 다운로드하지 않고 URL 만 보는 매우 간단한 방법을 사용합니다. 이것은 정적 이미지 URL에서만 작동하며 이미지가 실제로 존재하는지 확인하지는 않지만 빠릅니다. 필요한 경우 더 고급으로 수정하십시오 ( 여기 에 도움이됩니다).

function url_is_image( $url ) {
    if ( ! filter_var( $url, FILTER_VALIDATE_URL ) ) {
        return FALSE;
    }
    $ext = array( 'jpeg', 'jpg', 'gif', 'png' );
    $info = (array) pathinfo( parse_url( $url, PHP_URL_PATH ) );
    return isset( $info['extension'] )
        && in_array( strtolower( $info['extension'] ), $ext, TRUE );
}

아주 쉽습니다. 이제 위의 작업 과정에서 설명한 3 가지 후크를 추가해 보겠습니다.

add_filter( 'admin_post_thumbnail_html', 'thumbnail_url_field' );

add_action( 'save_post', 'thumbnail_url_field_save', 10, 2 );

add_filter( 'post_thumbnail_html', 'thumbnail_external_replace', 10, PHP_INT_MAX );

관련 기능. 먼저 관리자에서 필드를 출력하는 것 :

function thumbnail_url_field( $html ) {
    global $post;
    $value = get_post_meta( $post->ID, '_thumbnail_ext_url', TRUE ) ? : "";
    $nonce = wp_create_nonce( 'thumbnail_ext_url_' . $post->ID . get_current_blog_id() );
    $html .= '<input type="hidden" name="thumbnail_ext_url_nonce" value="' 
        . esc_attr( $nonce ) . '">';
    $html .= '<div><p>' . __('Or', 'txtdomain') . '</p>';
    $html .= '<p>' . __( 'Enter the url for external image', 'txtdomain' ) . '</p>';
    $html .= '<p><input type="url" name="thumbnail_ext_url" value="' . $value . '"></p>';
    if ( ! empty($value) && url_is_image( $value ) ) {
        $html .= '<p><img style="max-width:150px;height:auto;" src="' 
            . esc_url($value) . '"></p>';
        $html .= '<p>' . __( 'Leave url blank to remove.', 'txtdomain' ) . '</p>';
    }
    $html .= '</div>';
    return $html;
}

내가 사용한 적이 있습니다 'txtdomain'텍스트 도메인으로,하지만 당신은 적절한 등록 된 텍스트 도메인을 사용합니다.

비어있을 때 출력이 표시되는 방식입니다.

이미지 URL을 추가하고 게시물을 저장 / 업데이트 한 후의 모습입니다.

이제 관리 UI가 완료되었습니다. 저장 루틴을 작성해 보겠습니다.

function thumbnail_url_field_save( $pid, $post ) {
    $cap = $post->post_type === 'page' ? 'edit_page' : 'edit_post';
    if (
        ! current_user_can( $cap, $pid )
        || ! post_type_supports( $post->post_type, 'thumbnail' )
        || defined( 'DOING_AUTOSAVE' )
    ) {
        return;
    }
    $action = 'thumbnail_ext_url_' . $pid . get_current_blog_id();
    $nonce = filter_input( INPUT_POST, 'thumbnail_ext_url_nonce', FILTER_SANITIZE_STRING );
    $url = filter_input( INPUT_POST,  'thumbnail_ext_url', FILTER_VALIDATE_URL );
    if (
        empty( $nonce )
        || ! wp_verify_nonce( $nonce, $action )
        || ( ! empty( $url ) && ! url_is_image( $url ) )
    ) {
        return;
    }
    if ( ! empty( $url ) ) {
        update_post_meta( $pid, '_thumbnail_ext_url', esc_url($url) );
        if ( ! get_post_meta( $pid, '_thumbnail_id', TRUE ) ) {
            update_post_meta( $pid, '_thumbnail_id', 'by_url' );
        }
    } elseif ( get_post_meta( $pid, '_thumbnail_ext_url', TRUE ) ) {
        delete_post_meta( $pid, '_thumbnail_ext_url' );
        if ( get_post_meta( $pid, '_thumbnail_id', TRUE ) === 'by_url' ) {
            delete_post_meta( $pid, '_thumbnail_id' );
        }
    }
}

이 기능은 일부 보안 검사 후 게시 된 URL을 확인하고 올 바르면 '_thumbnail_ext_url'게시 메타에 저장합니다 . URL이 비어 있고 메타가 저장된 경우 외부 URL 필드를 비우기 만하면 메타를 제거 할 수 있습니다.

마지막으로해야 할 일은 외부 이미지 URL이 메타로 설정 될 때 추천 이미지 마크 업을 출력하는 것입니다.

function thumbnail_external_replace( $html, $post_id ) {
    $url =  get_post_meta( $post_id, '_thumbnail_ext_url', TRUE );
    if ( empty( $url ) || ! url_is_image( $url ) ) {
        return $html;
    }
    $alt = get_post_field( 'post_title', $post_id ) . ' ' .  __( 'thumbnail', 'txtdomain' );
    $attr = array( 'alt' => $alt );
    $attr = apply_filters( 'wp_get_attachment_image_attributes', $attr, NULL );
    $attr = array_map( 'esc_attr', $attr );
    $html = sprintf( '<img src="%s"', esc_url($url) );
    foreach ( $attr as $name => $value ) {
        $html .= " $name=" . '"' . $value . '"';
    }
    $html .= ' />';
    return $html;
}

우리는 끝났습니다.

해야 할 일

주요 이미지 출력에서 ​​나는 사용하지 않았 width거나 height속성이나 WordPress가 일반적으로 추가하는 클래스를 사용하지 않았습니다 'attachment-$size'. 이미지 크기를 스니핑하려면 특히 페이지에 둘 이상의 추천 이미지가있는 경우 페이지로드 속도가 느려지는 추가 작업이 필요하기 때문입니다.

이러한 속성이 필요한 경우 wp_get_attachment_image_attributes'필터링을 위해 콜백을 추가하는 내 코드를 사용 하거나 ( 표준 WordPress hook ) 이미지 크기를 스니핑하고 관련 속성 및 클래스를 출력하도록 내 코드를 변경할 수 있습니다.

플러그인 요지

적절한 텍스트 도메인 초기화를 추가하는 것을 제외하고 여기에 게시 된 모든 코드는 Gist here 에서 완전한 플러그인으로 사용할 수 있습니다 . 이 코드는 네임 스페이스를 사용하므로 PHP 5.3 이상이 필요합니다.

노트

물론 외부 이미지를 사용하여 사이트의 이미지를 사용하고 핫 링크 할 수있는 라이센스와 권한이 있는지 확인해야합니다.