Open Entry in a Modal

Question

Unsure how to go about doing this. I'm looking to open a related entry in a modal on the same page. In an area, I have a list of houses. On click, I would like the user to open a modal and load the corresponding entry inside it.

Is there an easier way to do this other than AJAX loading it in?

Answer 1

Ajax is probably the easiest way when using something like Fancybox:

<a data-fancybox data-type="ajax" data-src="yoursite.com/houses/house-slug" href="javascript:;">
    House page
</a>

If your house page has content you want to hide when viewed in the modal you can detect whether or not Ajax was used to request the page:

{% if not craft.app.request.isAjax %}
    Your header code
{% endif }

You could also just include the house content on the page, but hidden and use fancybox to reveal it. This is possibly more accessible.