💬

Embedding a comments section

How to embed a chat box

Here’s a step-by-step on how to embed a public web3-powered chat on your Bonfire Page.

0xEcho is a decentralized social engagement protocol, and they created what they call the first comment widget that can be embedded on any Web3 website so that users can chat and communicate in a decentralized, permission-less, and censorship-resistant environment. In simple terms, 0xEcho is the first embeddable web3 chat powered by decentralized storage and features like crypto tips. Try it here: https://0xecho.com/

Here’s a step-by-step guide on how to embed the chat widget on your site:

  1. Go to the 0xEcho site: https://0xecho.com
  2. Click on Get My Widget
  3. Choose URL as your Target URI Type
  4. Copy and paste your site’s URL on the Target URI field.
  5. Choose your desired features, like theme, comments, likes, tips, etc. (You can also add a description)
  6. Once you are done, click Generate.
  7. Copy the generated code.
  8. Go to the Bonfire page where you’d like to add the chat embed and add the embed block.
  9. Paste your code in the Embed Code field.
  10. For extra customization add the following code between frameborder="0” and ></iframe>
    11. height="500" width="900"

    These numbers control your chat box's height and width, so feel free to change then as you see fit.

    The final code should look something like this:

    <iframe src="https://embed.0xecho.com.ipns.page?color-theme=dark&desc=&has-h-padding=true&has-v-padding=true&modules=comment%2Ctip&receiver=charliecrown.eth&target_uri=https%3A%2F%2Fcharliecrown.xyz%2F" frameborder="0" height="500" width="900"></iframe>

    This is just an example*

  11. Click Save Changes
  12. Before you exit, please make sure you click Update Page to save all the changes.
  13. That's it! You have successfully added 0xEcho chat embed to your website.

🔥
www.bonfire.xyz

Website Roadmap Blog Newsletter

© Treehouse Technologies, Inc.