Pull in and display extra content on a webpage without having to reload the whole page. It's handy for keeping things updated and flexible by loading bits of HTML from other places on the fly.

no_frills_cms_adapter.html

<div id="landingpageContent"></div>

<script>
	fetch("{{htmlFragmentUrl}}")
		.then(response => response.text())
		.then(html => {
			const range = document.createRange();
			range.selectNode(document.getElementById('landingpageContent'));
			const documentFragment = range.createContextualFragment(html);
			document.getElementById('landingpageContent').appendChild(documentFragment);
		})
		.catch(error => {
			console.error('Error fetching HTML fragment:', error);
		});
</script>