Um den Besuchern Eurer Website das Einkaufserlebnis zu erleichtern, haben wir die Möglichkeit, mit einem Experten zu sprechen, in das Design Eurer Webseite integriert. Diese Funktion ist optional und lässt sich innerhalb weniger Minuten einrichten. Sie wird bei Bedarf auf der Produktdetailseite eingefügt.

Füge einfach den onclick-event ="amazd.toggle()" hinzu

Wenn Du den folgenden Button zu Eurer Website hinzufügst, kannst Du das Widget öffnen, wenn Du auf den Button klickst.

<p>
<button onclick="amazd.toggle()">
Contact our experts
</button>

Dies ist die einfachste Implementierung eines Buttons.

Bild & Button

Du kannst dem Button eine Klasse geben, um ihn nahtlos in deine Webseite zu integrieren oder ihn über HTML/CSS zu ändern.

1. Falls Du ein Bild hinter dem Button anzeigen möchtest, kannst Du einfach den HTML-Code hinzufügen und das Bild dahinter platzieren.

<div class="container">
<img src="img_snow.jpg" alt="Snow">
<button onclick="amazd.toggle()" class="btn">Button</button>
</div>

2. Füge das entsprechende CSS hinzu

/* Container needed to position the button. Adjust the width as needed */
.container {
position: relative;
width: 50%;
}
/* Make the image responsive */
.container img {
width: 100%;
height: auto;
}
/* Style the button and place it in the middle of the container/image */
.container .btn {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
background-color: #555;
color: white;
font-size: 16px;
padding: 12px 24px;
border: none;
cursor: pointer;
border-radius: 5px;
}
.container .btn:hover {
background-color: black;
}