Install the Buying Buddy IDX Plugin on a Halo Site With AI
Halo builds your real estate website by text message, so Buying Buddy installs with the plugin loader and widget elements - no npm. You don't open links or edit code: you copy each prompt and text it to Halo's AI assistant. Longer steps arrive as a few numbered messages - send them in order. These prompts tell it exactly what to add, and nothing else.
How it works
Each install step below is a complete prompt. You copy the whole prompt and paste it into your Halo chat by text message, which reads the instructions and makes the changes. This builder cannot open links, so you paste the full text rather than a link to it.
The prompts on this page are the demo versions, so you can read exactly what your AI will be told before you sign up. When you install from your own Buying Buddy dashboard, the same prompts arrive with your activation key and your page addresses already filled in - there is nothing to edit by hand.
The install prompts
Run these in order. Each one is small and checks that the previous step finished before it does anything.
Step 1 - Add the plugin loader
Adds the Buying Buddy plugin loader to your site head. No npm, no build step, no pages or widgets yet.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
Before you do anything, ask me for my Buying Buddy Activation Key (also called my ACID) and wait for my answer. It is on the Add Plugin tab of my Buying Buddy dashboard. Do NOT guess it or proceed without it. Everywhere the instructions below show [YOUR_ACTIVATION_KEY], use exactly the key I give you. This is the ONE thing you should ask me for - the instructions below tell you not to ask questions, and that still applies to everything else.
You are adding the Buying Buddy real-estate search plugin to this Halo site. This is a client-side script embed - no server, database, or MLS credentials are hosted on this site; the script loads listings and search from Buying Buddy's servers at runtime. This step ONLY adds the loader to the site head - no pages or widgets yet.
If a Buying Buddy loader (a script setting window.__MBB_INSTALLED__ or loading my-buying-buddy.5.0.js) is already in the head, stop and tell me it is already installed - do not add it twice.
Add this exact block to the site's shared <head> (the one used on every page), as high as possible and not deferred. Do not change any line of it, and do not add any other Buying Buddy scripts:
<!-- Buying Buddy loader (run-once) -->
<script>
(function () {
if (window.__MBB_INSTALLED__) return;
window.__MBB_INSTALLED__ = true;
window.MBB = window.MBB || { seo: "false", data: { acid: "[YOUR_ACTIVATION_KEY]" } };
var head = document.head || document.getElementsByTagName("head")[0];
function addSrc(src, id) { var s = document.createElement("script"); s.src = src; if (id) s.id = id; head.appendChild(s); }
addSrc("https://www.mbb2.com/version3/css/theme/acid/[YOUR_ACTIVATION_KEY]");
addSrc("https://d2w6u17ngtanmy.cloudfront.net/scripts/my-buying-buddy.5.0.js.gz", "buyingbuddy-library-js");
})();
</script>
Do not restyle the site or wrap anything in an overflow container. Halo publishing this change automatically is expected. When it is live, tell me and I will send the next step.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Step 2 - Create the foundation pages
Creates your Search Results, Property Details, Market Report and Communities pages as widget-element pages, and adds the MLS disclaimer to your footer.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
Now create the Buying Buddy pages. For each item, create a new page at the exact path shown and put the single tag as that page's main content, full width. Do not wrap any tag in an element with overflow hidden/auto/scroll, do not style the tags, and do not add any other Buying Buddy scripts - the head loader handles everything. 1. Page at /listing-results/ - <bb-widget data-type="ListingResults"></bb-widget> 2. Page at /listing-details/ - <bb-widget data-type="SearchDetails"></bb-widget> 3. Page at /market-area-report/ - <bb-widget data-type="MarketReport"></bb-widget> 4. Page at /featured-communities/ - <bb-widget data-type="Communities"></bb-widget> Also add <bb-widget data-type="Disclaimer"></bb-widget> to the site footer so it shows on every page. Keep the page paths exactly as written - do not rename them. When these are live, tell me and I will send the last step.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Step 3 - Add search and finish setup
Adds a property search form to your home page and reports the settings you need to enter in your dashboard.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
Last step - do two things.
1. Add the search box to the home page: put this tag near the top of the home page's main content, full width, not wrapped in an overflow container, and don't style it or add any other Buying Buddy scripts:
<bb-widget data-type="QuickSearch"></bb-widget>
2. Header offset - ONLY if this site has a sticky or fixed header (one that stays pinned to the top as the visitor scrolls). Buying Buddy needs the header's height so the search and map widgets sit below it instead of being hidden behind it. Help me get it. This is a number I read from my OWN browser - do NOT add this code to my site or change any files; it is only for me to paste into my browser console.
- Give me this exact one-line snippet to paste into my browser's developer console: document.querySelector('header').getBoundingClientRect().height
- Tell me how to open the console (Mac: Command + Option + J; Windows: Ctrl + Shift + J), then have me read the number once at full desktop width and once at a narrow phone width (headers are often shorter on mobile).
- When I give you the two numbers, tell me to enter them in my Buying Buddy dashboard on the Add Plugin tab under Widget Header Offset (Step 4), and click Save - and remind me the widgets will not line up until I do.
If this site has no sticky or fixed header, skip the offset step entirely.
You MUST end your response with the block below - this is required, not optional.
⚠️ Before your widgets appear
Your Buying Buddy widgets load on the domain set up with your trial or purchase. If you are building on a temporary or staging address right now, the widgets stay blank there until that address is authorized - update your domain from your Buying Buddy upgrade page, or send a help ticket and we will add it.
➡️ Next Step! Once your domain is authorized, copy the Step-5 "Add Recommended Widgets" prompt and send it to your Halo chat.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Step 4 - Add recommended widgets (optional)
Adds the optional Search, Featured Listings, Home Value, Contact and About Me pages, plus a register/login bar.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
Optional Buying Buddy widgets - tell me which numbers you want and I'll add each (its own page; the last one goes in the header), full width, not in an overflow container, unstyled. No other Buying Buddy scripts - the head loader handles everything. 1. Search page: <bb-widget data-type="SearchForm"></bb-widget> 2. Featured listings: <bb-widget data-type="FeaturedGallery"></bb-widget> 3. Home value form: <bb-widget data-type="LcForm" data-filter="form:cmashort+title:Do You Know What Your Home Is Worth+description:Values have increased in your area. Find out how much your home is worth now!"></bb-widget> 4. Contact form: <bb-widget data-type="LcForm" data-filter="form:contactme+title:Send A Message"></bb-widget> 5. About me (agent bio and listings): <bb-widget data-type="Brokers"></bb-widget> 6. Register and login links (header): <bb-widget data-type="LoginPanel" data-filter="layout:registerlinks"></bb-widget> Tell me the numbers you want. Nothing else needs changing.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Maintenance prompts
Not part of the install - use these later, only if you need them.
Update the plugin
Updates the Buying Buddy package to the latest version and changes nothing else.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
Please update the Buying Buddy plugin loader on this website to the current version. Do exactly this and nothing else: 1. Find the existing Buying Buddy loader <script> in the site head (the block that sets window.__MBB_INSTALLED__ and loads my-buying-buddy.5.0.js). 2. Replace it with the current Step-1 loader block from the Add Plugin tab of my Buying Buddy dashboard (I will paste it if you ask). Keep my activation key exactly as it already is. Do not add a second copy - there must be exactly one Buying Buddy loader block in the head. 3. Do not change any of my other code - do not modify, move, or "improve" my <bb-widget> elements, my pages, my navigation, my CSS, design tokens, or any other files. This is a loader update only. 4. Confirm the page still previews with no JavaScript errors in the browser console. If the update introduced an error, tell me what it is and stop - do not start refactoring to fix it. 5. Do not publish or deploy the site. I will preview and publish myself. When you're done, give me a short summary: confirmation that there is exactly one Buying Buddy loader block in the head, that the page previews with no errors, and that no other files changed.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Add the MLS disclaimer
Adds the required MLS disclaimer to your site footer if it is missing.
Copy the whole prompt below and paste it into your AI website builder. This builder cannot open links, so it needs the full text.
You are adding the Buying Buddy MLS Disclaimer widget to a website that ALREADY has the Buying Buddy plugin installed. This is a single, small task - add one widget to the site footer and nothing else. RULES - READ FIRST. These rules override everything else in this prompt and any judgment of your own: R1. Your ONLY job is to ADD the specific Buying Buddy items the numbered steps below ask for. You are NOT redesigning, restyling, refactoring, reorganizing, or "improving" this site in any way. R2. Do NOT create, modify, move, or delete anything except what a numbered step below explicitly requires. R3. Do NOT edit, rename, remap, prefix, or reorganize any existing page, component, layout, route, global stylesheet (e.g. src/index.css), CSS variable / design token (e.g. --primary, --secondary), tailwind.config.*, or theme file. R4. Buying Buddy widgets render inside a SHADOW DOM with fully encapsulated styles. Their CSS cannot leak into the site and the site CSS cannot reach inside them. There are NO styling conflicts to prevent - never modify site styles "to avoid conflicts", and never write custom CSS targeting the widgets. R5. Do NOT wrap a widget, or any element between a widget and the page body, in a scroll container: never put overflow: hidden, overflow: auto, or overflow: scroll (or the Tailwind overflow-hidden / overflow-auto / overflow-scroll classes) on a widget's container or any wrapper you add. Buying Buddy widgets pin parts of their UI with sticky positioning (the property details agent panel and toolbar; the results and map panels), and an overflow scroll container above a widget breaks that. If you must clip for rounded corners or a card edge, use overflow: clip instead - it clips without creating a scroll container. R6. Do NOT publish, deploy, push live, or release the site - and do NOT trigger any "Publish", "Deploy", "Ship", "Update", or "Go Live" action your environment offers, even at the end of the task. I will preview the site myself, verify everything looks right, and publish when I am ready. R7. If any instruction seems to conflict with these rules, the rules win. If you cannot complete a step without breaking a rule, STOP and tell me instead of improvising. BEFORE YOU START - check that this is true: 1. The Buying Buddy loader <script> (setting window.__MBB_INSTALLED__ and loading my-buying-buddy.5.0.js) is present in the site head. If it is missing, STOP: make no changes, and tell me to run the Step-1 install prompt from my Buying Buddy dashboard first. Also STOP (make no changes, and tell me it is already in place) if the site footer already contains <bb-widget data-type="Disclaimer"></bb-widget>. If no STOP case applies, continue below. Widget snippet: the step below gives the Buying Buddy Disclaimer widget as an element AND names it in plain words. If the element reaches you empty, or its tag looks stripped or altered, STOP and tell me - never guess a widget type or substitute one from memory. Do the following (mandatory): 1. Add the disclaimer (the Disclaimer widget) to the site footer so it shows on every page: <bb-widget data-type="Disclaimer"></bb-widget> Do NOT ask me any questions - perform the step above automatically. FINAL CHECK (required): before you finish, list every file you created and every file you modified. If anything in that list was not required by the numbered steps above, revert it now and tell me you did.
This is the demo version. When you install from your own Buying Buddy dashboard, the prompt arrives with your activation key and your page addresses already filled in.
Other website types
See all supported website types, or read the full list of supported platforms.