Einfaches Einbinden von kostenlosem AstroDNA BaZi Calculator auf Deiner Website
AstroDNA BaZi Calculator lässt sich als Plugin auf Deiner Website einbinden. Dazu muss lediglich der folgende HTML-Schnippsel in den Quelltext der Website eingefügt werden:
<embed src="https://plugin.astrodnabazicalculator.com/de-DE" />
Hinweis: Für englisch-sprachiges Layout wähle folgenden Parameter:
<embed src="https://plugin.astrodnabazicalculator.com/en" />
Insgesamt könnte das beispielsweise so aussehen, wobei die Position des Plugins natürlich frei wählbar ist:
<html>
<head>
<title>Meine Website</title>
</head>
<body>
<header>...</header>
<main>...</main>
<aside>
<embed src="https://plugin.astrodnabazicalculator.com/de-DE" />
</aside>
<footer>...</footer>
</body>
</html>
Es stehen einige Parameter zu Verfügung, um die Darstellung des Plugins nach Deinen Wünschen anzupassen.
| Parameter | Beschreibung | Format | Standard |
|---|---|---|---|
| cta | Text des Buttons | String, max. 30 Zeichen, Leerzeichen als %20 |
"Berechne dein Bazi Chart" |
| place-of-birth | Eingabefeld für den Geburtsort anzeigen | "0" (nein) oder "1" (ja) | "1" (ja) |
| font | Schriftart | "Poppins" oder "Lato" | "Poppins" |
| background | Hintergrundfarbe | Hexcode (ohne #) | 000000 mit Sternenhimmel |
| color | Farbe der Beschriftung | Hexcode (ohne #) | e5e7eb (hell-grau) |
| input-border-color | Rahmenfarbe für Eingabefelder + Farbe der Platzhalter | Hexcode (ohne #) | 9ca3af (dunkel-grau) |
| button-background | Hintergrundfarbe des Buttons | Hexcode (ohne #) | ffdd90 (gelb) |
| button-color | Textfarbe des Buttons | Hexcode (ohne #) | 000000 (schwarz) |
| checkbox-background | Hintergrundfarbe der Checkbox | Hexcode (ohne #) | f3f4f6 (grau) |
| expert | BaZi-Bezeichnungen in Moderner oder Experten-Sprache | "0" (Modern) oder "1" (Experte) | "0" (Modern) |
| ref | Dein Affiliate-Code | String, 15 Zeichen | (leer) |
Die Größe des Plugins hängt vom CSS Deiner Website ab. Wenn Du die Größe explizit pixelgenau festlegen möchtest, kannst Du das mit den Attributen width und height tun oder flexibler direkt im style-Attribut. Das Plugin füllt immer den verfügbaren Platz vollständig aus. Sorge möglichst dafür, dass das Plugin mindestens 400 Pixel in der Breite zur Verfügung hat.
Ein Beispiel mit allen Parametern könnte so aussehen:
<embed
src="https://plugin.astrodnabazicalculator.com/de-DE?cta=Jetzt%20berechnen
&place-of-birth=0
&font=Lato
&background=d9f99d
&color=365314
&input-border-color=166534
&button-background=b91c1c
&button-color=ffffff
&checkbox-background=84cc16
&expert=1
&ref=
"
width="400"
height="600"
/>
Wichtig: Bitte das src-Attribut in eine Zeile schreiben, also ohne Zeilenumbrüche. Die Zeilenumbrüche sind hier nur aus Gründen der Lesbarkeit eingefügt.