เป็นไปได้หรือไม่ที่จะตั้งภาพเด่นด้วย URL ภาพภายนอก

ฉันรู้ว่ามีปลั๊กอินที่ดึงภาพจาก URL ระยะไกลและเก็บไว้ในเครื่อง ฉันต้องการทราบว่าเป็นไปได้หรือไม่ที่จะไม่เก็บภาพไว้ใน Media Library แต่ใช้เป็นภาพเด่น ?

ใช่เป็นไปได้และค่อนข้างง่าย

นี่คือขั้นตอนการทำงานที่ฉันแนะนำ:

1. วาง UI ไว้ที่อื่นเพื่อแทรก URL ของภาพเด่น ทางเลือกที่ดีที่สุดน่าจะเป็นที่ใช้'admin_post_thumbnail_html'ตะขอตัวกรอง
2. ใช้'save_post'action hook เพื่อบันทึก URL (หลังขั้นตอนความปลอดภัยและการตรวจสอบความถูกต้อง) ใน meta โพสต์ที่กำหนดเอง
3. ใช้'post_thumbnail_html'ตัวกรองเบ็ดเพื่อทำ<img>เครื่องหมายมาร์กอัปที่เหมาะสมแทนที่ค่าเริ่มต้นหากโพสต์ที่ต้องการภาพเด่นมีเมตาโพสต์ที่มีภาพเด่นภายนอก

ในการทำงานเวิร์กโฟลว์นี้ต้องมีภาพที่จะแสดงในเทมเพลตโดยใช้get_the_post_thumnbail()หรือthe_post_thumbnail()ฟังก์ชั่น

นอกจากนี้เราต้องแน่ใจว่า'_thumbnail_id'ค่าเมตามีค่าไม่ว่างเมื่อเราตั้งเมตาสำหรับ URL ภายนอกมิฉะนั้นhas_post_thumbnail()จะส่งคืนค่าเท็จสำหรับโพสต์ที่มีภาพเด่นภายนอกเท่านั้น

ในความเป็นจริงเป็นไปได้ว่าโพสต์มีทั้งรูปภาพเด่นในท้องถิ่นมาตรฐานและหนึ่งชุดผ่านเวิร์กโฟลว์ของเราและในกรณีนี้จะมีการใช้ภายนอก

ในการติดตั้งเวิร์กโฟลว์ของเราเราจำเป็นต้องมีฟังก์ชั่นในการตรวจสอบ 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 hooks ที่อธิบายไว้ในเวิร์กโฟลว์ด้านบน:

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'มักจะเพิ่มเช่น นั่นเป็นเพราะการดมขนาดของรูปภาพต้องมีงานพิเศษที่จะทำให้การโหลดหน้ากระดาษช้าลงโดยเฉพาะถ้าคุณมีรูปภาพเด่นมากกว่าหนึ่งภาพในหน้า

หากคุณต้องการคุณลักษณะเหล่านั้นคุณสามารถใช้รหัสของฉันเพิ่ม callback เพื่อwp_get_attachment_image_attributes'กรอง (มันเป็นตะขอ WordPress มาตรฐาน ) หรือบางทีคุณสามารถเปลี่ยนรหัสของฉันเพื่อดมกลิ่นภาพขนาดและคุณลักษณะที่เกี่ยวข้องกับการส่งออกและชั้นเรียน

ส่วนสำคัญของปลั๊กอิน

ทุกรหัสที่โพสต์ที่นี่มีข้อยกเว้นของการเพิ่มโดเมนเริ่มต้นข้อความที่เหมาะสมสามารถใช้ได้เป็นปลั๊กอินเต็มรูปแบบการทำงานในกระทู้ที่นี่ รหัสที่นั่นใช้เนมสเปซดังนั้นจึงต้องใช้ PHP 5.3 ขึ้นไป

หมายเหตุ

แน่นอนคุณควรแน่ใจว่าคุณมีสิทธิ์ใช้งานและการอนุญาตให้ใช้และรูปภาพ hotlink ในเว็บไซต์ของคุณจากภาพภายนอก