Calendly passt das Kalenderlayout an die Größe seines Containers an. Sie können das Layout und die Größe ändern, um besser zu Ihrer Website oder App zu passen.
Wählen Sie ein Layout basierend auf der Breite aus
Die Inline-Einbettung von Calendly verfügt über drei Layout-Stilarten. Der Stil hängt von der Breite des Containers ab (genannt "übergeordneter Container").
Großes Fensterlayout
Breite des übergeordneten Elements >= 1100px
Beispiel
<div class="calendly-inline-widget"
data-url="https://calendly.com/YOUR_LINK"
style="width:1100px;height:700px;"></div>
Mittleres Fenster-Layout
Breite des übergeordneten Elements < 1100px und >= 650px
Beispiel
<div class="calendly-inline-widget"
data-url="https://calendly.com/YOUR_LINK"
style="width:700px;height:700px;"></div>
Kleines Fensterlayout
Breite des Elements < 650px
Beispiel
<div class="calendly-inline-widget"
data-url="https://calendly.com/YOUR_LINK"
style="width:600px;height:700px;"></div>
Scrollleisten entfernen
Wenn Sie eine Scrollleiste innerhalb der Einbettung sehen:
- Erhöhen Sie die Höhe im Einbettungscode style="min-width:320px;height:750px;"
- Verwenden Sie data-resize="true" , um die automatische Größenänderung zu aktivieren
Beispiel:
<div
class="calendly-inline-widget"
data-url="https://calendly.com/your-link"
style="min-width:320px; height:750px;"
data-resize="true">
</div>
<script
type="text/javascript"
src="https://assets.calendly.com/assets/external/widget.js"
async>
</script>
Mindestbreite für Mobilgeräte
Calendly benötigt eine Breite von mindestens 320px, um auf Mobilgeräten korrekt angezeigt zu werden.
Wenn die Einbettung dezentriert oder abgeschnitten aussieht:
- Achten Sie auf zusätzliche Abstände oder Ränder auf Mobilgeräten.
- Stellen Sie sicher, dass der Container mindestens 320px breit ist.
Testen Sie Ihr Einbettungslayout
Nach dem Hinzufügen der Einbettung:
- Layout auf Desktop und Mobilgerät prüfen
- Verwenden Sie das Inspektionstool Ihres Browsers, um eine Vorschau verschiedener Größen anzuzeigen.
- Passen Sie die Größe oder die Ränder des Containers nach Bedarf an