Setting up your custom AI chatbot on any website

Step 1: Customizing Your Chatbot:

The Rooftops AI Chatbot able to be configured just for your business.

Example:

Example of a Rooftops AI Customized Chatbot

1. Chatbot Name

Start by naming your chatbot. This is the name that visitors will see when they interact with the bot. Business names or friendly names work best here.

For Example:
Rooftops AI

2. Welcome Message

Next, write a friendly and inviting welcome message. This is the first message that visitors will see when they open the chatbot window.

For Example:
This is what your AI chatbot could look like. Try me.

3. Logo

Upload a logo for your chatbot. Make sure the dimensions are 100px by 100px. Light-colored logos are recommended.

For Example:

4. Notifications Email

Enter the email address where you'd like to receive notifications, leads, and call requests generated through the chatbot.

For Example:
team@mycompany.com

5. Industry

Choose the industry your business belongs to. This helps the bot understand the context and tailor its responses.

For Example:
Roofing Contractor

6. Business Phone

Provide the business phone number. This allows the chatbot to guide visitors on how to get in touch with you.

For Example:
555-555-5555

7. Business Address

If you have a physical business address, enter it here. If not, mention how your business operates.

For Example:
123 Main Street City, State Postal Code
Or just say: We don't have a physical address

8. Business Hours

Provide the business hours. Be as specific as possible to inform the bot and your visitors.

For Example:
Monday - Friday 8-5

Or just say: Normal business hours, but we hustle so if you need us after hours, give us a shout.

9. Describe Your Services

Describe the services your business provides. This informs the bot on how to assist people in learning about your services and offerings.

For Example:
We help contractors, roofers, and other small businesses scale their sales, marketing, and operations with next-generation AI technology.

10. Custom Background Color

Finally, customize the background color of your chatbot. If your logo is light, use a dark background color.

For Example:
Choose a dark shade like #000000 if your logo is light.

And that's it! Your chatbot is now configured and ready to engage with your visitors. Enjoy the seamless experience that Rooftops AI provides.

Lastly, click Generate Embed Code and copy the generated code to your clipboard.

Step 2: Installing Your Chatbot

With your newly generated chatbot embed code, you are ready to install the chatbot on your website.

The Rooftops AI Chatbot is built to work on just about any website. Below is a simple step by step guide for some of the most popular website content management systems. If you have someone who manages your website for you, please consult them before continuing.

Website Builders:

  1. Squarespace
  2. Webflow
  3. Wix
  4. WordPress
  5. Weebly
  6. GoDaddy
  7. BigCommerce
  8. HubSpot
  9. Any other website

1. Squarespace

Step 1: Log in to your Squarespace account and go to the Home Menu.
Step 2: Click on 'Settings'.
Step 3: Under 'Website', select 'Advanced'.
Step 4: Click on 'Code Injection'.
Step 5: Paste your chatbot code into the 'Header' field.
Step 6: Click 'Save'.

2. Webflow

Step 1: Open your Webflow dashboard.
Step 2: Select your project and click on 'Project Settings'.
Step 3: Navigate to the 'Custom Code' tab.
Step 4: In the 'Head Code' section, paste your chatbot code.
Step 5: Save changes and publish your site.

3. Wix

Step 1: Sign in to your Wix account.
Step 2: Go to 'Site Actions' and click on 'Edit Site'.
Step 3: Click on 'Menus & Pages' on the left sidebar.
Step 4: Click on 'Settings' (the cog icon).
Step 5: Navigate to the 'Advanced' section and select 'Custom Code'.
Step 6: Paste your chatbot code into the 'Head' section.
Step 7: Save and publish your changes.

4. WordPress

Step 1: Log in to your WordPress dashboard.
Step 2: Navigate to 'Appearance' and then 'Theme Editor'.
Step 3: Locate the header.php file.
Step 4: Insert your chatbot code right before the closing </head> tag.
Step 5: Update the file.

Note: Editing the header.php file directly can be risky. Make sure to backup your site before making any changes.

5. Weebly

Step 1: Log in to your Weebly account.
Step 2: Select 'Edit Site'.
Step 3: Click on 'Settings'.
Step 4: Navigate to 'SEO'.
Step 5: Paste your chatbot code in the 'Header Code' box.
Step 6: Save and publish your site.

6. GoDaddy

Step 1: Sign in to your GoDaddy account.
Step 2: Navigate to 'My Products' and choose your website.
Step 3: Click on 'Edit Site'.
Step 4: Navigate to 'Settings' and then 'Site Settings'.
Step 5: Click on 'Header HTML' and paste your chatbot code.
Step 6: Save and publish your changes.

7. BigCommerce

Step 1: Log in to your BigCommerce dashboard.
Step 2: Navigate to 'Advanced Settings'.
Step 3: Click on 'Web Analytics'.
Step 4: Choose 'Google Analytics' and paste your chatbot code.
Step 5: Save your changes.

Note: BigCommerce uses Google Analytics for custom codes, but this will work for your chatbot code as well.

8. HubSpot

Step 1: Log in to your HubSpot account.
Step 2: Navigate to 'Settings'.
Step 3: Go to 'Website' and then 'Pages'.
Step 4: Click on the 'Templates' tab.
Step 5: Edit your 'Header' template and paste your chatbot code.
Step 6: Save and publish your changes.

9. Any Other Website

Step 1: Open the website code section

Step 2: Locate the <head> tag.

Step 3: Paste the embed code anywhere before the </head> tag.

For additional help troubleshooting any issues, don't hesitate to contact us for support.

And there you have it! With these step-by-step guides, you should be able to effortlessly install your custom chatbot on almost any platform. Happy chatting!

Start customizing your chatbot today.

Our features

AI Creator Studio

Professional content and strategy generated in seconds saving you thousands each year.

Explore the Creator Studio

Help Center

Learn How to Use AI Like a Boss

Watch tutorials and learn how to maximize AI to save you time and money and scale your business.

Learn more

Try it Free

No Risk 3-Day Free Trial

Access the full power of AI for your business today free for 3 days and if you like us, stick around for while.

Start Your Trial