WordPress에서 oEmbed 최대 너비를 설정하는 방법(4가지 쉬운 방법)

최근 게시물 게시판 wordpress WordPress에서 oEmbed 최대 너비를 설정하는 방법(4가지 쉬운 방법)

  • WordPress에서 oEmbeds의 너비를 제한하시겠습니까?

    WordPress는 YouTube 동영상, 트윗 또는 Facebook 게시물과 같은 타사 콘텐츠를 자동으로 포함합니다. 그러나 때때로 임베드가 너무 넓어져 페이지 레이아웃이 엉망이 될 수 있습니다.

    이 기사에서는 WordPress에서 oEmbed max-width를 설정하여 사이트 레이아웃을 더 잘 제어할 수 있도록 하는 방법을 보여줍니다.

    WordPress에서 OEmbed 최대 너비를 수정하는 이유는 무엇입니까?

    WordPress를 사용하면 oEmbed라는 기술을 사용하여 선택한 타사 웹사이트의 콘텐츠를 게시물과 페이지에 자동으로 포함할 수 있습니다.

    이렇게 하면 쉽게 YouTube 동영상 삽입, 페이스북 게시물, 트윗 및 웹사이트의 기타 여러 유형의 콘텐츠. 이 콘텐츠는 귀하의 워드프레스 웹사이트. 대신 이러한 타사 사이트에서 직접 표시됩니다.

    WordPress는 포함된 콘텐츠의 너비를 웹사이트의 콘텐츠 또는 사이드바 영역에 맞게 자동으로 조정하는 데 매우 적합합니다.

    그러나 때때로 이러한 포함된 콘텐츠가 너무 넓고 아래 예와 같이 웹사이트의 콘텐츠 영역과 겹칠 수 있습니다.

    콘텐츠 너비를 초과하는 WordPress 포함

    이 문제를 해결하려면 WordPress에 타사 삽입에 대해 최대 너비 제한을 사용하도록 명시적으로 알려야 합니다. 불행히도 WordPress 설정에는 그렇게 할 수 있는 옵션이 없습니다.

    즉, 아무 것도 손상시키지 않고 WordPress에서 oEmbed 최대 너비를 쉽게 설정하는 방법을 살펴보겠습니다.

    4가지 다른 방법을 다루며 필요에 가장 적합한 방법을 선택할 수 있습니다.

    1. WordPress 단축 코드로 oEmbed 너비 설정
    2. WordPress Embed Block으로 oEmbed 너비 설정
    3. CSS로 oEmbed 최대 너비 설정
    4. WordPress 필터로 oEmbed 최대 너비 설정(코드 방법)

    방법 1. WordPress에서 Embed Shortcode 사용

    이 방법은 더 쉽고 WordPress에서 비디오 임베드의 최대 너비를 설정하는 데 정말 잘 작동합니다.

    URL을 붙여넣거나 YouTube 블록을 사용하는 대신 짧은 코드 블록. 그 안에 포함 단축 코드를 사용하고 너비 및 높이 매개 변수를 포함해야 합니다.

    [embed width="900" height="600"]https://youtu.be/6LwWumPeues[/embed]

    너비와 높이 값을 원하는 대로 자유롭게 변경하고 내장 URL을 자신의 내장으로 바꾸십시오.

    단축 코드 너비 포함

    이제 게시물 또는 페이지를 미리 보고 임베드가 작동하는 것을 볼 수 있습니다.

    o임베딩 너비 조정됨

    포함 단축 코드와 너비 및 높이 매개 변수는 모든 oEmbed 공급자에서 작동하지 않습니다. 예를 들어, 높이와 너비를 설정하는 데 사용할 수 없습니다. 워드프레스에 Giphy 임베딩.

    이 경우 아래에 언급된 대체 방법 중 하나를 시도할 수 있습니다.

    방법 2. WordPress에서 블록 포함 사용

    NS 기본 워드프레스 편집기 다양한 oEmbed 서비스 제공업체를 위한 여러 내장 블록과 함께 제공됩니다. 이를 사용하여 게시물 및 페이지의 다른 영역에 콘텐츠를 포함할 수 있습니다.

    WordPress에 블록 포함

    이러한 블록 중 일부를 사용하면 포함 정렬을 변경하고 콘텐츠 너비를 너비 또는 전체 너비로 설정할 수도 있습니다.

    블록 너비 및 정렬

    이 옵션을 사용하여 임베드의 최대 너비 문제가 해결되는지 확인할 수 있습니다.

    방법 3. CSS를 사용하여 WordPress의 Embed에 대한 최대 너비 설정

    기본적으로 WordPress는 자동으로 CSS 클래스 게시물 및 페이지의 다른 영역으로 이동합니다.

    또한 블록을 포함하기 위해 여러 CSS 클래스를 추가합니다. 이러한 CSS 클래스를 사용하여 WordPress 웹사이트에 포함할 수 있는 최대 너비를 설정할 수 있습니다.

    대상으로 삼아야 하는 CSS 클래스를 찾으려면 게시물이나 페이지에 콘텐츠를 포함하고 브라우저에서 미리보기만 하면 됩니다. 포함된 콘텐츠를 마우스 오른쪽 버튼으로 클릭한 다음 검사 도구를 선택합니다.

    포함 블록에 대한 CSS 클래스 찾기

    포함된 요소에 추가된 모든 CSS 클래스를 볼 수 있습니다. 이러한 클래스를 사용하여 이러한 유형의 포함에 대한 최대 너비를 설정할 수 있습니다.

    예를 들어 모든 포함에 대해 최대 너비를 설정하려는 경우 다음을 사용할 수 있습니다. 사용자 정의 CSS.

    
    .wp-block-embed {
        max-width: 900px!important;
    }
    

    다음을 사용하여 특정 oEmbed 제공자를 타겟팅할 수도 있습니다. .wp-block-embed-providername 수업. 예를 들어 Pinterest 임베드에 대해서만 최대 너비를 설정하려는 경우 다음 사용자 정의 CSS를 사용할 수 있습니다.

    
    .wp-block-embed-pinterest {
        max-width: 900px!important;
    }
    

    방법 4. WordPress 필터를 사용하여 oEmbed 최대 너비 설정

    이 마지막 방법을 사용하려면 WordPress 웹사이트에 사용자 정의 코드를 추가해야 합니다. 이전에 이 작업을 수행하지 않은 경우 에 대한 가이드를 살펴보세요. WordPress에서 사용자 정의 코드 조각을 쉽게 추가하는 방법.

    이 방법의 경우 oEmbeds의 기본 너비를 설정하기 위해 자체 코드를 WordPress에 추가합니다. 테마의 functions.php 파일에 다음 코드를 추가하거나 코드 조각 플러그인.

    
    add_filter( 'embed_defaults', 'wpbeginner_embed_defaults' );
     
    function wpbeginner_embed_defaults() {
        return array(
            'width'  => 400, 
            'height' => 280
        );
    }
    

    자신의 요구 사항에 맞게 높이 및 너비 속성을 조정하는 것을 잊지 마십시오.

    이 방법의 문제점은 포함된 콘텐츠에 ‘width’가 정의되어 있지 않은 경우에만 너비 속성을 적용한다는 것입니다. 포함 코드에 너비가 이미 포함되어 있으면 이 방법이 작동하지 않을 수 있습니다.

    보너스 팁

    소셜 미디어 플랫폼의 콘텐츠를 WordPress 웹사이트에 정기적으로 포함하는 경우 사용을 시작해야 합니다. 스매시 풍선.

    스매시 풍선

    그것은 WordPress를 위한 최고의 소셜 미디어 플러그인 쉽게 삽입할 수 있습니다. 맞춤형 소셜 미디어 피드 워드프레스에서.

    YouTube, Twitter 등과 같은 인기 있는 소셜 미디어 포함을 지원합니다. 또한 WordPress에서 지원하지 않는 Facebook 및 Instagram 콘텐츠를 포함할 수 있습니다.

    더 중요한 것은 모든 소셜 미디어 피드가 모바일 반응형이며 모든 WordPress 테마에서 작동한다는 것입니다.

    이 기사가 WordPress에서 oEmbed 최대 너비를 설정하는 방법을 배우는 데 도움이 되었기를 바랍니다. 당신은 또한 우리의 완전한 소셜 미디어 치트 시트 또는 우리의 전문가 비교 중소기업을 위한 최고의 라이브 채팅 소프트웨어.

    이 기사가 마음에 들면 구독하십시오. 유튜브 채널 WordPress 비디오 자습서용. 당신은 또한 우리를 찾을 수 있습니다 트위터 그리고 페이스북.

    Source link

    신고하기
'WordPress에서 oEmbed 최대 너비를 설정하는 방법(4가지 쉬운 방법)'에 답변달기
글쓴이 정보: