Boş kalan yeri ajax ile dolduracaksınız.

Önce bootstrap event lara bakıyoruz. https://getbootstrap.com/docs/4.0/components/modal/#events


$('#myModal').on('show.bs.modal', function (e) {
// do something...
})


show.bs.modal yani modal gözükünce eylem gerçekleştir demek.

Biz de modalımız ortaya çıkınca ajax ile html çağıracağız.


$('#abc').on('show.bs.modal', function (e) {
$.ajax({
type: 'POST',
url: 'https://site.com/wp-admin/admin-ajax.php',
data: { action: ajaxFonksiyonu },
beforeSend: function (xhr) {

},
error: function (request, status, error) {

},
success: function (response) {
$('.modal-body').html(response);
},
complete: function () {

},
});
})


Php tarafından html kodumuzu ajaxa gönderiyoruz.


function ajaxFonksiyonu() {
echo 'Html içeriği buraya';
exit();
}

add_action('wp_ajax_ajaxFonksiyonu', 'ajaxFonksiyonu');
add_action('wp_ajaxnopriv_ajaxFonksiyonu', 'ajaxFonksiyonu');