OneDrive 공유 링크를 워드프레스에서 직접 임베드하는 기능을 functions.php에 추가하기 위해서는, 먼저 OneDrive 공유 링크를 올바른 임베드 형식으로 변환하는 함수를 작성해야 합니다. 이를 위한 쇼트코드(shortcode)를 생성하고, 이를 functions.php 파일에 추가할 수 있습니다.

다음은 OneDrive 공유 링크를 임베드하는 쇼트코드의 예제입니다:

function embed_onedrive_video($atts) {
    // 쇼트코드 속성을 파싱합니다. 'url' 속성을 사용합니다.
    $atts = shortcode_atts(array('url' => ''), $atts);

    // OneDrive 공유 URL을 받아 iframe 형식으로 변환합니다.
    // 이 코드는 OneDrive의 특정 URL 패턴에 맞게 조정되어야 할 수 있습니다.
    $embed_url = esc_url($atts['url']);

    // iframe 태그를 반환합니다. 여기서 width와 height는 필요에 따라 조정할 수 있습니다.
    // return "<iframe src='{$embed_url}' width='560' height='315' frameborder='0' allowfullscreen></iframe>";
    // iframe에 클래스를 추가합니다.
    return "<iframe class='onedrive-video-embed' src='{$embed_url}' frameborder='0' allowfullscreen></iframe>";
}

// 워드프레스에 쇼트코드를 추가합니다.
add_shortcode('onedrive_video', 'embed_onedrive_video');


이 코드를 functions.php 파일에 추가한 후, 워드프레스 포스트나 페이지에서 [ onedrive_video url=”OneDrive 공유 URL” ] 형태로 쇼트코드를 사용할 수 있습니다. 이 쇼트코드는 사용자가 제공한 URL을 <iframe> 형식으로 변환하여 워드프레스 페이지에 임베드합니다.

테마의 스타일 시트에 onedrive-video-embed 클래스에 대한 스타일을 추가하기 위해 아래 코드를 추가합니다.
아래 코드는 임베드된 비디오의 종횡비를 16:9로 하고 높이를 사용자의 화면에 맞게 변형시켜줍니다.

<style>
	.onedrive-video-embed {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9; /* 비디오의 종횡비를 유지합니다 */
}

@media (max-width: 600px) {
    .onedrive-video-embed {
        /* 필요한 경우 모바일 화면에 대한 추가 스타일링 */
    }
}
</style>


중요 사항:

• esc_url 함수는 URL을 안전하게 이스케이프하는 데 사용됩니다. 이는 보안을 강화하기 위한 조치입니다.
• 이 방법은 OneDrive 공유 링크가 실제로 <iframe> 형식으로 임베드될 수 있도록 하는 URL 구조를 가지고 있어야 합니다. 일부 OneDrive 링크는 이러한 방식으로 임베드되지 않을 수 있으니, 이 점을 고려해야 합니다.
• width와 height는 필요에 따라 조정할 수 있습니다.

이 코드는 OneDrive 링크가 정상적으로 <iframe> 형식으로 변환되어 임베드되도록 할 수 있는 기본적인 구조를 제공합니다. 워드프레스 사이트의 특정 요구사항에 맞게 코드를 조정해야 할 수도 있습니다.

Author: 모요
댓글

댓글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다

*

©2024 MOYO Blog with DAON Consulting Co,LTD.

CONTACT US

We're not around right now. But you can send us an email and we'll get back to you, asap.

보내는 중입니다..

로그인하세요.

계정 내용을 잊으셨나요 ?