I want to show users our privacy text in a modal. The link which triggers the modal is in the footer - so on every page. The content comes from our own API endpoint like this: https://www.example.com/api/v1/legals/privacy

This is my current modal using UIkit (getuikit.com):

<a href="#modal-privacy" uk-toggle>Show Privacy Text</a>

<div id="modal-privacy" class="uk-modal-container" uk-modal>
    <div class="uk-modal-dialog" uk-overflow-auto>
        <button class="uk-modal-close-default" type="button" uk-close></button>
        <div class="uk-modal-header">
            <h2 class="uk-h3 uk-modal-title">Privacy</h2>
        </div>
        <div class="uk-modal-body">
          <?php
                  $response = file_get_contents( 'https://www.example.com/api/v1/legals/privacy');
                  echo json_decode($response);
          ?>
        </div>
        <div class="uk-modal-footer">
            <p class="uk-text-right"><button class="uk-button uk-button-default uk-modal-close" type="button">Close</button></p>
        </div>
    </div>
</div>

The problem with my current solution is that the content is loaded by PHP which blocks the rendering of the page and with that affecting the performance of the website. How can I load the content of the modal when opened instead of the initial page view?

Any help appreciated! I can't write Javascript so a working snippet would be great! 😊

Greets