Astro
Astro setup guide
Human Reply puts a live chat on your site and brings every conversation to your team's Telegram group. On an Astro site, our integration adds it to every page with one key, and keeps it open as visitors move between pages. This guide covers setting it up, adding the integration, using it and removing it.
1Before you start
- Telegram. A Telegram account, and a group for your team with Topics turned on. You can make the group during setup.
- An Astro site, on Astro 4 or later, built and deployed the way you already do it.
- A payment card, for the seven-day free trial. Nothing is charged during the trial.
- About ten minutes.
2Start setup
- Go to humanreply.app/start and choose Other.
- Type your site's address, the one your visitors use.
- Press Start setup. Setup opens in your browser, and everything in it is saved as you go.
3Set up, in five steps
- Create your bot. Open BotFather in Telegram from the setup page (the first message is typed for you), choose a name, and paste the token BotFather gives you.
- Add it to your group. Add the bot to your team's group as an admin, and turn on Topics. The page checks as you go.
- Send a test lead. Write a message on the setup page and answer it from your phone, to see the whole loop once.
- Set your hours. Business hours, auto-away, and the ways a visitor can ask for a reply when nobody is free.
- Make your account. Your email and the six-digit code we send to it, then the plan: seven days free, then $12 a month, or $120 a year. You add your card on Stripe; nothing is charged during the trial, and the plan starts by itself when the trial ends unless you cancel before then.

4Add the integration
The last setup page shows a line for your site. Your site key is the part of it after data-site=, like rl_xxxxxxxx: it is all the integration needs.
- In your project, run this, and answer yes when Astro asks. It installs the integration and adds it to astro.config.mjs.
npx astro add @human-reply/astro - In astro.config.mjs, put your site key in it:
import { defineConfig } from "astro/config" import humanReply from "@human-reply/astro" export default defineConfig({ integrations: [humanReply({ siteKey: "rl_xxxxxxxx" })], }) - Build and deploy your site as you always do.
- Open your site once. The setup page turns to "You're live."
The chat is on every page. If your site uses Astro's client router (<ClientRouter />), it stays open as visitors move between pages.
The integration on npm: @human-reply/astro. Its code is on GitHub.
5Or paste the line
Without the integration, the line from the setup page works too. Paste it into the <head> of the layout every page uses, like src/layouts/Layout.astro, then build and deploy.
<script src="https://humanreply.app/embed.js" data-site="rl_xxxxxxxx" defer></script>The line from the setup page. Yours carries your site's own key in place of rl_xxxxxxxx.
If your site uses Astro's client router, use the integration instead: with the line alone, the chat disappears after the first page change.
6Make it yours
Sign in at humanreply.app and open your dashboard. Under Customize:
- Design: your logo and team name, the colour, light or dark, the font and size, the launcher's label.
- Position: bottom left or bottom right, the space from the edges, and the stack order if something on your site covers the bubble.
- Language: the bubble's language, your greetings, and any of its words.
- Behavior: the ways to reply you offer, and what visitors see about your team.
Changes are saved as you make them and reach your site at once. There is nothing to change in your project, and nothing to deploy.

7Answer your visitors
- Every conversation opens as its own topic in your Telegram group, with a card that says who is writing: the page, where they came from, how many times they have visited, their language and device.
- Tap Claim, or just reply. Your answer shows on your site in seconds. Photos and files work both ways.
- React 👀 to a message to show the visitor it has been seen.
- Won or Lost closes the conversation and keeps it as a record.
- In the Desk topic, tap I'm available or I'm away. When nobody is free, the chat says so and asks the visitor where the reply should go.
- The dashboard shows today's chats, every transcript, and analytics: conversations, first-reply time and ratings, by page and by person.
8Your plan
Settings › Plan & billing shows when the trial ends and what comes next. Manage billing opens Stripe, where you can change the card, see invoices, switch between monthly and yearly, or cancel. If the plan ends, the chat leaves your site until you start it again; your settings, your team and your conversations are kept.
9Remove Human Reply
- Take
humanReply(…)and its import out of astro.config.mjs, then runnpm uninstall @human-reply/astro. If you pasted the line instead, delete it from your layout. - Build and deploy. The chat leaves your site with that version.
Removing the integration doesn't end your plan: cancel it under Settings › Plan & billing. To delete your Human Reply account and its conversations, write to hello@send.humanreply.app.
10If something isn't working
- The build log says "Add your site key". The integration is in astro.config.mjs without one. Put yours in:
humanReply({ siteKey: "rl_…" }). - The setup page keeps listening. It listens for your published site. Your local dev server shows the chat but doesn't count: deploy, then open your site's own address.
- The chat disappears after the first page change. Your site uses Astro's client router with the line pasted into a layout. Add the integration instead.
- Settings › Connection says "Not on your site yet." The site isn't deployed with the integration yet, or nobody has opened it since. The row shows the line again, with your site key in it.
- Anything else: hello@send.humanreply.app. A person answers.