Ihr Menutech-Menü auf Ihrer Website einbetten

Standard-Einbettung (Standard embed)

Platzieren Sie den folgenden Code an der Stelle Ihrer Website, an der das Menü angezeigt werden soll:

<div id="menutech-container"></div>
<script>
  let url = 'ENTER YOUR MENU URL HERE';
  document.addEventListener("DOMContentLoaded", function() {
    fetch(url + '&embed=true')
        .then(response => response.text())
        .then(data => {
            document.getElementById('menutech-container').innerHTML = data;
        })
        .catch((error) => {
            console.error('Error:', error);
        });
  });
</script>

✏️ Ersetzen Sie ENTER YOUR MENU URL HERE durch die URL Ihres Menutech Digital Menu.

Isolierte Einbettung (Insulated embed)

Um den eingebetteten Code zu isolieren und ein Übergreifen von Stilen und Skripten zu verhindern, kann das Menü in ein "Shadow DOM" eingebettet werden, das von allen modernen Browsern unterstützt wird (ca. 95 % der Nutzer).

<div id="menutech-container"></div>
<script>
  document.addEventListener("DOMContentLoaded", function() {
    let container = document.getElementById('menutech-container');
    let shadow = container.attachShadow({mode: 'open'});
    let url = 'ENTER YOUR MENU URL HERE';
    fetch(url + '&embed=true')
        .then(response => response.text())
        .then(data => {
            let wrapper = document.createElement('div');
            wrapper.innerHTML = data;
            while (wrapper.firstChild) {
                shadow.appendChild(wrapper.firstChild);
            }
        })
        .catch((error) => {
            console.error('Error:', error);
        });
  });
</script>

✏️ Ersetzen Sie ENTER YOUR MENU URL HERE durch die URL Ihres Menutech Digital Menu.