File size: 1,481 Bytes
2dd2de0
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Embed demo — your website</title>
<style>
  body { font-family: Georgia, serif; margin: 0; color: #222; background: #fafafa; }
  .hero { max-width: 760px; margin: 0 auto; padding: 80px 24px; }
  h1 { font-size: 38px; }
  p { font-size: 18px; line-height: 1.7; color: #444; }
  .note { background: #fff; border: 1px solid #e5e5e5; border-radius: 10px; padding: 16px 20px; margin-top: 30px; font-size: 15px; }
  code { background: #f0f0f0; padding: 2px 6px; border-radius: 4px; font-family: monospace; }
</style>
</head>
<body>
  <div class="hero">
    <h1>This is a pretend website.</h1>
    <p>Imagine this is your company's webpage. The only thing added to it is a
       single <code>&lt;script&gt;</code> tag at the bottom — and now there's an
       Antern Bot chat button in the corner. Click the 💬 button bottom-right.</p>
    <div class="note">
      The chat bubble is the embeddable widget. On a real site you'd paste the
      one-line snippet from <code>EMBED.md</code> into your HTML.
    </div>
  </div>

  <!-- The embed snippet (served from the same host in this demo) -->
  <script src="/static/widget.js"
          data-api=""
          data-title="Antern Bot"
          data-accent="#4f8cff"
          data-greeting="Hi! Ask me about candidates, requirements, applications, and more."></script>
</body>
</html>