將此程式碼貼至footer.php即可啟用圖片放大功能。透過抓取WordPress文章中圖片的srcset屬性，在點擊時顯示於Bootstrap彈出視窗中，實現圖片放大效果。程式碼包含必要的HTML結構和jQuery事件處理。
直接把下面這一整段貼到你的footer.php中就可以使用了。
在WordPress預設的設定中，文章中的圖片會自動以適合的尺寸載入，並在srcset屬性中儲存所有尺寸的連結。我們要做的事情就是把srcset抓出來，並顯示在彈出式視窗的img中。
<!--- Bootstrap Modal Button --->
<button id="post_img_zoom_btn" type="hidden" data-toggle="modal" data-target="#post_img_zoom_container">
BUTTON
</button>
<!--- Bootstrap Modal --->
<div class="modal fade" id="post_zoomed_img_container" tabindex="-1" role="dialog" aria-labelledby="post_img_zoom_containerTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<img src="">
</div>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(document).ready(function($){
var zoom_img = $('#post_zoomed_img_container .modal-body img');
$('article img').click(function(){
zoom_img.attr('src', $(this).attr('src'));
zoom_img.attr('srcset', $(this).attr('srcset'));
$('#post_img_zoom_btn').click();
});
</script>
