剛開始接觸WordPress時，在文章內Embed Youtube 影片最常遇到就是：因為<iframe>語法內指定了寬高， 所以當指定了適合desktop瀏覽的寬度時，mobile上會超出手機寬；指定適合mobile的寬度時，desktop看又會太小的問題。

解法搜尋一下就可以看到滿多教學，大致上就是在<iframe>外面多包一層<div>，透過CSS先設定<div>高度為0，再用padding-bottom這個屬性設成div寬度的56.25%(就是16:9)來實現RWD的效果，如下程式碼

.video-container { 
position: relative; 
padding-bottom: 56.25%; 
padding-top: 30px; 
height: 0; overflow: hidden; 
}
.video-container iframe, .video-container object, .video-container embed { 
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
}

可以參考：https://avexdesigns.com/blog/responsive-youtube-embed

不過最近遇到一個網站改版任務，需要把舊站所有文章全部匯入新站，這些舊文章大部分都有Embed YT影片，要一篇篇的編輯文章，把每個iframe包div實在是一個大工程。所以就試著用jQuery wrap()  語法，找出文章內的iframe，包上指定class 的div，即可完成任務

<script type="text/javascript">
    jQuery(document).ready(function(){
    jQuery("iframe").wrap("<div class='video-container'>"); 
    });
</script>

實驗後是可work的，不過我自己是覺得有可以精進的地方：

• 網站是用avada theme 做的，上述jQ code 是放在 Avada ->options-> Advanced-> code field 設定中的 Space before </body>欄位中，這代表全域網頁都會有這段code並執行，但其實並不需要，正確來說我只需要針對固定的post category執行這段程式即可。
• 承上，原本想說可以利用avada非常方便的layout功能：設定一個專屬於這個分類post 的layout，並在這個layout裡面放上述jQ code ，但這樣的做法並不會執行這段程式。目前研究問題在哪裡中

以上是程式初心者的一點點小小經驗談，如果有更好的解決方案也請先進多多指教。