[아보카도 에디션] 유튜브 반응형 적용하기 예전에 아보카도 에디션에서 사용했던 코드 들고왔다!

1. 모든 페이지에 적용하기 위해 head.sub.php의  </head> 바로 위에 해당 자바스크립트 코드를 넣는다. <script>와 </script> 사이를 피해서 넣기!

<script> //Youtube의 태그를 찾아서 video_wrapper 태그를 추가
    $(function () {
        $('iframe[src*="youtube.com"]').each(function () {
            $(this).wrap('<div class="video_wrapper"></div>');
        });
    });
</script>

2. css/ra0-content.css 에 해당 스타일 코드를 추가한다. 나는 그냥 최하단에 추가했음.

/* 유튜브 임베딩 반응형으로 넣기*/
.video_wrapper {
    width: 100%;
    max-width: 560px;
    max-height: 315px;
    aspect-ratio: 16 / 9;
    margin: 5px auto;
}
.video_wrapper iframe {
    width: 100%;
    height: 100%;
}